/*
Theme Name: The Good City Modern
Theme URI: https://thegoodcity.in
Author: Raintree Media
Author URI: https://raintreemedia.com
Description: A modern editorial-first WordPress theme for The Good City.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: the-good-city-modern
*/

@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --bg:#f5f1ea;
  --surface:#fbf8f3;
  --surface-2:#f0ebe4;
  --text:#171411;
  --muted:#6c655d;
  --line:#d9d0c6;
  --accent:#e56b2e;
  --accent-dark:#bf4f17;
  --max:1240px;
  --narrow:760px;
  --r:18px;
  --shadow:0 20px 50px rgba(23,20,17,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',system-ui,sans-serif;font-size:16px;line-height:1.6;color:var(--text);background:var(--bg)}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
button,input,textarea{font:inherit}
.site-main,.site-footer-inner,.site-header-inner,.tgc-wrap{width:min(calc(100% - 32px),var(--max));margin:0 auto}
.skip-link{position:absolute;left:-9999px;top:auto}.skip-link:focus{left:16px;top:16px;background:#fff;padding:10px 14px;z-index:99}
.site-header{position:sticky;top:0;z-index:40;background:rgba(245,241,234,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(23,20,17,.08)}
.site-header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 0}
.brand-mark{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.02em}
.brand-mark svg{width:34px;height:34px}
.brand-mark small{display:block;color:var(--muted);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.main-nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;font-size:14px;color:var(--muted)}
.main-nav a:hover,.main-nav .current-menu-item>a{color:var(--text)}
.header-cta{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;background:var(--text);color:#fff;font-size:14px;font-weight:700}
.home-hero{padding:42px 0 22px}
.home-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:28px;align-items:stretch}
.hero-feature{background:var(--surface);border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:var(--shadow)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.eyebrow::before{content:'';width:24px;height:1px;background:var(--accent)}
.hero-title{font-family:'Instrument Serif',serif;font-size:clamp(44px,7vw,84px);line-height:.96;letter-spacing:-.03em;max-width:10ch;margin:0 0 16px}
.hero-copy{font-size:18px;max-width:56ch;color:#332d28;margin:0 0 24px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;border-radius:999px;font-weight:700}
.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-dark)}
.btn-secondary{border:1px solid var(--line);background:transparent}
.hero-meta{display:grid;gap:18px}
.meta-card,.newsletter-card,.section-card{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:22px}
.meta-kicker{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.meta-value{font-family:'Instrument Serif',serif;font-size:38px;line-height:1.05;margin:10px 0 8px}
.meta-note{color:var(--muted);font-size:14px}
.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;background:var(--accent);overflow:hidden}
.ticker-track{display:flex;gap:2rem;white-space:nowrap;animation:ticker 34s linear infinite;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#1a1612}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.section{padding:28px 0 18px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}
.section-head h2{margin:0;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.section-link{font-size:14px;color:var(--muted)}
.story-grid{display:grid;grid-template-columns:1.15fr .85fr .85fr;gap:20px}
.story-card{background:var(--surface);border:1px solid var(--line);border-radius:24px;overflow:hidden}
.story-media{aspect-ratio:16/10;background:linear-gradient(135deg,#ddd2c5,#f5ede4)}
.story-body{padding:18px}
.story-tag{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--accent-dark);font-weight:800}
.story-card h3{font-family:'Instrument Serif',serif;font-size:30px;line-height:1.05;margin:10px 0 10px}
.story-card p{margin:0;color:var(--muted);font-size:15px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.list-card ul{list-style:none;padding:0;margin:16px 0 0}
.list-card li+li{border-top:1px solid var(--line)}
.list-card a{display:block;padding:14px 0}
.list-card strong{display:block;font-size:18px;line-height:1.2;margin-bottom:4px}
.list-card span{font-size:14px;color:var(--muted)}
.newsletter-card form{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.newsletter-card input{flex:1 1 240px;padding:14px 16px;border-radius:999px;border:1px solid var(--line);background:#fff}
.site-footer{padding:36px 0 54px;border-top:1px solid var(--line);margin-top:28px}.site-footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:14px}
.entry-content,.page-content{width:min(calc(100% - 32px),var(--narrow));margin:40px auto}.entry-title,.page-title{font-family:'Instrument Serif',serif;font-size:clamp(36px,5vw,62px);line-height:1;margin:0 0 18px}.entry-meta{color:var(--muted);font-size:14px;margin-bottom:22px}
.archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:1000px){.home-grid,.story-grid,.split,.archive-grid{grid-template-columns:1fr}.main-nav{display:none}.hero-title{max-width:12ch}}
@media (max-width:640px){.site-main,.site-footer-inner,.site-header-inner,.tgc-wrap{width:min(calc(100% - 20px),var(--max))}.hero-feature,.meta-card,.newsletter-card,.story-body{padding:18px}.hero-copy{font-size:16px}.header-cta{display:none}}