/*
Theme Name: CARAVANT Editable
Theme URI: https://caravantfestival.com
Author: ON ART / CARAVANT
Description: Editable, plugin-compatible CARAVANT theme preserving the original visual system while using native WordPress content and blocks.
Version: 2.0.0
Text Domain: caravant
*/

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

:root {
  --background: hsl(36 30% 96%);
  --foreground: hsl(30 8% 9%);
  --card: hsl(36 24% 93%);
  --primary-foreground: hsl(36 33% 97%);
  --secondary: hsl(35 22% 88%);
  --muted: hsl(35 18% 88%);
  --muted-foreground: hsl(28 7% 38%);
  --border: hsl(32 14% 82%);
  --input: hsl(32 14% 78%);
  --ink: hsl(24 10% 8%);
  --sand: hsl(36 26% 84%);
  --copper: hsl(24 62% 46%);
  --max-standard: 72rem;
  --max-wide: 90rem;
  --max-narrow: 56rem;
}

* { box-sizing: border-box; -webkit-font-smoothing: antialiased; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:'Inter',sans-serif; background:var(--background); color:var(--foreground); overflow-x:clip; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
h1,h2,h3,h4,.display,.site-nav { font-family:'Archivo',sans-serif; }
.editorial { font-family:'Spectral',serif; }
.upper { text-transform:uppercase; }

.site-shell::after { content:''; position:fixed; inset:0; pointer-events:none; z-index:100; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"); }

.wordmark { font-family:'Archivo',sans-serif; font-weight:700; letter-spacing:.34em; text-transform:uppercase; }
.eyebrow { font-family:'Archivo',sans-serif; font-size:.6875rem; font-weight:600; letter-spacing:.28em; text-transform:uppercase; color:var(--copper); }
.heading { margin:1.5rem 0 0; font-family:'Archivo',sans-serif; font-size:clamp(2rem,4vw,3rem); font-weight:700; line-height:1.05; letter-spacing:.02em; text-transform:uppercase; }
.muted { color:var(--muted-foreground); }
.lead-editorial { font-family:'Spectral',serif; font-size:1.25rem; line-height:1.65; }
.copy { line-height:1.75; }
.rule-dotted { margin-top:2.5rem; height:1px; background-image:radial-gradient(var(--copper) 1px,transparent 1px); background-size:12px 1px; background-repeat:repeat-x; }

.wrap { width:min(calc(100% - 3rem),var(--max-standard)); margin-inline:auto; }
.wrap-wide { width:min(calc(100% - 3rem),var(--max-wide)); margin-inline:auto; }
.wrap-narrow { width:min(calc(100% - 3rem),var(--max-narrow)); margin-inline:auto; }
.section { padding:5rem 0; }
.section-border { border-bottom:1px solid var(--border); }
.dark { background:var(--ink); color:#fff; }
.secondary { background:var(--secondary); }
.card-bg { background:var(--card); }

/* Header */
.site-header { position:fixed; inset:0 0 auto 0; z-index:90; transition:background-color .3s ease,backdrop-filter .3s ease; color:#fff; }
.site-header.is-solid,.site-header.menu-open { background:rgba(23,20,17,.95); backdrop-filter:blur(8px); }
.header-inner { width:min(calc(100% - 3rem),var(--max-wide)); margin:auto; padding:1.25rem 0; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.brand-link { font-size:.875rem; }
.site-nav { display:none; align-items:center; gap:1.75rem; }
.site-nav a { font-size:.68rem; font-weight:600; text-transform:uppercase; letter-spacing:.18em; color:rgba(255,255,255,.70); transition:color .2s; }
.site-nav a:hover,.site-nav a.is-active { color:var(--copper); }
.header-actions { display:none; }
.mobile-toggle { width:44px; height:44px; border:0; background:transparent; color:#fff; display:flex; align-items:center; justify-content:center; padding:0; }
.mobile-toggle svg { width:22px; height:22px; }
.mobile-menu { display:none; border-top:1px solid rgba(255,255,255,.10); background:var(--ink); padding:.75rem 1.5rem 2rem; }
.mobile-menu.is-open { display:block; }
.mobile-menu nav { display:flex; flex-direction:column; }
.mobile-menu nav a { padding:1rem 0; border-bottom:1px solid rgba(255,255,255,.10); font-family:'Archivo',sans-serif; font-size:.875rem; font-weight:600; text-transform:uppercase; letter-spacing:.16em; color:rgba(255,255,255,.8); }
.mobile-menu .mobile-actions { display:flex; flex-direction:column; gap:.75rem; margin-top:1.5rem; }

/* Buttons */
.cta { display:inline-flex; min-height:48px; align-items:center; justify-content:center; gap:.5rem; padding:.75rem 1.75rem; font-family:'Archivo',sans-serif; font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.2em; transition:all .2s ease-out; border:1px solid transparent; }
.cta:active { transform:scale(.985); }
.cta-solid { background:var(--ink); color:var(--primary-foreground); }
.cta-solid:hover { background:var(--copper); }
.cta-copper { background:var(--copper); color:#fff; }
.cta-copper:hover { background:var(--ink); }
.cta-outline { border-color:rgba(24,22,20,.25); color:var(--foreground); }
.cta-outline:hover { border-color:var(--copper); color:var(--copper); }
.cta-light { border-color:rgba(255,255,255,.35); color:#fff; }
.cta-light:hover { border-color:var(--copper); background:var(--copper); }

/* Reveal */
.reveal { opacity:1; transform:none; }
.reveal-ready .reveal { opacity:0; transform:translateY(18px); transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1); }
.reveal-ready .reveal.is-visible { opacity:1; transform:none; }

/* Hero */
.home-hero { position:relative; isolation:isolate; min-height:100dvh; display:flex; align-items:flex-end; overflow:hidden; background:var(--ink); color:#fff; }
.hero-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.home-hero .hero-bg { opacity:.50; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(to top,var(--ink),rgba(23,20,17,.60),rgba(23,20,17,.40)); }
.home-hero-inner { position:relative; width:min(calc(100% - 3rem),var(--max-wide)); margin:auto; padding:10rem 0 4rem; }
.home-title { max-width:64rem; margin:1.5rem 0 0; font-family:'Archivo',sans-serif; font-size:clamp(2.6rem,8vw,5.6rem); font-weight:800; text-transform:uppercase; line-height:.98; letter-spacing:-.01em; }
.home-title .sand { display:block; color:var(--sand); }
.home-bottom { margin-top:2.5rem; display:grid; gap:2.5rem; }
.home-bottom p { max-width:36rem; margin:0; font-size:1rem; line-height:1.75; color:rgba(255,255,255,.75); }
.cta-row { display:flex; flex-wrap:wrap; gap:.75rem; }

.page-hero { position:relative; isolation:isolate; min-height:72vh; display:flex; align-items:flex-end; overflow:hidden; background:var(--ink); color:#fff; padding:10rem 0 3.5rem; }
.page-hero .hero-bg { opacity:.45; }
.page-hero .hero-overlay { background:linear-gradient(to top,var(--ink),rgba(23,20,17,.70),transparent); }
.page-hero-inner { position:relative; width:min(calc(100% - 3rem),var(--max-standard)); margin:auto; }
.page-hero h1 { max-width:56rem; margin:1.5rem 0 0; font-family:'Archivo',sans-serif; font-size:clamp(2.5rem,6vw,3.75rem); font-weight:700; text-transform:uppercase; line-height:1.02; letter-spacing:.01em; }
.page-hero .subtitle { margin-top:1rem; font-family:'Archivo',sans-serif; font-size:1.125rem; text-transform:uppercase; letter-spacing:.22em; color:rgba(255,255,255,.70); }
.page-hero .lead { max-width:42rem; margin:1.75rem 0 0; font-size:1rem; line-height:1.75; color:rgba(255,255,255,.75); }
.page-hero .cta-row { margin-top:2.25rem; }

/* Marquee */
.marquee { overflow:hidden; border-block:1px solid var(--border); background:var(--secondary); padding:1rem 0; }
.marquee-track { display:flex; width:max-content; animation:marquee 38s linear infinite; }
.marquee-set { display:flex; flex-shrink:0; align-items:center; }
.marquee-item { display:flex; align-items:center; gap:1.5rem; padding:0 1.5rem; color:var(--muted-foreground); }
.marquee-dot { width:4px; height:4px; background:var(--copper); }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* Common layouts */
.two-col { display:grid; gap:3rem; }
.two-col-compact { display:grid; gap:3rem; }
.grid-cards { display:grid; gap:1px; border:1px solid var(--border); background:var(--border); }
.grid-card { height:100%; background:var(--background); padding:2rem; }
.grid-card .num { font-family:'Archivo',sans-serif; font-size:.75rem; color:var(--copper); }
.grid-card h2,.grid-card h3 { margin:1rem 0 0; font-family:'Archivo',sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.08em; line-height:1.25; }
.grid-card p { margin:1rem 0 0; line-height:1.7; color:var(--muted-foreground); }

.name-grid { margin-top:2.5rem; display:grid; gap:1px; border:1px solid rgba(255,255,255,.10); }
.name-card { position:relative; height:100%; overflow:hidden; background:var(--ink); padding:2.5rem; min-height:290px; }
.name-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.20; }
.name-card-content { position:relative; }
.name-card h3 { margin:0; font-family:'Archivo',sans-serif; font-size:clamp(2.5rem,5vw,3.75rem); font-weight:800; text-transform:uppercase; letter-spacing:.14em; }
.name-card p { max-width:24rem; margin:1.5rem 0 0; line-height:1.7; color:rgba(255,255,255,.70); }

.principles { margin-top:3.5rem; border-top:1px solid var(--border); }
.principle { display:grid; gap:1rem; padding:2rem 0; border-bottom:1px solid var(--border); transition:background .2s; }
.principle:hover { background:rgba(231,226,218,.60); }
.principle .num { font-family:'Archivo',sans-serif; font-size:.875rem; color:var(--copper); }
.principle h3 { margin:0; font-family:'Archivo',sans-serif; font-size:1.25rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; }
.principle p { max-width:36rem; margin:0; line-height:1.7; color:var(--muted-foreground); }

.image-dark-section { position:relative; isolation:isolate; overflow:hidden; background:var(--ink); color:#fff; }
.image-dark-section > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.30; }
.image-dark-section .dark-gradient { position:absolute; inset:0; background:linear-gradient(to right,var(--ink),rgba(23,20,17,.85),transparent); }
.image-dark-content { position:relative; width:min(calc(100% - 3rem),var(--max-standard)); margin:auto; padding:6rem 0; }
.detail-grid { margin-top:3rem; display:grid; gap:2.5rem; border-top:1px solid rgba(255,255,255,.15); padding-top:2.5rem; }
.detail-list { display:grid; gap:1.25rem; margin:0; }
.detail-list dt { color:rgba(255,255,255,.45); }
.detail-list dd { margin:.25rem 0 0; color:rgba(255,255,255,.80); }
.detail-list .edition-name { font-family:'Archivo',sans-serif; font-size:1.5rem; font-weight:700; text-transform:uppercase; letter-spacing:.16em; color:#fff; }
.status { display:inline-flex; align-items:center; gap:.5rem; padding:.375rem .75rem; border:1px solid rgba(255,255,255,.25); font-family:'Archivo',sans-serif; font-size:.6875rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.80); }
.status.light { border-color:rgba(24,22,20,.20); color:var(--muted-foreground); }
.status-dot { width:6px; height:6px; border-radius:50%; background:var(--copper); }

.route-map { margin-top:4rem; overflow:hidden; border:1px solid var(--border); background:var(--card); padding:1.5rem; }
.route-map svg { width:100%; height:auto; }
.edition-grid { margin-top:3rem; display:grid; gap:1px; border:1px solid var(--border); background:var(--border); }
.edition-card { height:100%; background:var(--background); padding:1.75rem; }
.edition-card h3 { margin:1rem 0 0; font-family:'Archivo',sans-serif; font-size:1rem; font-weight:700; text-transform:uppercase; line-height:1.4; letter-spacing:.08em; }
.edition-card p { margin:.75rem 0 0; font-size:.875rem; color:var(--muted-foreground); }

.split-image { display:grid; gap:3rem; }
.split-image img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.founder-grid { display:grid; gap:3rem; }
.founder-grid img { width:100%; aspect-ratio:3/4; object-fit:cover; filter:grayscale(1); }

.final-cta { padding:6rem 0; background:var(--ink); color:#fff; text-align:center; }
.final-cta h2 { margin:1.5rem 0 0; font-family:'Archivo',sans-serif; font-size:clamp(2rem,5vw,3.75rem); font-weight:800; text-transform:uppercase; line-height:1.05; }
.final-cta p { max-width:42rem; margin:2rem auto 0; line-height:1.7; color:rgba(255,255,255,.70); }
.final-cta .cta-row { justify-content:center; margin-top:2.5rem; }

/* Tables / lists / route */
.translation-list { margin-top:3.5rem; border-block:1px solid var(--border); }
.translation-row { display:grid; gap:.5rem; padding:1.5rem 0; border-bottom:1px solid var(--border); }
.translation-row:last-child { border-bottom:0; }
.translation-row dt { font-family:'Archivo',sans-serif; font-size:.875rem; text-transform:uppercase; letter-spacing:.18em; color:var(--muted-foreground); }
.translation-row dd { margin:0; font-family:'Archivo',sans-serif; font-size:1.125rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--copper); }
.pillar-list { display:grid; gap:4rem; }
.pillar { display:grid; gap:1.5rem; padding-top:2rem; border-top:1px solid var(--border); }
.pillar .num { font-family:'Archivo',sans-serif; color:var(--copper); }
.pillar h2 { margin:0; font-family:'Archivo',sans-serif; font-size:1.5rem; font-weight:700; text-transform:uppercase; line-height:1.1; }
.pillar p { margin:0; max-width:42rem; line-height:1.7; color:var(--muted-foreground); }
.route-line { position:relative; margin-top:4rem; }
.route-line .dotted { display:none; position:absolute; left:0; right:0; top:3px; height:1px; background-image:radial-gradient(var(--copper) 1px,transparent 1px); background-size:12px 1px; }
.route-steps { list-style:none; margin:0; padding:0; display:grid; gap:2rem; }
.route-step .route-dot { position:relative; z-index:1; display:block; width:7px; height:7px; background:var(--copper); }
.route-step .index { margin:1.25rem 0 0; color:var(--muted-foreground); }
.route-step h3 { margin:.5rem 0 0; font-family:'Archivo',sans-serif; font-size:1.125rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.route-step p { margin:.5rem 0 0; font-size:.875rem; line-height:1.7; color:var(--muted-foreground); }

/* Forms */
.form-grid { margin-top:2.5rem; display:grid; gap:1.5rem; }
.form-field label { display:block; color:var(--muted-foreground); }
.form-field input,.form-field select,.form-field textarea { width:100%; margin-top:.5rem; border:1px solid var(--input); background:var(--background); padding:.75rem 1rem; font-size:.875rem; outline:none; transition:border-color .2s; border-radius:0; }
.form-field input:focus,.form-field select:focus,.form-field textarea:focus { border-color:var(--copper); }
.consent { display:flex; align-items:flex-start; gap:.75rem; }
.consent input { width:1rem; height:1rem; margin-top:.25rem; accent-color:var(--copper); }
.consent label { font-size:.875rem; line-height:1.7; color:var(--muted-foreground); }
.form-message { margin-top:1.25rem; padding-left:1rem; border-left:2px solid var(--copper); font-size:.875rem; line-height:1.6; }

/* Journal */
.journal-list { margin-top:3.5rem; background:var(--border); display:grid; gap:1px; }
.journal-card { display:grid; gap:1.5rem; background:var(--background); padding:2rem 0; }
.journal-card img { width:100%; aspect-ratio:4/3; object-fit:cover; filter:grayscale(1); }
.journal-card h2 { margin:1rem 0 0; font-family:'Archivo',sans-serif; font-size:clamp(1.5rem,3vw,1.875rem); font-weight:700; text-transform:uppercase; line-height:1.2; letter-spacing:.04em; }
.journal-card p { max-width:42rem; line-height:1.7; color:var(--muted-foreground); }

/* Notices */
.notice { border-left:2px solid var(--copper); background:var(--secondary); padding:2rem; }
.notice p { line-height:1.7; }
.center-card { border:1px solid var(--border); background:var(--secondary); padding:2.5rem; text-align:center; }
.center-card h2 { margin:1rem 0 0; font-family:'Archivo',sans-serif; font-size:1.5rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }

/* Footer */
.site-footer { background:var(--ink); padding:5rem 0 2.5rem; color:rgba(255,255,255,.70); }
.footer-grid { display:grid; gap:3rem; padding-bottom:3.5rem; border-bottom:1px solid rgba(255,255,255,.10); }
.site-footer .tagline { margin:1rem 0 0; font-family:'Spectral',serif; font-size:1.125rem; font-style:italic; color:rgba(255,255,255,.60); }
.site-footer .origin { margin:1.5rem 0 0; font-size:.875rem; }
.footer-nav,.footer-contact { display:flex; flex-direction:column; gap:.75rem; }
.site-footer a { font-size:.875rem; transition:color .2s; }
.site-footer a:hover { color:var(--copper); }
.footer-legal { margin-top:1rem; display:flex; flex-direction:column; gap:.5rem; }
.footer-legal a { font-size:.75rem; color:rgba(255,255,255,.50); }
.footer-note { margin:2rem 0 0; max-width:48rem; font-size:.75rem; line-height:1.7; color:rgba(255,255,255,.45); }
.footer-copy { margin:1.5rem 0 0; font-size:.75rem; text-transform:uppercase; letter-spacing:.2em; color:rgba(255,255,255,.40); }


/* v0.2 reliability fixes */
body:not(.home) .site-header {
  background:rgba(23,20,17,.96);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
body:not(.home) main { padding-top:0; }
body:not(.home) .page-hero { padding-top:10rem; }
main { min-height:55vh; }

@media (max-width: 599px) {
  .wrap,.wrap-wide,.wrap-narrow,.header-inner,.home-hero-inner,.page-hero-inner {
    width:min(calc(100% - 2rem),var(--max-wide));
  }
  .header-inner { padding:1rem 0; }
  .brand-link { font-size:.78rem; letter-spacing:.30em; }
  .home-hero-inner { padding:7.5rem 0 2.75rem; }
  .home-title {
    max-width:100%;
    font-size:clamp(2rem,10.2vw,2.25rem);
    line-height:1.02;
    letter-spacing:-.025em;
    overflow-wrap:normal;
    word-break:normal;
  }
  .home-bottom { margin-top:2rem; gap:1.5rem; }
  .home-bottom p { font-size:.95rem; line-height:1.65; }
  .page-hero { min-height:64vh; padding:8rem 0 2.75rem; }
  .page-hero h1 { font-size:clamp(2rem,10vw,2.55rem); line-height:1.04; overflow-wrap:break-word; }
  .page-hero .subtitle { font-size:.9rem; letter-spacing:.16em; }
  .heading { font-size:clamp(1.75rem,9vw,2.15rem); line-height:1.08; }
  .section { padding:3.75rem 0; }
  .cta { width:100%; padding:.75rem 1rem; }
  .cta-row { width:100%; }
  .name-card h3 { font-size:2.15rem; }
  .footer-grid { gap:2.5rem; }
}
@media (min-width:768px) {
  .wrap,.page-hero-inner,.image-dark-content { width:min(calc(100% - 5rem),var(--max-standard)); }
  .wrap-wide,.header-inner,.home-hero-inner { width:min(calc(100% - 5rem),var(--max-wide)); }
  .wrap-narrow { width:min(calc(100% - 5rem),var(--max-narrow)); }
  .section { padding:7rem 0; }
  .home-hero-inner { padding-bottom:6rem; }
  .home-bottom { grid-template-columns:1fr auto; align-items:end; }
  .home-bottom p { font-size:1.125rem; }
  .page-hero { padding-bottom:3.5rem; }
  .page-hero .lead { font-size:1.125rem; }
  .lead-editorial { font-size:1.4rem; }
  .two-col { grid-template-columns:.9fr 1.1fr; gap:5rem; }
  .two-col-compact { grid-template-columns:1fr 1.1fr; gap:5rem; }
  .grid-cards.cols-2 { grid-template-columns:repeat(2,1fr); }
  .grid-cards.cols-3 { grid-template-columns:repeat(3,1fr); }
  .name-grid { grid-template-columns:repeat(2,1fr); }
  .name-card { padding:3.5rem; }
  .principle { grid-template-columns:6rem 16rem 1fr; align-items:baseline; padding:2rem 1rem; }
  .detail-grid { grid-template-columns:1fr 1.2fr; }
  .edition-grid { grid-template-columns:repeat(4,1fr); }
  .split-image { grid-template-columns:1.1fr 1fr; align-items:center; }
  .founder-grid { grid-template-columns:.75fr 1.25fr; gap:4rem; }
  .translation-row { grid-template-columns:repeat(2,1fr); align-items:center; }
  .pillar { grid-template-columns:8rem 1fr 1.3fr; gap:2.5rem; }
  .route-line .dotted { display:block; }
  .route-steps { grid-template-columns:repeat(5,1fr); }
  .form-grid { grid-template-columns:repeat(2,1fr); }
  .span-2 { grid-column:span 2; }
  .journal-card { grid-template-columns:18rem 1fr; gap:3rem; }
  .footer-grid { grid-template-columns:1.2fr 1fr 1fr; }
}

@media (min-width:1280px) {
  .site-nav,.header-actions { display:flex; }
  .mobile-toggle,.mobile-menu { display:none !important; }
}

@media (prefers-reduced-motion:reduce) {
  .marquee-track { animation:none; }
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .reveal { opacity:1; transform:none; }
}

/* =============================================================
   v0.3 — Mobile fidelity + safer small-screen typography
   Re-aligns the WordPress migration with the original Agentic
   React/Tailwind rails (24px mobile gutters) while preventing
   oversized headings on narrow preview widths.
   ============================================================= */
@media (max-width: 767px) {
  .wrap,
  .wrap-wide,
  .wrap-narrow,
  .header-inner,
  .home-hero-inner,
  .page-hero-inner,
  .image-dark-content {
    width: calc(100% - 3rem);
    max-width: none;
  }

  .header-inner { padding: 1.25rem 0; }
  .brand-link { font-size: .875rem; letter-spacing: .34em; }

  .home-hero-inner { padding: 10rem 0 4rem; }
  .home-title {
    max-width: 100%;
    font-size: clamp(1.9rem, 9.6vw, 2.6rem);
    line-height: .99;
    letter-spacing: -.01em;
    overflow-wrap: normal;
    word-break: normal;
  }
  .home-bottom { margin-top: 2.5rem; gap: 2rem; }
  .home-bottom p { font-size: .925rem; line-height: 1.7; }

  .cta-row { width: auto; }
  .cta {
    width: auto;
    max-width: 100%;
    min-height: 46px;
    padding: .75rem 1.25rem;
    font-size: .66rem;
    line-height: 1.35;
  }

  .page-hero {
    min-height: 68vh;
    padding: 9.25rem 0 3.25rem;
  }
  .page-hero h1 {
    max-width: 100%;
    font-size: clamp(1.9rem, 8.8vw, 2.25rem);
    line-height: 1.02;
    letter-spacing: .01em;
    overflow-wrap: normal;
    word-break: normal;
  }
  .page-hero .subtitle {
    font-size: .84rem;
    letter-spacing: .19em;
    line-height: 1.45;
  }
  .page-hero .lead { font-size: .94rem; line-height: 1.7; }

  .heading {
    font-size: clamp(1.6rem, 7.6vw, 2rem);
    line-height: 1.06;
  }
  .eyebrow { font-size: .65rem; letter-spacing: .26em; }
  .lead-editorial { font-size: 1.08rem; line-height: 1.7; }
  .copy { font-size: .94rem; line-height: 1.75; }

  .image-dark-content { padding-block: 5.5rem; }
  .detail-grid { margin-top: 2.5rem; gap: 2rem; }
  .detail-list { gap: 1.35rem; }
  .detail-list .edition-name { font-size: 1.25rem; letter-spacing: .14em; }
  .detail-list dd { font-size: .94rem; line-height: 1.6; }
  .status { font-size: .62rem; letter-spacing: .19em; padding: .35rem .65rem; }

  .section { padding: 4.5rem 0; }
  .name-card h3 { font-size: 1.9rem; }
  .grid-card { padding: 1.5rem; }
  .pillar-list { gap: 3rem; }
  .pillar h2 { font-size: 1.25rem; }

  .site-footer { padding-top: 4.25rem; }
  .footer-grid { gap: 2.5rem; }
}

/* Extra narrow preview windows (e.g. 320px desktop device emulation). */
@media (max-width: 359px) {
  .wrap,
  .wrap-wide,
  .wrap-narrow,
  .header-inner,
  .home-hero-inner,
  .page-hero-inner,
  .image-dark-content { width: calc(100% - 2.5rem); }
  .home-title { font-size: 1.82rem; }
  .page-hero h1 { font-size: 1.82rem; }
  .heading { font-size: 1.52rem; }
  .brand-link { font-size: .78rem; }
  .cta { font-size: .625rem; padding-inline: 1rem; }
}


/* =============================================================
   v0.4 — Mobile-only refinement, preserving all v0.3 routing
   and desktop/tablet behavior.
   Goals:
   1) Slightly reduce phone typography/buttons.
   2) Keep mobile-menu actions reachable on short viewports.
   No PHP/template/routing changes in this release.
   ============================================================= */
@media (max-width: 599px) {

  /* Slightly calmer phone scale — approximately 7–10% below v0.3. */
  .home-title {
    font-size: clamp(1.72rem, 8.65vw, 2.15rem);
    line-height: 1.01;
  }

  .home-bottom p {
    font-size: .875rem;
    line-height: 1.68;
  }

  .page-hero h1 {
    font-size: clamp(1.72rem, 8.15vw, 2.02rem);
    line-height: 1.035;
  }

  .page-hero .subtitle {
    font-size: .76rem;
    letter-spacing: .175em;
  }

  .page-hero .lead {
    font-size: .875rem;
    line-height: 1.68;
  }

  .heading {
    font-size: clamp(1.48rem, 7vw, 1.82rem);
    line-height: 1.07;
  }

  .eyebrow {
    font-size: .61rem;
    letter-spacing: .245em;
  }

  .lead-editorial {
    font-size: 1rem;
  }

  .copy {
    font-size: .89rem;
  }

  /* CTA dimensions reduced on phones only; tablet/desktop unchanged. */
  .cta {
    min-height: 42px;
    padding: .64rem .95rem;
    font-size: .60rem;
    letter-spacing: .18em;
    line-height: 1.32;
  }

  /* Preserve comfortable 24px rails established in v0.3. */
  .home-bottom {
    gap: 1.65rem;
  }

  /* The header is fixed. Give its dropdown its own viewport-safe scroll
     region so the two action buttons can never be clipped off-screen. */
  .mobile-menu {
    max-height: calc(100dvh - 76px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding: .45rem 1.5rem max(1.25rem, env(safe-area-inset-bottom));
  }

  .mobile-menu nav a {
    padding: .82rem 0;
    font-size: .78rem;
    line-height: 1.25;
    letter-spacing: .155em;
  }

  .mobile-menu .mobile-actions {
    margin-top: 1.15rem;
    gap: .65rem;
    padding-bottom: .35rem;
  }

  .mobile-menu .mobile-actions .cta {
    width: 100%;
    min-height: 42px;
  }
}

/* Very narrow preview panes: one additional optical step only.
   This does not affect typical modern iPhone widths. */
@media (max-width: 359px) {
  .home-title { font-size: 1.68rem; }
  .page-hero h1 { font-size: 1.66rem; }
  .heading { font-size: 1.43rem; }
  .cta { font-size: .575rem; }
  .mobile-menu nav a {
    padding: .72rem 0;
    font-size: .74rem;
  }
}


/* =============================================================
   v0.5 — Fidelity pass
   Scope is CSS ONLY. All v0.3/v0.4 page routing/templates remain intact.

   Desktop objective:
   Restore the original Agentic container logic:
   max-width container + internal desktop padding, rather than reducing
   the container width itself. This gives CARAVANT the calmer visual
   rails seen in the original design.

   Phone objective:
   Refine type hierarchy and make the complete mobile menu (including
   both CTAs) usable and visible on normal phone heights.
   ============================================================= */

/* ---------- DESKTOP / LARGE TABLET FIDELITY ---------- */
@media (min-width: 768px) {

  /* Original Agentic header:
     max-w-[90rem] + md:px-10 + py-5.
     Padding lives INSIDE the max-width box. */
  .header-inner {
    width: min(100%, var(--max-wide));
    padding: 1rem 2.5rem;
    gap: 2rem;
  }

  /* Original wordmark becomes text-base at md. */
  .brand-link {
    font-size: 1rem;
    letter-spacing: .34em;
  }

  /* Header CTA in the source was specifically min-h 42px / px-5. */
  .header-actions .cta {
    min-height: 42px;
    padding: .62rem 1.25rem;
    font-size: .66rem;
  }

  /* Original home hero:
     w-full max-w-[90rem] px-10; pb-24; pt-40. */
  .home-hero-inner {
    width: min(100%, var(--max-wide));
    padding: 10rem 2.5rem 6rem;
  }

  /* Keep the strong original title but constrain the text block. */
  .home-title {
    max-width: 64rem;
  }

  /* Original PageHero:
     w-full max-w-[72rem] px-10. */
  .page-hero-inner {
    width: min(100%, var(--max-standard));
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}

/* Desktop navigation: retain original spacing while making the bar
   optically a little leaner than v0.4. */
@media (min-width: 1280px) {
  .site-nav {
    gap: 1.75rem;
  }

  .site-nav a {
    font-size: .68rem;
    letter-spacing: .18em;
  }
}


/* ---------- PHONE TYPOGRAPHY / CONTENT ---------- */
@media (max-width: 599px) {

  /* Keep the original 24px content rail. */
  .wrap,
  .wrap-wide,
  .wrap-narrow,
  .header-inner,
  .home-hero-inner,
  .page-hero-inner,
  .image-dark-content {
    width: calc(100% - 3rem);
    max-width: none;
  }

  /* Slightly quieter header on phones. */
  .header-inner {
    padding-top: .9rem;
    padding-bottom: .9rem;
  }

  .brand-link {
    font-size: .80rem;
    letter-spacing: .32em;
  }

  .mobile-toggle {
    width: 38px;
    height: 38px;
  }

  .mobile-toggle svg {
    width: 20px;
    height: 20px;
  }

  /* Home visual hierarchy — another small optical reduction only. */
  .home-hero-inner {
    padding-top: 7rem;
    padding-bottom: 2.65rem;
  }

  .home-title {
    font-size: clamp(1.62rem, 8.15vw, 1.98rem);
    line-height: 1.015;
    letter-spacing: -.012em;
  }

  .home-bottom {
    margin-top: 1.7rem;
    gap: 1.35rem;
  }

  .home-bottom p {
    max-width: 29rem;
    font-size: .835rem;
    line-height: 1.62;
  }

  .page-hero {
    padding-top: 7.35rem;
    padding-bottom: 2.55rem;
    min-height: 61vh;
  }

  .page-hero h1 {
    font-size: clamp(1.58rem, 7.7vw, 1.92rem);
    line-height: 1.035;
  }

  .page-hero .subtitle {
    font-size: .70rem;
    line-height: 1.42;
    letter-spacing: .16em;
  }

  .page-hero .lead {
    font-size: .82rem;
    line-height: 1.62;
  }

  .eyebrow {
    font-size: .575rem;
    letter-spacing: .23em;
  }

  .heading {
    font-size: clamp(1.38rem, 6.7vw, 1.68rem);
    line-height: 1.07;
  }

  .lead-editorial {
    font-size: .94rem;
    line-height: 1.62;
  }

  .copy,
  .grid-card p,
  .principle p,
  .edition-card p,
  .detail-list dd {
    font-size: .84rem;
    line-height: 1.66;
  }

  .detail-list .edition-name {
    font-size: 1.08rem;
    letter-spacing: .13em;
  }

  .status {
    font-size: .56rem;
    letter-spacing: .17em;
    padding: .32rem .58rem;
  }

  .section {
    padding: 3.85rem 0;
  }

  /* Smaller, more editorial CTAs on phones. */
  .cta {
    min-height: 40px;
    padding: .58rem .82rem;
    font-size: .565rem;
    letter-spacing: .17em;
    line-height: 1.28;
  }

  /* ---------- MOBILE MENU ----------
     Give the open menu its own viewport and internal rail.
     This preserves the existing fixed header and does not modify PHP. */
  .site-header.menu-open {
    height: 100dvh;
    overflow: hidden;
    background: rgba(23,20,17,.985);
  }

  .mobile-menu.is-open {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 66px);
    max-height: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: .25rem 1.5rem max(1rem, env(safe-area-inset-bottom));
    scrollbar-width: thin;
  }

  .mobile-menu nav {
    flex: 0 0 auto;
  }

  .mobile-menu nav a {
    padding: .66rem 0;
    font-size: .695rem;
    line-height: 1.22;
    letter-spacing: .145em;
  }

  .mobile-menu .mobile-actions {
    flex: 0 0 auto;
    margin-top: .85rem;
    gap: .52rem;
    padding-bottom: .25rem;
  }

  .mobile-menu .mobile-actions .cta {
    width: 100%;
    min-height: 40px;
    padding-top: .55rem;
    padding-bottom: .55rem;
  }
}

/* Compact phones / short Customizer panes.
   Keep the two actions reachable without disturbing real tablet/desktop. */
@media (max-width: 599px) and (max-height: 720px) {
  .mobile-menu nav a {
    padding: .50rem 0;
    font-size: .655rem;
  }

  .mobile-menu .mobile-actions {
    margin-top: .65rem;
  }

  .mobile-menu .mobile-actions .cta {
    min-height: 37px;
    font-size: .535rem;
  }
}

@media (max-width: 359px) {
  .home-title { font-size: 1.56rem; }
  .page-hero h1 { font-size: 1.52rem; }
  .heading { font-size: 1.34rem; }
  .copy,
  .grid-card p,
  .principle p,
  .edition-card p,
  .detail-list dd { font-size: .81rem; }
}


/* =============================================================
   v0.6 — Cache-safe + mobile menu hardening
   NOTE: functions.php now cache-busts CSS/JS using filemtime().
   ============================================================= */

@media (max-width: 1279px) {
  .mobile-menu.is-open {
    position: fixed;
    inset: 0;
    top: 66px;
    display: flex !important;
    flex-direction: column;
    height: auto;
    max-height: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    background: rgba(23,20,17,.985);
    border-top: 1px solid rgba(255,255,255,.10);
    padding: .75rem 1.5rem max(2rem, env(safe-area-inset-bottom));
    z-index: 89;
  }

  .mobile-menu.is-open nav {
    flex: 0 0 auto;
  }

  .mobile-menu.is-open .mobile-actions {
    display: flex !important;
    flex: 0 0 auto;
  }

  body.cv-menu-open {
    overflow: hidden;
  }
}

@media (max-width: 599px) {
  .mobile-menu.is-open nav a {
    padding: .62rem 0;
    font-size: .68rem;
    line-height: 1.2;
    letter-spacing: .145em;
  }

  .mobile-menu.is-open .mobile-actions {
    margin-top: .8rem;
    gap: .5rem;
  }

  .mobile-menu.is-open .mobile-actions .cta {
    width: 100%;
    min-height: 39px;
    padding: .52rem .8rem;
    font-size: .55rem;
    letter-spacing: .165em;
  }
}

@media (max-width: 599px) and (max-height: 700px) {
  .mobile-menu.is-open nav a {
    padding: .45rem 0;
    font-size: .64rem;
  }
  .mobile-menu.is-open .mobile-actions {
    margin-top: .55rem;
  }
  .mobile-menu.is-open .mobile-actions .cta {
    min-height: 35px;
    padding-top: .44rem;
    padding-bottom: .44rem;
    font-size: .52rem;
  }
}


/* =============================================================
   v0.7 — Tablet menu containment fix ONLY
   v0.6 introduced a viewport-fixed mobile menu. Because the open
   header uses backdrop-filter, the header becomes the containing
   block for that fixed child in some browsers/customizer frames.
   Phones already gave the open header 100dvh; tablets did not.
   This single rule extends that exact behavior through 1279px.
   No layout, typography, routing, page or desktop changes.
   ============================================================= */
@media (max-width: 1279px) {
  .site-header.menu-open {
    height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
    background: rgba(23,20,17,.985);
  }
}


/* =============================================================
   v1.0 — ORIGINAL MOBILE FIDELITY RESTORE
   Source of truth: the exported CARAVANT React/Tailwind project,
   not WordPress Customizer device preview.

   IMPORTANT:
   - Mobile visual values only (<= 767px).
   - Desktop/tablet rules are untouched.
   - v0.6 filemtime cache-busting is untouched.
   - v0.7 tablet menu containment fix is untouched.
   - v0.9 seamless PJAX navigation is untouched.
   - The viewport-safe scrolling behavior of the mobile menu is retained.
   ============================================================= */

@media (max-width: 767px) {

  /* Original Tailwind mobile rails: px-6 = 24px each side. */
  .wrap,
  .wrap-wide,
  .wrap-narrow,
  .header-inner,
  .home-hero-inner,
  .page-hero-inner,
  .image-dark-content {
    width: calc(100% - 3rem);
    max-width: none;
  }

  /* Header source: px-6 py-5, text-sm wordmark, 44px menu control. */
  .header-inner {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }

  .brand-link {
    font-size: .875rem;
    letter-spacing: .34em;
  }

  .mobile-toggle {
    width: 44px;
    height: 44px;
  }

  .mobile-toggle svg {
    width: 22px;
    height: 22px;
  }

  /* HOME HERO source:
     px-6 pb-16 pt-40
     h1 text-[2.6rem] leading-[0.98]
     copy text-base leading-relaxed */
  .home-hero-inner {
    padding-top: 10rem;
    padding-bottom: 4rem;
  }

  .home-title {
    max-width: 64rem;
    font-size: 2.6rem;
    line-height: .98;
    letter-spacing: -.01em;
    overflow-wrap: normal;
    word-break: normal;
  }

  .home-bottom {
    margin-top: 2.5rem;
    gap: 2.5rem;
  }

  .home-bottom p {
    max-width: 36rem;
    font-size: 1rem;
    line-height: 1.625;
  }

  /* Original CTA base:
     min-h 48px, px-7, text .7rem, tracking .2em. */
  .cta {
    width: auto;
    max-width: 100%;
    min-height: 48px;
    padding: .75rem 1.75rem;
    font-size: .7rem;
    letter-spacing: .2em;
    line-height: 1.2;
  }

  .cta-row {
    width: auto;
  }

  /* PAGE HERO source:
     min-h 72vh, pt-40 pb-14
     h1 text-4xl = 2.25rem
     subtitle text-lg = 1.125rem
     lead text-base = 1rem */
  .page-hero {
    min-height: 72vh;
    padding-top: 10rem;
    padding-bottom: 3.5rem;
  }

  .page-hero h1 {
    max-width: 56rem;
    font-size: 2.25rem;
    line-height: 1.02;
    letter-spacing: .01em;
    overflow-wrap: normal;
    word-break: normal;
  }

  .page-hero .subtitle {
    font-size: 1.125rem;
    line-height: 1.4;
    letter-spacing: .22em;
  }

  .page-hero .lead {
    font-size: 1rem;
    line-height: 1.625;
  }

  /* Shared original mobile typography. */
  .eyebrow {
    font-size: .6875rem;
    letter-spacing: .28em;
  }

  .heading {
    font-size: 1.875rem;
    line-height: 1.05;
  }

  .lead-editorial {
    font-size: 1.25rem;
    line-height: 1.65;
  }

  .copy,
  .grid-card p,
  .principle p,
  .detail-list dd {
    font-size: 1rem;
    line-height: 1.7;
  }

  /* Edition cards in original source use text-sm for secondary copy. */
  .edition-card p {
    font-size: .875rem;
    line-height: 1.6;
  }

  .detail-list {
    gap: 1.25rem;
  }

  .detail-list .edition-name {
    font-size: 1.5rem;
    letter-spacing: .16em;
  }

  .status {
    font-size: .6875rem;
    letter-spacing: .22em;
    padding: .375rem .75rem;
  }

  /* Original Section: px-6 py-20. Horizontal rail is handled above. */
  .section {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  .image-dark-content {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }

  .grid-card {
    padding: 2rem;
  }

  .name-card h3 {
    font-size: 2.25rem;
  }

  .pillar-list {
    gap: 4rem;
  }

  .pillar h2 {
    font-size: 1.5rem;
  }

  .site-footer {
    padding-top: 5rem;
  }

  .footer-grid {
    gap: 3rem;
  }

  /* ---------------------------------------------------------
     MOBILE MENU
     Typography/spacing restored to original React values:
       container px-6 pt-4 pb-8
       nav text-sm / py-4 / tracking .16em
       actions mt-6 / gap-3
     The later viewport-safe fixed/scroll implementation remains.
     Header restored height = 84px, so the menu starts below it.
     --------------------------------------------------------- */
  .mobile-menu.is-open {
    top: 84px;
    padding: 1rem 1.5rem max(2rem, env(safe-area-inset-bottom));
  }

  .mobile-menu.is-open nav a {
    padding: 1rem 0;
    font-size: .875rem;
    line-height: 1.25;
    letter-spacing: .16em;
  }

  .mobile-menu.is-open .mobile-actions {
    margin-top: 1.5rem;
    gap: .75rem;
    padding-bottom: 0;
  }

  .mobile-menu.is-open .mobile-actions .cta {
    width: 100%;
    min-height: 48px;
    padding: .75rem 1.75rem;
    font-size: .7rem;
    letter-spacing: .2em;
    line-height: 1.2;
  }
}

/* Do NOT shrink the design on short phones.
   The menu is already scrollable, so visual fidelity takes priority. */
@media (max-width: 767px) and (max-height: 720px) {
  .mobile-menu.is-open nav a {
    padding: 1rem 0;
    font-size: .875rem;
  }

  .mobile-menu.is-open .mobile-actions {
    margin-top: 1.5rem;
  }

  .mobile-menu.is-open .mobile-actions .cta {
    min-height: 48px;
    padding: .75rem 1.75rem;
    font-size: .7rem;
  }
}

/* Original mobile values also remain on narrow phones.
   No Customizer-specific downscaling. */
@media (max-width: 359px) {
  .home-title {
    font-size: 2.6rem;
  }

  .page-hero h1 {
    font-size: 2.25rem;
  }

  .heading {
    font-size: 1.875rem;
  }

  .brand-link {
    font-size: .875rem;
  }

  .cta {
    font-size: .7rem;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}


/* =============================================================
   Editable architecture compatibility layer
   Keeps the proven v1.0 visual system while allowing the native
   Block Editor, CARAVANT Core blocks and future page builders.
   ============================================================= */

/* Gutenberg should not inject unexpected outer spacing into CARAVANT layouts. */
#cv-main > .wp-block-group,
#cv-main > .wp-block-cover,
#cv-main > p,
#cv-main > h1,
#cv-main > h2,
#cv-main > h3 { margin-block-start:0; margin-block-end:0; }

#cv-main .wp-block-heading { margin-block-start:0; }
#cv-main p.eyebrow { margin-top:0; }
#cv-main .cv-stack > *:first-child { margin-top:0; }
#cv-main .cv-stack > *:last-child { margin-bottom:0; }
#cv-main .cv-stack > .copy + .copy { margin-top:1.25rem; }
#cv-main .cv-stack > .lead-editorial + .copy { margin-top:1.5rem; }
#cv-main .cv-stack > .heading + .copy { margin-top:1.75rem; }
#cv-main .cv-stack > .eyebrow + .heading { margin-top:1.5rem; }
#cv-main .cv-stack > .cta,
#cv-main .cv-stack > .cta-row { margin-top:2rem; }
#cv-main .cv-origin-line { margin-top:2.25rem; padding-top:1.5rem; border-top:1px solid var(--border); font-size:.875rem; letter-spacing:.16em; }
#cv-main .cv-editorial-large { margin-top:3rem; max-width:42rem; font-size:clamp(1.25rem,3vw,1.5rem); font-style:italic; line-height:1.6; color:var(--sand); }
#cv-main .cv-manifesto { margin-top:2rem; font-size:clamp(1.5rem,3vw,2rem); font-style:italic; line-height:1.5; }
#cv-main .cv-small-note { margin-top:1.5rem; font-size:.75rem; line-height:1.6; }
#cv-main .final-cta.section { padding:6rem 0; }
#cv-main .image-dark-content.wrap,
#cv-main .image-dark-content.wrap-wide,
#cv-main .image-dark-content.wrap-narrow { margin-inline:auto; }

/* Custom logo can replace the text wordmark later without changing header geometry. */
.brand-logo { display:block; width:auto; max-height:34px; max-width:220px; object-fit:contain; }

/* Standard WordPress alignment support for future Gutenberg/third-party blocks. */
.alignwide { width:min(calc(100% - 3rem),var(--max-wide)); max-width:var(--max-wide); margin-inline:auto; }
.alignfull { width:100%; max-width:none; }

/* Third-party/page-builder content should be allowed to own its own layout. */
.caravant-blank-canvas { margin:0; background:var(--background); color:var(--foreground); }
.elementor-page #cv-main > .elementor { width:100%; }

/* Core media inside CARAVANT containers. */
#cv-main figure.wp-block-image { margin:0; }
#cv-main figure.wp-block-image img { width:100%; height:auto; }

/* Preserve dark-section typography for editor-generated paragraphs/headings. */
.dark .copy,.dark .wp-block-paragraph { color:rgba(255,255,255,.75); }
.dark .heading,.dark .wp-block-heading { color:#fff; }

@media (min-width:768px) {
  .brand-logo { max-height:38px; max-width:250px; }
}

/* Editable partner list mirrors the original hard-coded list while remaining reorderable in Gutenberg. */
.partner-simple-list { list-style:none; padding:0; margin:3rem 0 0; display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.partner-simple-list li { display:flex; align-items:center; gap:1rem; border-bottom:1px solid var(--border); padding-bottom:1rem; font-size:.875rem; }
.cv-list-dot { width:4px; height:4px; background:var(--copper); flex:0 0 auto; }