:root{
  --bg:#FBF7F1;
  --surface:#FFFFFF;
  --ink:#3B2F27;
  --muted:#5C4B3E;
  --faint:#8A7A6D;
  --primary:#8B5E3C;
  --primary-dark:#6E4A2E;
  --primary-tint:#F3E7D9;
  --line:#E9DFD3;
  --shadow: 0 1px 1px rgba(59,47,39,0.03), 0 4px 10px rgba(59,47,39,0.05), 0 14px 32px rgba(59,47,39,0.07);
  --shadow-hover: 0 2px 6px rgba(59,47,39,0.06), 0 12px 24px rgba(59,47,39,0.09), 0 32px 64px rgba(59,47,39,0.14);
  --shadow-deep: 0 4px 12px rgba(59,47,39,0.06), 0 24px 48px rgba(59,47,39,0.10), 0 48px 96px rgba(59,47,39,0.12);
  --ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
}
html, body{ overscroll-behavior-x: none; touch-action: pan-y; max-width:100vw; overflow-x:hidden; }
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px;}
svg.icon{width:18px;height:18px;flex-shrink:0;}

/* NAV: logo centered top */
/* GALLERY (real client meeting photos) */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.gallery-item{border-radius:16px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3;}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.gallery-item:hover img{transform:scale(1.06);}
@media(max-width:900px){ .gallery-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .gallery-grid{grid-template-columns:1fr;} }

/* SCROLL PROGRESS BAR */
.scroll-progress{
  position:fixed;top:0;left:0;height:3px;width:0%;
  background:linear-gradient(90deg,var(--primary),var(--ink));
  z-index:300;transition:width .1s ease-out;
}
@media (prefers-reduced-motion: reduce){ .scroll-progress{transition:none;} }

/* STICKY VISUAL (pinned image while text scrolls past) */
.sticky-visual{position:sticky;top:100px;align-self:start;}
@media(max-width:800px){ .sticky-visual{position:static;} }

header{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,0.92);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--line);
}
nav{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  max-width:1100px;margin:0 auto;padding:14px 24px;gap:12px;
}
.logo-mark{display:flex;align-items:center;justify-content:center;}
.logo-mark img{height:56px;width:auto;}
@media(max-width:960px){ .logo-mark img{height:46px;} }
.navlinks{display:flex;gap:20px;font-size:13.5px;color:var(--ink);justify-content:flex-start;align-items:center;}
.navlinks a{opacity:0.7;transition:opacity .2s;white-space:nowrap;}
.navlinks a:hover,.navlinks a.active{opacity:1;color:var(--primary);font-weight:600;}
.nav-right{display:flex;justify-content:flex-end;align-items:center;gap:20px;}
.nav-cta{
  background:var(--primary);color:#fff;
  padding:9px 20px;border-radius:980px;
  font-size:13.5px;font-weight:600;white-space:nowrap;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease;
  box-shadow:0 4px 12px rgba(139,94,60,0.25);
}
.nav-cta:hover{background:var(--primary-dark);transform:translateY(-1px);}
.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:6px;color:var(--ink);position:relative;z-index:250;}
.menu-toggle.is-hidden{visibility:hidden;}
.mobile-nav{
  display:none;position:fixed;top:0;right:0;height:100vh;width:78vw;max-width:320px;
  background:#fff;z-index:200;box-shadow:-8px 0 30px rgba(0,0,0,0.12);
  transform:translateX(100%);transition:transform .3s ease, visibility .3s;
  padding:28px 24px;flex-direction:column;gap:4px;
  overflow-y:auto;
  visibility:hidden;pointer-events:none;
}
.mobile-nav.open{transform:translateX(0);visibility:visible;pointer-events:auto;}
.mobile-nav a{padding:14px 4px;font-size:16px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--line);}
.mobile-nav a.active{color:var(--primary);}
.mobile-nav-close{
  align-self:flex-end; background:none; border:none; cursor:pointer;
  padding:8px; margin-bottom:12px; color:var(--ink);
}
.mobile-nav .nav-cta{margin-top:16px;text-align:center;}
.nav-scrim{display:none;position:fixed;inset:0;background:rgba(20,20,20,0.4);z-index:150;}
.nav-scrim.open{display:block;}
@media(max-width:960px){
  .navlinks{display:none;}
  nav{display:flex;justify-content:space-between;align-items:center;}
  .nav-right{display:none;}
  .menu-toggle{display:flex;}
  .mobile-nav{display:flex;}
}

/* FLUID BACKGROUND (soft color, motion) */
.fluid-bg{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:0.55;}
.blob-1{width:440px;height:440px;top:-140px;left:-100px;background:radial-gradient(circle at 30% 30%, rgba(139,94,60,0.10), transparent 70%);animation:float1 16s ease-in-out infinite;}
.blob-2{width:360px;height:360px;top:40px;right:-110px;background:radial-gradient(circle at 60% 40%, rgba(18,165,148,0.13), transparent 70%);animation:float2 20s ease-in-out infinite;}
.blob-3{width:320px;height:320px;bottom:-160px;left:35%;background:radial-gradient(circle at 50% 50%, rgba(139,94,60,0.06), transparent 70%);animation:float3 24s ease-in-out infinite;}
@keyframes float1{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(40px,60px) scale(1.15);} }
@keyframes float2{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-50px,30px) scale(0.9);} }
@keyframes float3{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(30px,-40px) scale(1.1);} }
@media (prefers-reduced-motion: reduce){ .blob{animation:none;} }

/* MAIN HERO */
.hero{padding:100px 0 70px;text-align:center;position:relative;}
.hero .eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:600;color:var(--primary);background:var(--primary-tint);
  padding:8px 16px;border-radius:980px;margin-bottom:22px;position:relative;z-index:1;
}
.hero h1{font-size:clamp(28px,4.4vw,48px);font-weight:600;letter-spacing:-0.02em;line-height:1.12;max-width:760px;margin:0 auto 20px;position:relative;z-index:1;}
.hero p.lede{font-size:clamp(15px,1.6vw,18px);color:var(--muted);max-width:560px;margin:0 auto 34px;font-weight:400;position:relative;z-index:1;}
.hero-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1;}
.btn-primary{background:var(--primary);color:#fff;padding:13px 28px;border-radius:980px;font-weight:600;font-size:15px;display:inline-block;transition:transform .2s ease, box-shadow .2s ease, background .2s ease;box-shadow:0 4px 14px rgba(139,94,60,0.28);}
.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-hover);}
.btn-outline{border:1.5px solid var(--line);color:var(--ink);padding:12px 26px;border-radius:980px;font-weight:600;font-size:15px;display:inline-block;transition:all .2s ease;background:#fff;}
.btn-outline:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px);}
.btn-secondary{color:var(--primary);font-weight:600;font-size:15px;padding:13px 8px;display:inline-block;}
.btn-secondary::after{content:" \2192";}

/* PAGE HERO (interior pages) */
.page-hero{padding:80px 0 50px;text-align:center;position:relative;}
.page-hero .eyebrow{
  display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--primary);
  background:var(--primary-tint);padding:7px 15px;border-radius:980px;margin-bottom:18px;
}
.page-hero h1{font-size:clamp(26px,4vw,40px);font-weight:600;letter-spacing:-0.02em;line-height:1.15;max-width:680px;margin:0 auto 16px;}
.page-hero p{font-size:clamp(15px,1.4vw,17px);color:var(--muted);max-width:520px;margin:0 auto;}

/* MARQUEE (logos / gallery) */
.marquee-wrap{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;overflow:hidden;background:var(--surface);}
.marquee-track{display:flex;gap:20px;width:max-content;animation:scrollX 34s linear infinite;}
.marquee-wrap:hover .marquee-track{animation-play-state:paused;}
@media (hover: none), (pointer: coarse){
  .marquee-wrap:hover .marquee-track{animation-play-state:running;}
}
@keyframes scrollX{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.marquee-track .pill{
  border:1px solid var(--line);background:var(--bg);padding:10px 18px;border-radius:980px;
  font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap;flex-shrink:0;
}
.logo-track{align-items:center;}
.logo-track .client-logo-item{
  height:64px;width:auto;max-width:150px;flex-shrink:0;object-fit:contain;
  opacity:0.85;transition:opacity .25s ease, transform .25s ease;
}
.logo-track .client-logo-item:hover{opacity:1;transform:scale(1.06);}
.gallery-track img{
  height:190px;width:auto;border-radius:14px;flex-shrink:0;
  box-shadow:var(--shadow);transition:transform .3s ease, box-shadow .3s ease;
}
.gallery-track img:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);}
@media (prefers-reduced-motion: reduce){ .marquee-track{animation:none;} }

/* VIDEO SECTION */
.video-section{padding:80px 0;}
.video-frame{
  position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--shadow-hover);
  max-width:840px;margin:0 auto;background:#000;
}
.video-frame video{width:100%;display:block;}
.video-caption{padding:18px 24px;background:#fff;border-top:1px solid var(--line);}
.video-caption p{color:var(--muted);font-size:14px;}

/* REELS (Instagram embeds) */
.reels-section{padding:90px 0;}
.reels-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.reel-card{display:flex;flex-direction:column;align-items:center;}
.reel-slot{
  width:100%;max-width:340px;min-height:420px;border-radius:16px;overflow:hidden;
  background:var(--surface);box-shadow:var(--shadow);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
}
.reel-slot iframe{border-radius:16px;}
.reel-placeholder{color:var(--faint);font-size:13px;text-align:center;padding:24px;}
.reel-caption{margin-top:12px;font-size:14px;font-weight:600;color:var(--ink);text-align:center;}
@media(max-width:960px){ .reels-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:640px){ .reels-grid{grid-template-columns:1fr;} }

/* STATS BAR */
.stats{padding:64px 0;background:var(--ink);}
.stats-head{text-align:center;color:rgba(255,255,255,0.55);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:28px;}
.categories-grid{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;max-width:900px;margin:0 auto;}
.category-pill{
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);color:#fff;
  padding:12px 20px;border-radius:980px;font-size:14px;font-weight:600;transition:all .2s ease;
}
.category-pill:hover{background:var(--primary);border-color:var(--primary);transform:translateY(-2px);}

/* STATEMENT (scroll reveal lines) */
.statement{padding:100px 0;text-align:center;}
.statement .stack{max-width:720px;margin:0 auto;}
.statement p{font-size:clamp(20px,2.8vw,32px);font-weight:600;letter-spacing:-0.01em;line-height:1.35;color:#B8BCC8;}
.statement p .lit{color:var(--ink);}
.statement .tag{font-size:12px;font-weight:600;color:var(--primary);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:24px;}

/* WHO WE ARE */
.who{padding:80px 0;}
.who-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:56px;align-items:start;}
.who-grid h2{font-size:clamp(24px,3vw,32px);font-weight:600;letter-spacing:-0.015em;margin-bottom:18px;}
.who-grid p{color:var(--muted);font-size:16px;margin-bottom:14px;}
.who-badge{display:inline-flex;align-items:center;gap:8px;background:var(--primary-tint);color:var(--primary);padding:8px 14px;border-radius:980px;font-size:12.5px;font-weight:600;margin-top:6px;}
.founder-photo{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);}
.founder-photo img{width:100%;object-fit:cover;}
.founder-caption{font-size:13px;color:var(--faint);margin-top:12px;text-align:center;font-weight:500;}
.founder-linkedin{display:block;text-align:center;margin-top:8px;font-size:13px;font-weight:600;color:var(--primary);}
@media(max-width:800px){ .who-grid{grid-template-columns:1fr;} }

/* SECTION HEAD generic */
.section-head{max-width:580px;margin:0 auto 48px;text-align:center;}
.section-head .tag{
  display:inline-flex;font-size:12px;font-weight:600;color:var(--primary);background:var(--primary-tint);
  padding:6px 14px;border-radius:980px;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:14px;
}
.section-head h2{font-size:clamp(24px,3vw,32px);font-weight:600;letter-spacing:-0.02em;margin-bottom:12px;}
.section-head p{color:var(--muted);font-size:15.5px;}

/* SERVICES GRID */
.services{padding:90px 0;}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.service-card{background:var(--surface);padding:30px 24px;border-radius:18px;box-shadow:var(--shadow);transition:transform .3s ease, box-shadow .3s ease;border-top:3px solid var(--primary);}
.service-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);}
.card-icon{width:44px;height:44px;border-radius:12px;background:var(--primary-tint);color:var(--primary);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.service-card h3{font-size:17px;font-weight:600;letter-spacing:-0.01em;margin-bottom:8px;}
.service-card p{color:var(--muted);font-size:14px;margin-bottom:14px;}
.service-card .card-link{font-size:13.5px;font-weight:600;color:var(--primary);}
.service-card .card-link::after{content:" \2192";}
@media(max-width:900px){ .service-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .service-grid{grid-template-columns:1fr;} }

/* TRUST */
.trust{padding:90px 0;text-align:center;}
.trust .section-head{margin-bottom:40px;}
.trust-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:740px;margin:0 auto 44px;}
.trust-card{border:1px solid var(--line);border-radius:18px;padding:28px;text-align:left;display:flex;gap:16px;align-items:flex-start;background:var(--surface);box-shadow:var(--shadow);}
.trust-icon{width:42px;height:42px;border-radius:12px;background:var(--primary-tint);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;flex-shrink:0;}
.trust-card h4{font-size:15px;font-weight:600;margin-bottom:5px;}
.trust-card p{font-size:13.5px;color:var(--muted);}
.trust-card code{display:inline-block;margin-top:6px;font-size:12.5px;background:var(--primary-tint);padding:3px 9px;border-radius:6px;color:var(--primary-dark);font-weight:600;}
.trust-card a.btn-secondary{padding:0;font-size:14px;margin-top:6px;}
@media(max-width:640px){ .trust-cards{grid-template-columns:1fr;} }

.client-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:840px;margin:0 auto;}
.client-pill{border:1px solid var(--line);background:var(--surface);padding:11px 16px;border-radius:980px;font-size:13px;color:var(--muted);font-weight:600;}

/* CLIENT INSTAGRAM SHOWCASE */
.showcase{padding:90px 0;}
.showcase-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.showcase-card{
  background:var(--surface);border-radius:16px;padding:22px 18px;text-align:left;
  box-shadow:var(--shadow);transition:transform .25s ease, box-shadow .25s ease;
  display:flex;flex-direction:column;gap:10px;border:1px solid var(--line);
}
.showcase-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:var(--primary);}
.showcase-card .name{font-size:14.5px;font-weight:600;letter-spacing:-0.01em;}
.showcase-card .ig-link{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--primary);font-weight:600;}
@media(max-width:900px){ .showcase-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .showcase-grid{grid-template-columns:1fr;} }

/* PROCESS */
.process{padding:90px 0;}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:900px;margin:0 auto;}
.step{text-align:left;background:var(--surface);padding:28px;border-radius:18px;box-shadow:var(--shadow);}
.step-num{
  width:36px;height:36px;border-radius:50%;background:var(--primary);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;margin-bottom:16px;
}
.step h3{font-size:17px;font-weight:600;margin-bottom:8px;letter-spacing:-0.01em;}
.step p{color:var(--muted);font-size:14px;}
@media(max-width:760px){ .steps{grid-template-columns:1fr;} }

/* VALUES (about page) */
.values{padding:80px 0;}
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.value-card{background:var(--surface);padding:28px 22px;border-radius:18px;box-shadow:var(--shadow);transition:transform .3s ease;border-top:3px solid var(--primary);}
.value-card:hover{transform:translateY(-6px);}
.value-card h3{font-size:16.5px;font-weight:600;margin-bottom:8px;}
.value-card p{color:var(--muted);font-size:14px;}
@media(max-width:800px){ .value-grid{grid-template-columns:1fr;} }

/* MISSION BLOCK */
.mission{padding:80px 0;text-align:center;}
.mission-card{
  max-width:760px;margin:0 auto;background:var(--surface);border-radius:24px;padding:48px;
  box-shadow:var(--shadow);border:1px solid var(--line);
}
.mission-card p{font-size:clamp(16px,2vw,19px);color:var(--ink);line-height:1.6;font-weight:500;}

/* WHATSAPP BRAND COLOR (applies sitewide via attribute selector) */
a[href^="https://wa.me"]{
  background:#25D366 !important;
  color:#fff !important;
  border-color:#25D366 !important;
}
a[href^="https://wa.me"]:hover{
  background:#1EBE5A !important;
  border-color:#1EBE5A !important;
}
.social-btn[href^="https://wa.me"]{
  background:#fff !important;
  color:#25D366 !important;
  border-color:#25D366 !important;
}
.social-btn[href^="https://wa.me"]:hover{
  background:#25D366 !important;
  color:#fff !important;
}

/* ANSWER BLOCKS (AEO) */
.answer-block{
  background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--primary);
  border-radius:12px;padding:22px 26px;margin-bottom:16px;
}
.answer-block h3{font-size:16px;font-weight:600;margin-bottom:8px;}
.answer-block p{color:var(--muted);font-size:15px;line-height:1.6;}

/* FAQ */
.faq-list{max-width:760px;margin:0 auto;}
.faq-item{border-bottom:1px solid var(--line);padding:22px 0;}
.faq-item h3{font-size:17px;font-weight:600;margin-bottom:10px;letter-spacing:-0.01em;}
.faq-item p{color:var(--muted);font-size:15px;line-height:1.65;}

/* PROOF STATS */
.proof-stats{padding:70px 0;background:var(--ink);}
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:center;}
.proof-item strong{display:block;font-size:clamp(24px,3vw,34px);color:#fff;font-weight:700;letter-spacing:-0.02em;}
.proof-item span{display:block;font-size:12.5px;color:rgba(255,255,255,0.6);margin-top:6px;text-transform:uppercase;letter-spacing:0.05em;font-weight:600;}
@media(max-width:760px){ .proof-grid{grid-template-columns:repeat(2,1fr);} }

/* SERVICE PAGES */
.service-hero-icon{
  width:64px;height:64px;border-radius:16px;background:var(--primary-tint);color:var(--primary);
  display:flex;align-items:center;justify-content:center;margin:0 auto 20px;
}
.deliverables-list{max-width:640px;margin:0 auto;}
.deliverables-list li{
  display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);
  color:var(--muted);font-size:15.5px;list-style:none;
}
.deliverables-list li::before{
  content:"";width:8px;height:8px;border-radius:50%;background:var(--primary);margin-top:8px;flex-shrink:0;
}
.mini-process{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:960px;margin:0 auto;}
.mini-process-step{text-align:center;}
.mini-process-num{
  width:36px;height:36px;border-radius:50%;background:var(--primary);color:#fff;font-weight:700;font-size:14px;
  display:flex;align-items:center;justify-content:center;margin:0 auto 12px;
}
.mini-process-step h4{font-size:14.5px;font-weight:600;margin-bottom:6px;}
.mini-process-step p{font-size:13px;color:var(--muted);}
@media(max-width:760px){ .mini-process{grid-template-columns:repeat(2,1fr);} }

/* REVIEW TEXT CARDS */
.review-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.review-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;box-shadow:var(--shadow);}
.review-stars{color:#F5A623;font-size:14px;margin-bottom:10px;letter-spacing:2px;}
.review-card p{color:var(--ink);font-size:15px;line-height:1.6;margin-bottom:14px;}
.review-author{font-size:13.5px;font-weight:600;color:var(--muted);}
.review-source{font-size:12px;color:var(--faint);}
@media(max-width:760px){ .review-grid{grid-template-columns:1fr;} }

/* CASE STUDY BLURB (portfolio) */
.case-blurb{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 20px;margin-top:12px;font-size:13.5px;color:var(--muted);}
.case-blurb strong{color:var(--ink);}

/* FREE AUDIT FORM */
.audit-form{max-width:640px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:36px;box-shadow:var(--shadow);}
.audit-form .form-row{margin-bottom:20px;}
.audit-form label{display:block;font-size:13.5px;font-weight:600;color:var(--ink);margin-bottom:8px;}
.audit-form input, .audit-form select, .audit-form textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:15px;
  font-family:inherit;background:#fff;color:var(--ink);
}
.audit-form input:focus, .audit-form select:focus, .audit-form textarea:focus{outline:2px solid var(--primary);border-color:var(--primary);}
.audit-form .btn-primary{width:100%;text-align:center;border:none;cursor:pointer;font-size:16px;}

/* SERVICES/INDUSTRIES INDEX GRID */
.index-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.index-card{
  background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px;
  box-shadow:var(--shadow);transition:transform .3s ease, box-shadow .3s ease;border-top:3px solid var(--primary);
}
.index-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover);}
.index-card h2{font-size:19px;font-weight:600;margin-bottom:10px;}
.index-card p{color:var(--muted);font-size:14.5px;margin-bottom:14px;}
@media(max-width:760px){ .index-grid{grid-template-columns:1fr;} }

/* WAVE DIVIDER (fluid motion signature element) */
.wave-divider{position:relative;line-height:0;margin-top:-2px;background:var(--surface);}
.wave-divider svg{width:100%;height:40px;display:block;}
.wave-path{fill:var(--bg);animation:waveShift 8s ease-in-out infinite;}
@keyframes waveShift{
  0%,100%{ d:path("M0,30 C300,60 900,0 1200,30 L1200,60 L0,60 Z"); }
  50%{ d:path("M0,20 C300,0 900,60 1200,20 L1200,60 L0,60 Z"); }
}
@media (prefers-reduced-motion: reduce){ .wave-path{animation:none;} }

/* GRAPH ICONS (animated bar charts on service cards) */
.graph-icon{color:var(--primary);overflow:visible;}
.graph-icon .bar{transform:scaleY(0);transform-origin:bottom;transition:transform .6s cubic-bezier(.34,1.4,.64,1);}
.service-card.in .graph-icon .bar1{transform:scaleY(1);transition-delay:.05s;}
.service-card.in .graph-icon .bar2{transform:scaleY(1);transition-delay:.15s;}
.service-card.in .graph-icon .bar3{transform:scaleY(1);transition-delay:.25s;}
.service-card.in .graph-icon .bar4{transform:scaleY(1);transition-delay:.35s;}
.service-card:hover .graph-icon .bar{animation:barPulse 1.2s ease infinite;}
.service-card:hover .graph-icon .bar2{animation-delay:.1s;}
.service-card:hover .graph-icon .bar3{animation-delay:.2s;}
.service-card:hover .graph-icon .bar4{animation-delay:.3s;}
@keyframes barPulse{ 0%,100%{transform:scaleY(1);} 50%{transform:scaleY(0.82);} }

/* Fluid moving background extended to services section */
.services{position:relative;overflow:hidden;}
.services .fluid-bg{opacity:0.5;}

/* REELS: static animated cards (no live embed, no visible stats) */
.reel-static{
  position:relative;display:block;width:100%;max-width:340px;aspect-ratio:9/13;margin:0 auto;
  border-radius:18px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;
  transition:transform .3s ease, box-shadow .3s ease;
}
.reel-static:hover{transform:translateY(-6px) scale(1.02);box-shadow:var(--shadow-hover);}
.reel-static-bg{position:absolute;inset:0;background-size:220% 220%;animation:gradShift 10s ease infinite;}
.grad-1{background-image:linear-gradient(120deg,#8B5E3C,#3B2F27,#8A7A6D,#8B5E3C);}
.grad-2{background-image:linear-gradient(120deg,#8A7A6D,#3B2F27,#8B5E3C,#8A7A6D);}
.grad-3{background-image:linear-gradient(120deg,#3B2F27,#8B5E3C,#8A7A6D,#3B2F27);}
@keyframes gradShift{ 0%{background-position:0% 50%;} 50%{background-position:100% 50%;} 100%{background-position:0% 50%;} }
.reel-play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,0.22);
  backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;
  border:1.5px solid rgba(255,255,255,0.5);transition:transform .25s ease;
}
.reel-static:hover .reel-play{transform:translate(-50%,-50%) scale(1.12);}
.reel-static-caption{
  position:absolute;left:0;right:0;bottom:0;padding:16px;color:#fff;font-weight:600;font-size:14px;
  background:linear-gradient(to top, rgba(0,0,0,0.55), transparent);
}
@media (prefers-reduced-motion: reduce){ .reel-static-bg{animation:none;} }

/* TOOLS: QUIZ */
.quiz-card{max-width:680px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:36px;box-shadow:var(--shadow);}
.quiz-q{margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--line);}
.quiz-q:last-of-type{border-bottom:none;}
.quiz-q p.q-text{font-size:16px;font-weight:600;color:var(--ink);margin-bottom:14px;}
.quiz-options{display:flex;flex-direction:column;gap:8px;}
.quiz-option{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:all .15s ease;font-size:14.5px;color:var(--muted);}
.quiz-option:hover{border-color:var(--primary);}
.quiz-option input{accent-color:var(--primary);}
.quiz-option.selected{border-color:var(--primary);background:var(--primary-tint);color:var(--ink);font-weight:600;}
.quiz-result{display:none;text-align:center;padding:20px 0;}
.quiz-result.show{display:block;}
.quiz-score-num{font-size:56px;font-weight:700;color:var(--primary);letter-spacing:-0.02em;}
.quiz-score-label{font-size:15px;font-weight:600;color:var(--muted);margin-bottom:20px;}
.quiz-feedback{text-align:left;background:var(--primary-tint);border-radius:14px;padding:20px 24px;margin:20px 0;}
.quiz-feedback p{color:var(--ink);font-size:14.5px;margin-bottom:8px;}

/* TOOLS: CALCULATORS */
.calc-card{max-width:560px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:36px;box-shadow:var(--shadow);}
.calc-card .form-row{margin-bottom:20px;}
.calc-card label{display:block;font-size:13.5px;font-weight:600;color:var(--ink);margin-bottom:8px;}
.calc-card input, .calc-card select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:15px;font-family:inherit;background:#fff;color:var(--ink);}
.calc-card input:focus, .calc-card select:focus{outline:2px solid var(--primary);border-color:var(--primary);}
.calc-result{display:none;margin-top:24px;padding:24px;background:var(--primary-tint);border-radius:14px;text-align:center;}
.calc-result.show{display:block;}
.calc-result .big-num{font-size:36px;font-weight:700;color:var(--primary);letter-spacing:-0.02em;}
.calc-result .result-label{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:0.05em;font-weight:600;margin-top:4px;}
.calc-result p.note{font-size:13.5px;color:var(--muted);margin-top:14px;text-align:left;}

/* TOOLS: QR */
.qr-output{display:none;text-align:center;margin-top:28px;}
.qr-output.show{display:block;}
.qr-output img{border-radius:16px;box-shadow:var(--shadow);margin:0 auto 16px;}

/* TOOLS INDEX */
.tool-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:var(--shadow);transition:transform .3s ease, box-shadow .3s ease;border-top:3px solid var(--primary);}
.tool-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover);}
.tool-card h2{font-size:18px;font-weight:600;margin-bottom:10px;}
.tool-card p{color:var(--muted);font-size:14px;margin-bottom:14px;}

/* BLOG */
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.blog-card{
  background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:var(--shadow);transition:transform .3s ease, box-shadow .3s ease;
  display:flex;flex-direction:column;
}
.blog-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);}
.blog-card-body{padding:26px;}
.blog-card .blog-tag{
  display:inline-flex;font-size:11.5px;font-weight:700;color:var(--primary);background:var(--primary-tint);
  padding:5px 12px;border-radius:980px;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:14px;
}
.blog-card h2{font-size:19px;font-weight:600;letter-spacing:-0.01em;margin-bottom:10px;line-height:1.3;}
.blog-card p{color:var(--muted);font-size:14px;margin-bottom:16px;}
.blog-card .read-link{font-size:13.5px;font-weight:600;color:var(--primary);}
.blog-card .read-link::after{content:" \2192";}
@media(max-width:760px){ .blog-grid{grid-template-columns:1fr;} }

/* ARTICLE */
.article{padding:70px 0 100px;}
.article .wrap{max-width:720px;}
.article-meta{font-size:12.5px;color:var(--faint);font-weight:600;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:16px;}
.article h1{font-size:clamp(28px,4.4vw,42px);font-weight:600;letter-spacing:-0.02em;line-height:1.18;margin-bottom:24px;}
.article-body h2{font-size:23px;font-weight:600;letter-spacing:-0.01em;margin:38px 0 14px;}
.article-body h3{font-size:18px;font-weight:600;margin:28px 0 10px;}
.article-body p{font-size:16.5px;color:var(--muted);line-height:1.7;margin-bottom:18px;}
.article-body ul, .article-body ol{margin:0 0 18px 20px;color:var(--muted);font-size:16.5px;line-height:1.7;}
.article-body li{margin-bottom:8px;}
.article-body strong{color:var(--ink);}
.article-cta{
  margin-top:48px;padding:32px;background:var(--primary-tint);border-radius:18px;text-align:center;
}
.article-cta p{color:var(--ink);font-weight:600;font-size:17px;margin-bottom:16px;}
.back-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--primary);margin-bottom:28px;}
.back-link::before{content:"\2190";}

/* TESTIMONIALS */
.testimonials-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.testimonial-card{
  background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;
  box-shadow:var(--shadow);transition:transform .3s ease, box-shadow .3s ease;padding:18px;
  display:flex;align-items:center;justify-content:center;
}
.testimonial-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover);}
.testimonial-card img{width:100%;height:auto;border-radius:8px;}
@media(max-width:760px){ .testimonials-grid{grid-template-columns:1fr;} }

/* AD CAMPAIGN GALLERY */
.ad-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.ad-card{
  background:var(--surface);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);
  border:1px solid var(--line);transition:transform .3s ease, box-shadow .3s ease;
  display:flex;flex-direction:column;
}
.ad-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);}
.ad-card-img{aspect-ratio:4/5;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.ad-card-img img{width:100%;height:100%;object-fit:contain;}
.ad-card-caption{padding:14px 16px;border-top:1px solid var(--line);}
.ad-card-caption h4{font-size:13.5px;font-weight:600;color:var(--ink);margin-bottom:2px;}
.ad-card-caption span{font-size:12px;color:var(--faint);}
@media(max-width:900px){ .ad-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .ad-grid{grid-template-columns:1fr;} }

/* PORTFOLIO */
.portfolio{padding:80px 0;}
.portfolio-cat{margin-bottom:64px;}
.portfolio-cat h2{font-size:20px;font-weight:600;margin-bottom:6px;letter-spacing:-0.01em;}
.portfolio-cat > p{color:var(--muted);font-size:14px;margin-bottom:26px;max-width:540px;}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.portfolio-img{
  aspect-ratio:4/3;border-radius:16px;overflow:hidden;box-shadow:var(--shadow);
  transition:transform .3s ease, box-shadow .3s ease;
}
.portfolio-img img{width:100%;height:100%;object-fit:cover;}
.portfolio-img:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover);}
@media(max-width:900px){ .portfolio-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .portfolio-grid{grid-template-columns:1fr;} }

/* CLIENTS DIRECTORY (clients page) */
.clients-directory{padding:80px 0;}
.industry-group{margin-bottom:44px;}
.industry-group h3{font-size:13px;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:16px;}
.industry-row{display:flex;flex-wrap:wrap;gap:12px;}
.client-card{
  border:1px solid var(--line);border-radius:14px;padding:14px 18px;background:var(--surface);box-shadow:var(--shadow);
  font-size:15px;font-weight:600;letter-spacing:-0.01em;min-width:220px;flex:1 1 240px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;transition:transform .2s ease;
}
.client-card:hover{transform:translateY(-3px);}
.client-card-inner{display:flex;align-items:center;gap:12px;}
.client-card-logo{width:38px;height:38px;object-fit:contain;flex-shrink:0;}
.client-avatar{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;color:#fff;font-weight:700;font-size:15px;
  display:flex;align-items:center;justify-content:center;letter-spacing:0;
}
.client-card:nth-of-type(4n+1) .client-avatar{background:linear-gradient(135deg,#8B5E3C,#3B2F27);}
.client-card:nth-of-type(4n+2) .client-avatar{background:linear-gradient(135deg,#25D366,#0EA968);}
.client-card:nth-of-type(4n+3) .client-avatar{background:linear-gradient(135deg,#F5A623,#F76B1C);}
.client-card:nth-of-type(4n) .client-avatar{background:linear-gradient(135deg,#3B2F27,#8A7A6D);}
.client-card span{display:block;font-size:12px;font-weight:400;color:var(--muted);margin-top:3px;}
.client-card a.ig-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--primary-tint);color:var(--primary);flex-shrink:0;transition:all .2s ease;}
.client-card a.ig-btn:hover{background:var(--primary);color:#fff;}

/* CONTACT PAGE */
.contact{padding:110px 0;text-align:center;}
.contact h1, .contact h2{font-size:clamp(26px,4vw,42px);font-weight:600;letter-spacing:-0.02em;max-width:660px;margin:0 auto 18px;}
.contact p{color:var(--muted);font-size:16.5px;max-width:500px;margin:0 auto 34px;}
.contact-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

.contact-details{padding:0 0 90px;}
.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:900px;margin:0 auto;}
.detail-card{background:var(--surface);padding:28px 24px;text-align:left;border-radius:16px;box-shadow:var(--shadow);border-top:3px solid var(--primary);}
.detail-card h4{font-size:12px;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:10px;}
.detail-card p, .detail-card a{font-size:15px;font-weight:600;display:block;margin-bottom:4px;}
.detail-card a:hover{color:var(--primary);}
@media(max-width:800px){ .detail-grid{grid-template-columns:1fr;} }

.social-row{display:flex;gap:14px;justify-content:center;margin-top:8px;}
.social-btn{
  width:44px;height:44px;border-radius:50%;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;transition:all .2s ease;background:var(--surface);color:var(--ink);
}
.social-btn:hover{background:var(--primary);border-color:var(--primary);color:#fff;transform:translateY(-2px);}

/* PRIVACY PAGE */
.legal{padding:80px 0 100px;}
.legal .wrap{max-width:760px;}
.legal h2{font-size:20px;font-weight:600;margin:36px 0 12px;letter-spacing:-0.01em;}
.legal h2:first-of-type{margin-top:0;}
.legal p, .legal li{color:var(--muted);font-size:15px;margin-bottom:10px;}
.legal ul{padding-left:20px;margin-bottom:14px;}

/* FOOTER */
footer{border-top:1px solid var(--line);padding:44px 0 26px;font-size:12.5px;color:var(--faint);background:var(--surface);}
.footer-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;margin-bottom:24px;}
.footer-col a{display:flex;align-items:center;gap:6px;color:var(--muted);margin-bottom:8px;font-size:13px;}
.footer-col a:hover{color:var(--primary);}
.footer-col h4{font-size:12px;color:var(--ink);margin-bottom:12px;font-weight:700;}
.footer-bottom{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}

.reveal{opacity:0;transform:translateY(24px) scale(0.97);transition:opacity .7s cubic-bezier(.16,.8,.3,1), transform .7s cubic-bezier(.16,.8,.3,1);will-change:transform,opacity;}
.reveal.in{opacity:1;transform:translateY(0) scale(1);}
@media (prefers-reduced-motion: reduce){ .reveal{transition:none;opacity:1;transform:none;} }

/* subtle parallax + nav shadow on scroll */
header.scrolled{box-shadow:0 4px 20px rgba(20,20,20,0.06);}
.hero h1{transition:transform .1s linear;}

/* gradient highlight text */
.grad-text{
  background:linear-gradient(90deg, var(--primary), var(--ink));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* ===== Adyright Media additions: floating WhatsApp + hero 3D mark ===== */
.floating-whatsapp{
  position:fixed; bottom:22px; right:22px; z-index:9999;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,0.25);
  transition:transform .25s ease, box-shadow .25s ease;
  animation: wa-pulse 2.4s ease-in-out infinite;
}
.floating-whatsapp:hover{ transform:scale(1.08); box-shadow:0 10px 30px rgba(0,0,0,0.32); }
.floating-whatsapp svg{ width:30px; height:30px; }
@keyframes wa-pulse{
  0%,100%{ box-shadow:0 8px 24px rgba(37,211,102,0.35); }
  50%{ box-shadow:0 8px 32px rgba(37,211,102,0.6); }
}
@media (max-width:480px){
  .floating-whatsapp{ width:52px; height:52px; bottom:16px; right:16px; }
}

/* 3D rotating brand mark for hero */
.hero-3d-mark{
  position:absolute; top:18%; right:6%; width:120px; height:120px;
  perspective:800px; z-index:1; opacity:0.9; pointer-events:none;
}
.hero-3d-mark .cube{
  width:100%; height:100%; position:relative; transform-style:preserve-3d;
  animation: cube-spin 14s linear infinite;
}
.hero-3d-mark .face{
  position:absolute; width:120px; height:120px;
  border:3px solid rgba(20,20,20,0.85);
  background:rgba(255,255,255,0.04);
  backdrop-filter:blur(2px);
}
.hero-3d-mark .front{ transform: translateZ(60px); }
.hero-3d-mark .back{ transform: rotateY(180deg) translateZ(60px); }
.hero-3d-mark .right{ transform: rotateY(90deg) translateZ(60px); }
.hero-3d-mark .left{ transform: rotateY(-90deg) translateZ(60px); }
.hero-3d-mark .top{ transform: rotateX(90deg) translateZ(60px); }
.hero-3d-mark .bottom{ transform: rotateX(-90deg) translateZ(60px); }
@keyframes cube-spin{
  from{ transform: rotateX(0deg) rotateY(0deg); }
  to{ transform: rotateX(360deg) rotateY(360deg); }
}
@media (max-width:900px){ .hero-3d-mark{ display:none; } }

.experience-badge{
  display:inline-block; font-size:0.85rem; letter-spacing:0.03em;
  opacity:0.75; margin-top:6px;
}

/* ===== Tactile depth: tilt-on-hover for cards (desktop), press-feedback (touch) ===== */
.tilt-card{
  transform-style:preserve-3d;
  transform:perspective(900px);
  transition:transform .15s ease-out, box-shadow .25s ease-out;
  will-change:transform;
}
.tilt-card:active{ transition:transform .08s ease-out; }

/* Touch devices: no hover, so give a clear tactile press-down instead */
@media (hover:none){
  .tilt-card:active,
  .btn-primary:active,
  .btn-outline:active,
  .nav-cta:active{
    transform:scale(0.97) translateY(1px) !important;
    box-shadow:0 2px 6px rgba(20,20,20,0.10) !important;
  }
}

/* Desktop: deepen existing hover states slightly, buttons get a touch-like press too */
@media (hover:hover) and (pointer:fine){
  .btn-primary:active, .btn-outline:active, .nav-cta:active{
    transform:translateY(0) scale(0.98);
  }
}

/* ===== Scroll-reveal: cards/sections rise gently into place (Jobs-keynote style restraint) ===== */
.reveal-up{
  opacity:0; transform:translateY(28px);
  transition:opacity .8s var(--ease-smooth), transform .8s var(--ease-smooth);
}
.reveal-up.is-visible{ opacity:1; transform:translateY(0); }

/* ===== Logo: now transparent PNG, let it sit naturally on white, subtle depth only on scroll ===== */
.logo-mark img{
  filter:drop-shadow(0 1px 1px rgba(20,20,20,0.06));
  transition:filter .3s ease;
}

/* ===== Deep-elevation utility for hero/feature visuals ===== */
.elevate-deep{ box-shadow:var(--shadow-deep); }

/* Smoother global transitions on interactive elements */
a, button{ transition-timing-function: var(--ease-smooth); }

/* ===== Honest numbers strip: real, not inflated ===== */
.stats-strip{ padding:48px 0; background:var(--surface); border-bottom:1px solid var(--line); }
.stats-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:28px; text-align:center;
}
.stat-item{ display:flex; flex-direction:column; gap:6px; }
.stat-num{ font-size:clamp(28px,4vw,40px); font-weight:800; letter-spacing:-0.02em; color:var(--primary); }
.stat-label{ font-size:13px; color:var(--muted); line-height:1.4; }
@media(max-width:760px){
  .stats-grid{ grid-template-columns:repeat(2,1fr); }
}

/* ===== Unified card system (Figma-style: one component, reused everywhere) =====
   Applies consistent shadow/radius/padding across service, value, trust, showcase, review cards
   without needing to rewrite existing HTML class names. */
.service-card, .value-card, .trust-card, .showcase-card, .review-card{
  border-radius:20px;
  padding:28px 24px;
}

/* ===== Instagram / video proof section ===== */
.reel-showcase{ padding:90px 0; background:var(--bg); }
.reel-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-top:36px;
}
.reel-embed-slot{
  aspect-ratio:9/16; border-radius:18px; overflow:hidden;
  background:var(--surface); box-shadow:var(--shadow);
  display:flex; align-items:center; justify-content:center;
  border:1px dashed var(--line); position:relative;
}
.reel-embed-slot .reel-placeholder{
  text-align:center; padding:20px; color:var(--faint); font-size:13px;
}
.reel-embed-slot iframe, .reel-embed-slot blockquote{ width:100%; height:100%; border:none; margin:0; }

/* On small screens, collapse the empty placeholder grid so it doesn't dominate the scroll.
   Once real reel embeds are pasted in, this rule stops mattering since the slots will have real content. */
@media(max-width:680px){
  .reel-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .reel-embed-slot{ aspect-ratio:3/4; }
  .reel-embed-slot .reel-placeholder{ font-size:11px; padding:10px; }
}

/* =========================================================
   HOMEPAGE V2 — genuinely different visual system
   Dark, editorial hero with logo-as-watermark, bold type,
   alternating light/dark rhythm down the page.
   Scoped entirely to body.v2 so other pages are untouched.
   ========================================================= */

body.v2 .hero-v2{
  position:relative;
  background:linear-gradient(180deg, var(--primary-tint) 0%, var(--bg) 100%);
  color:var(--ink);
  overflow:hidden;
  padding:100px 0 70px;
}

/* Centered punchline hero: simple, robust, no absolute-positioned tricks */
body.v2 .hero-centered-inner{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:40px;
}
body.v2 .hero-punchline{ max-width:780px; }
body.v2 .hero-logo{ height:90px; width:auto; margin:0 auto 24px; display:block; }
@media(max-width:600px){ body.v2 .hero-logo{ height:70px; } }
body.v2 .hero-punchline .eyebrow{
  color:var(--primary); font-weight:600; font-size:13px; letter-spacing:0.04em;
  text-transform:uppercase; margin-bottom:16px;
}
body.v2 .hero-punchline h1{
  font-size:clamp(30px,5vw,54px); line-height:1.15; letter-spacing:-0.02em;
  font-weight:800; color:var(--ink); margin-bottom:28px;
  display:flex; flex-direction:column;
}
body.v2 .hero-h1-main{ color:var(--ink); }
body.v2 .hero-h1-sub{ font-size:0.55em; font-weight:700; color:var(--muted); margin-top:6px; }
body.v2 .hero-ctas{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
body.v2 .hero-subline{ font-size:16px; color:var(--muted); margin:-14px 0 26px; }
body.v2 .hero-trust-note{ font-size:12px; color:var(--faint); margin-top:16px; }
body.v2 .btn-primary{
  background:var(--primary); box-shadow:0 8px 24px rgba(139,94,60,0.28);
}
body.v2 .btn-outline-v2{
  display:inline-block; padding:12px 26px; border-radius:980px; font-weight:600; font-size:15px;
  border:1.5px solid var(--line); color:var(--ink); background:#fff; transition:all .2s ease;
}
body.v2 .btn-outline-v2:hover{ border-color:var(--primary); color:var(--primary); transform:translateY(-2px); }

body.v2 .hero-stat-illo{ max-width:900px; margin:0 auto; }
body.v2 .hero-stat-illo img{ width:100%; height:auto; display:block; }

/* Faint doodle background image, sits behind the hero content, contained and non-interactive */
body.v2 .hero-v2{ position:relative; overflow:hidden; }
body.v2 .hero-bg-doodle{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0.5; pointer-events:none; z-index:0;
}
body.v2 .hero-centered-inner{ position:relative; z-index:1; }

@media(max-width:600px){
  body.v2 .hero-v2{ padding:80px 0 50px; }
}

/* Stats strip v2: light, navy numbers, sits directly under hero for continuity */
body.v2 .stats-strip-v2{
  background:var(--surface); padding:0 0 64px; border-bottom:1px solid var(--line);
}
body.v2 .stats-strip-v2 .stat-num{ color:var(--primary); }
body.v2 .stats-strip-v2 .stat-label{ color:var(--faint); }

/* Alternate subtle light/surface rhythm for major sections beneath the fold, for visual pace */
body.v2 section.who,
body.v2 section.trust,
body.v2 section.process{
  background:var(--surface);
}
body.v2 section.statement{
  background:var(--primary); color:#fff;
}
body.v2 section.statement *{ color:#fff !important; }

/* Header: keep clean and light so the transparent logo reads well, but add a firmer edge */
body.v2 header{
  background:rgba(255,255,255,0.97);
  border-bottom:1px solid var(--line);
}

/* ===== Founder & numbers: real story, real illustration, no scroll-hidden bugs ===== */
.founder-story{ padding:90px 0; background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.founder-grid{
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;
}
.founder-copy h2{ font-size:clamp(26px,3.4vw,36px); margin-bottom:14px; color:var(--ink); }
.founder-copy p{ color:var(--muted); font-size:16px; line-height:1.6; margin-bottom:32px; max-width:520px; }
.founder-stats{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.founder-stat{ display:flex; flex-direction:column; gap:4px; }
.founder-num{ font-size:clamp(26px,3vw,34px); font-weight:800; color:var(--primary); letter-spacing:-0.02em; }
.founder-label{ font-size:13px; color:var(--faint); line-height:1.4; }
.founder-illo img{ width:100%; height:auto; display:block; }
@media(max-width:820px){
  .founder-grid{ grid-template-columns:1fr; gap:36px; }
  .founder-illo{ order:-1; }
}

/* CTA card matching illo-block visual weight when there's no image */
.illo-cta-card{
  background:var(--primary-tint); border-radius:20px; padding:40px 28px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:220px; box-shadow:var(--shadow);
}
.illo-cta-card h3{ margin-bottom:8px; }
.growth-story{ padding:90px 0; background:var(--bg); }
.illo-showcase{
  display:grid; grid-template-columns:repeat(2,1fr); gap:40px; margin-top:44px; align-items:start;
}
.growth-story-follow{
  text-align:center; margin-top:44px; font-size:15px; color:var(--muted);
}
.growth-story-follow a{ color:var(--primary); font-weight:600; margin-left:6px; }

/* ===== Ad performance section ===== */
.ad-performance{ padding:90px 0; background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.ad-summary-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin:44px 0 48px;
}
.ad-summary-stat{
  text-align:center; background:var(--bg); border-radius:16px; padding:22px 14px; border:1px solid var(--line);
}
.ad-summary-num{ display:block; font-size:clamp(22px,3vw,30px); font-weight:800; color:var(--primary); margin-bottom:6px; }
.ad-summary-label{ display:block; font-size:12.5px; color:var(--muted); line-height:1.4; }
.ad-screenshot-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:20px;
}
.ad-screenshot-grid img{
  width:100%; height:auto; border-radius:12px; border:1px solid var(--line); box-shadow:var(--shadow);
}
.ad-screenshot-card{ position:relative; }
.ad-screenshot-tag{
  position:absolute; top:10px; right:10px; background:var(--ink); color:#fff;
  font-size:11px; font-weight:600; padding:4px 10px; border-radius:980px; letter-spacing:0.02em;
}
@media(max-width:760px){
  .ad-summary-grid{ grid-template-columns:repeat(2,1fr); }
  .ad-screenshot-grid{ grid-template-columns:1fr; }
}
.illo-block{ text-align:center; }
.illo-block img{
  width:100%; height:auto; max-width:100%; display:block; margin:0 auto 22px;
}
.illo-block h3{ font-size:20px; margin-bottom:10px; color:var(--ink); }
.illo-block p{ font-size:14.5px; color:var(--muted); line-height:1.6; max-width:420px; margin:0 auto; }
@media(max-width:820px){
  .illo-showcase{ grid-template-columns:1fr; gap:52px; }
}
