/*
Theme Name: KC Easy Charge
Theme URI: https://kcechargz.in
Author: KC Easy Chargz
Description: Custom single-page landing theme for KC Easy Chargz (EV charging infrastructure). Converted 1:1 from the original HTML/CSS/JS site. All content (hero, plans, services, why us, contact, footer) is editable from WordPress Admin – no page builder or paid plugin required.
Version: 1.0.2
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kc-easy-charge
Tags: one-column, custom-menu, custom-logo, featured-images, theme-options, translation-ready
*/

/* The design itself lives in assets/css/styles.css (unchanged from the HTML site).
   This file only holds WordPress-specific additions. */

/* ---- Grid hardening: tracks can never grow wider than their share (same 4 / 2 / 1 layout as the original) ---- */
.plans, .solutions { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.plan, .sol, .why__item { min-width: 0; }
@media (max-width: 1080px) { .plans, .solutions { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .plans { grid-template-columns: minmax(0, 1fr); } } /* .solutions becomes the swipe carousel in styles.css */

/* ---- Logged-in admin bar: keep the fixed header + progress bar below it ---- */
.admin-bar .header { top: 32px; }
.admin-bar .progress { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .header, .admin-bar .progress { top: 46px; }
}
@media (max-width: 600px) {
  .admin-bar .header, .admin-bar .progress { top: 0; }
}

/* ---- Custom logo uploaded in Site Identity ---- */
.logo-img { height: 46px; width: auto; max-width: 180px; object-fit: contain; display: block; }
.logo--light .logo-img { background: #fff; border-radius: 10px; padding: 4px 8px; height: 52px; }
@media (max-width: 900px) { .logo-img { height: 40px; } }

/* ---- Optional text under a plan / intro above the ticker (empty by default) ---- */
.plan__desc { font-size: .76rem; color: #8a98aa; margin: -8px 0 18px; }
@media (max-width: 620px) { .plan__desc { grid-column: 1 / -1; margin: -4px 0 14px; } }
.ticker__intro { text-align: center; padding: 28px 20px 4px; max-width: 760px; margin-inline: auto; }
.ticker__intro h2 { font-size: clamp(1.4rem, 3vw, 2rem); }
.ticker__intro p { margin-top: 8px; font-size: .95rem; }

/* ---- Inner templates (page / post / 404 / blog index) ---- */
.page-main { padding: 140px 0 90px; min-height: 60vh; background: var(--bg); }
@media (max-width: 900px) { .page-main { padding: 104px 0 56px; } }
.container--narrow { width: min(820px, 100% - 40px); }
.entry-title { font-size: clamp(2rem, 4.2vw, 3rem); font-weight: 700; margin-bottom: 18px; }
.entry-meta, .post-card__meta { font-size: .8rem; color: #8a98aa; margin-bottom: 18px; }
.entry-thumb { margin-bottom: 28px; border-radius: var(--radius); overflow: hidden; }
.entry-thumb img { width: 100%; height: auto; }
.entry-content > * + * { margin-top: 1.1em; }
.entry-content h2, .entry-content h3, .entry-content h4 { margin-top: 1.6em; }
.entry-content h2 { font-size: 1.7rem; } .entry-content h3 { font-size: 1.3rem; } .entry-content h4 { font-size: 1.1rem; }
.entry-content a { color: var(--green-2); text-decoration: underline; }
.entry-content ul, .entry-content ol { padding-left: 1.4em; }
.entry-content ul { list-style: disc; } .entry-content ol { list-style: decimal; }
.entry-content blockquote { border-left: 4px solid var(--green); padding: 4px 0 4px 18px; color: var(--navy); }
.entry-content img { height: auto; border-radius: 14px; }
.entry-content table { width: 100%; border-collapse: collapse; }
.entry-content th, .entry-content td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; }
.post-list { display: grid; gap: 22px; margin-top: 26px; }
.post-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow-sm); }
.post-card__img { display: block; margin: -24px -24px 18px; overflow: hidden; border-radius: var(--radius) var(--radius) 0 0; }
.post-card__img img { width: 100%; height: auto; }
.post-card__title a:hover { color: var(--green); }
.navigation.pagination, .post-navigation { margin-top: 34px; }
.nav-links { display: flex; gap: 10px; flex-wrap: wrap; justify-content: space-between; }
.page-numbers { padding: 8px 14px; border-radius: 10px; background: #fff; border: 1px solid var(--line); }
.page-numbers.current { background: var(--navy); color: #fff; border-color: var(--navy); }
.not-found { text-align: center; }
.comments-area { margin-top: 48px; }
.comment-list { display: grid; gap: 16px; margin: 18px 0; }
.comment-list .children { margin-left: 22px; margin-top: 14px; display: grid; gap: 14px; }
.comment-body { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; }
.comment-respond input[type="text"], .comment-respond input[type="email"], .comment-respond input[type="url"], .comment-respond textarea { width: 100%; font: inherit; padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 12px; background: #fff; }
.comment-respond .submit { background: var(--navy); color: #fff; padding: 12px 22px; border-radius: 12px; font-weight: 600; }

/* ---- WordPress core classes ---- */
.alignleft { float: left; margin: 0 1.2em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1.2em; }
.aligncenter { display: block; margin-inline: auto; }
.alignwide, .alignfull { max-width: 100%; }
.wp-caption { max-width: 100%; }
.wp-caption-text, .gallery-caption { font-size: .8rem; color: #8a98aa; text-align: center; }
.sticky { border-color: var(--green); }
.bypostauthor { }
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }
.screen-reader-text:focus { background: #fff; clip: auto; clip-path: none; color: var(--navy); display: block; height: auto; left: 8px; padding: 12px 18px; top: 8px; width: auto; z-index: 100000; }
