/* ===== FONTS ===== */
@font-face{font-family:"Canela";src:url("fonts/Canela-Regular.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:400}
@font-face{font-family:"Canela";src:url("fonts/Canela-RegularItalic.woff2") format("woff2");font-display:swap;font-style:italic;font-weight:400}
@font-face{font-family:"Canela";src:url("fonts/Canela-Light.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:300}
@font-face{font-family:"Canela";src:url("fonts/Canela-Medium.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:500}
@font-face{font-family:"Canela Text";src:url("fonts/CanelaText-Regular.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:400}
@font-face{font-family:"Canela Text";src:url("fonts/CanelaText-Medium.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:500}
@font-face{font-family:"Open Runde";src:url("fonts/OpenRunde-Regular.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:400}
@font-face{font-family:"Open Runde";src:url("fonts/OpenRunde-Medium.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:500}
@font-face{font-family:"Open Runde";src:url("fonts/OpenRunde-Semibold.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:600}

/* ===== RESET ===== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
  --dark:#1a1615;--dark2:#453f3d;--brown:#614a44;--muted:#757170;
  --border:#e4e2e2;--blue:#9cc1e7;--cream:#eddfd0;--beige:#f1ebe5;
  --beige-card:#f0eae5;--off-white:#f4f1ee;--bg:#f9f8f8;--white:#fff;
  --green:#0ea158;
  --font-h:"Canela",Georgia,serif;
  --font-b:"Open Runde",-apple-system,BlinkMacSystemFont,sans-serif;
  --font-m:"Fragment Mono",monospace;
  --max:1200px;--inner:1072px;--gap:120px;
}

html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--font-b);color:var(--dark);background:var(--bg);line-height:1.5;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#fafafa 0%,#f9f8f8 36%,#f4f1ee 45%,#f4f1ee 51%,#e2ecf6 73%,#a7cbf2 125%)}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
.container{max-width:var(--inner);margin:0 auto;padding:0 24px}

/* ===== TYPOGRAPHY ===== */
.display-heading{font-family:var(--font-h);font-size:clamp(36px,5vw,52px);font-weight:400;line-height:1.12;letter-spacing:-0.03em;color:var(--dark);text-align:center;margin-bottom:56px}
.heading-2{font-family:var(--font-h);font-size:44px;font-weight:400;line-height:1.2;letter-spacing:-0.03em;color:var(--dark);margin-bottom:20px}
.heading-3{font-family:var(--font-h);font-size:32px;font-weight:400;line-height:1.2;letter-spacing:-0.03em;color:var(--dark)}
.heading-6{font-family:var(--font-h);font-size:20px;font-weight:400;line-height:1.4;letter-spacing:-0.03em;color:var(--dark);margin-bottom:8px}
.body-text{font-family:var(--font-b);font-size:18px;font-weight:400;line-height:1.55;color:var(--dark2);margin-bottom:12px}
.body-small{font-family:var(--font-b);font-size:16px;font-weight:400;line-height:1.55;color:var(--dark2)}
.body-small strong{color:var(--dark)}
.body-muted{font-family:var(--font-b);font-size:18px;line-height:1.55;color:var(--muted);margin-bottom:4px}
.body-muted-sm{font-family:var(--font-b);font-size:16px;line-height:1.55;color:var(--muted)}
.eyebrow-upper{display:block;font-family:var(--font-b);font-size:15px;font-weight:600;text-transform:uppercase;color:var(--brown);margin-bottom:20px}
.mono-label{display:block;font-family:var(--font-m);font-size:13px;color:var(--muted);margin-bottom:12px}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-b);font-size:15px;font-weight:500;padding:12px 28px;border-radius:100px;border:none;cursor:pointer;transition:transform .25s,box-shadow .25s;will-change:transform}
.btn-dark{background:var(--dark);color:var(--white)}
.btn-dark:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(26,22,21,.15)}
.btn-white{background:var(--white);color:var(--dark)}
.btn-white:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.1)}
.btn-secondary{background:var(--off-white);color:var(--dark);border:1px solid var(--border)}
.btn-secondary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.06)}
.btn-full{width:100%}

/* ===== NAV (floating pill) ===== */
.navbar{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:100;width:calc(100% - 32px);max-width:var(--inner)}
.nav-pill{display:flex;align-items:center;justify-content:space-between;padding:10px 10px 10px 24px;background:rgba(255,255,255,.25);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(117,115,114,.15);border-radius:40px;transition:background .3s}
.nav-logo{font-family:var(--font-b);font-size:16px;font-weight:600;color:var(--dark);letter-spacing:-.01em;white-space:nowrap}
.nav-links{display:flex;gap:28px}
.nav-links a{font-family:var(--font-b);font-size:14px;font-weight:500;color:var(--dark2);transition:color .2s}
.nav-links a:hover{color:var(--dark)}
.nav-cta{font-family:var(--font-b);font-size:14px;font-weight:500;color:var(--white);background:var(--dark);padding:10px 24px;border-radius:100px;transition:transform .2s,box-shadow .2s;white-space:nowrap}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15)}
.menu-toggle{display:none;background:none;border:none;cursor:pointer;width:24px;height:18px;position:relative}
.menu-toggle span{display:block;width:24px;height:2px;background:var(--dark);position:absolute;left:0;transition:.3s}
.menu-toggle span:first-child{top:4px}.menu-toggle span:last-child{bottom:4px}
.menu-toggle.active span:first-child{top:8px;transform:rotate(45deg)}
.menu-toggle.active span:last-child{bottom:8px;transform:rotate(-45deg)}
.mobile-menu{display:none;position:fixed;inset:0;background:var(--bg);z-index:99;flex-direction:column;align-items:center;justify-content:center;gap:28px}
.mobile-menu.active{display:flex}
.mobile-menu a{font-size:22px;font-weight:500;color:var(--dark)}
.mobile-menu-cta{color:var(--white)!important;background:var(--dark);padding:14px 36px;border-radius:100px;margin-top:12px}

/* ===== HERO ===== */
.hero{position:relative;display:flex;flex-direction:column;align-items:center;padding:160px 0 0;overflow:clip}
.hero-gradient{position:absolute;inset:0;background:linear-gradient(180deg,var(--blue) 0%,var(--cream) 100%);z-index:0}

/* Decorative clouds - parallax */
.hero-deco{position:absolute;z-index:1;pointer-events:none;will-change:transform}
.hero-deco img{width:100%;height:auto;opacity:.45}
.hero-deco-left{left:-180px;top:20%;width:560px}
.hero-deco-right{right:-180px;top:15%;width:560px}

.hero-content{position:relative;z-index:2;text-align:center;max-width:var(--inner);width:100%;padding:0 24px;display:flex;flex-direction:column;align-items:center;gap:20px}

/* Wide hero title - natural flow, no forced breaks */
.hero-title{
  font-family:var(--font-h);
  font-size:clamp(44px,6.5vw,76px);
  font-weight:400;
  line-height:1.08;
  letter-spacing:-0.03em;
  color:var(--dark);
  max-width:800px;
}
.hero-title em{font-style:italic;display:inline-block;transition:opacity .4s,transform .4s}
.hero-sub{font-family:var(--font-b);font-size:18px;line-height:1.6;color:var(--dark2);max-width:540px;margin-top:4px}
.hero-sub strong{font-weight:600;color:var(--dark)}

/* Hero video with 3D perspective tilt, flush with section bottom */
.hero-media{
  position:relative;z-index:2;
  width:100%;max-width:var(--inner);
  margin-top:48px;padding:0 24px;
  perspective:1200px;
}
.hero-video{
  width:100%;
  aspect-ratio:1.53;
  border-radius:20px;
  border:2px solid rgba(97,74,68,.2);
  box-shadow:0 4px 50px rgba(97,74,68,.06);
  object-fit:cover;background:#111;
  transform-origin:center bottom;
  transition:transform .1s linear;
  will-change:transform;
}

/* ===== LOGO TICKER ===== */
.ticker-section{padding:56px 0 40px;text-align:center}
.ticker-section--bottom{padding:40px 0 56px}
.ticker-caption{font-family:var(--font-b);font-size:16px;color:var(--muted);margin-bottom:28px}
.ticker-mask{overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,#000 10%,#000 90%,transparent 100%)}
.ticker-track{display:flex;gap:60px;animation:marquee 25s linear infinite;width:fit-content;align-items:center}
.ticker-img{height:36px;width:auto;opacity:.45;filter:grayscale(100%);flex-shrink:0}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(calc(-50% - 30px))}}

/* ===== STRATEGY BANNER (Pretty doesn't sell) ===== */
.strategy-banner{padding:var(--gap) 0 80px}
.strategy-banner-inner{text-align:center;display:flex;flex-direction:column;align-items:center;gap:40px}
.strategy-banner .eyebrow-upper{text-align:center}
.strategy-banner-image{width:100%;max-width:820px;border-radius:20px;overflow:hidden;border:2px solid rgba(97,74,68,.12);box-shadow:0 4px 50px rgba(97,74,68,.06);position:relative}
.strategy-banner-image img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform 1.6s cubic-bezier(.25,.46,.45,.94)}
[data-zoom].zoomed img,.strategy-banner-image:hover img{transform:scale(1.05)}
.strategy-banner-tags{display:flex;gap:12px}
.pill-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-b);font-size:14px;font-weight:600;color:var(--white);background:var(--dark);padding:10px 22px;border-radius:100px}
.pill-icon{width:8px;height:8px;fill:var(--white)}

/* ===== SPLIT SECTIONS (What's Inside / Who This Is For) ===== */
.section-split{padding:var(--gap) 0}
.split-layout{display:flex;gap:72px;align-items:flex-start}
.split-layout--reverse{flex-direction:row-reverse}
.split-media{flex:0 0 420px}
.split-text{flex:1}
.split-text .heading-2{margin-bottom:20px}
.split-text .btn{margin-top:20px}
.media-frame{border-radius:20px;overflow:hidden;border:2px solid rgba(97,74,68,.12);box-shadow:0 4px 50px rgba(97,74,68,.06)}
.media-img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform 1.6s cubic-bezier(.25,.46,.45,.94)}
[data-zoom].zoomed .media-img{transform:scale(1.05)}

/* Icon tags with dot bullets */
.icon-tags{display:flex;flex-wrap:wrap;gap:16px;margin-top:28px}
.icon-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-b);font-size:14px;font-weight:500;color:var(--dark2)}
.tag-dot{width:8px;height:8px;fill:var(--dark)}

/* ===== WHAT CHANGES ===== */
.changes-section{padding:var(--gap) 0}
.changes-section .eyebrow-upper{text-align:center}

/* 2-col top row */
.changes-row-2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
/* 3-col bottom row */
.changes-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}

.change-card{background:var(--white);border:1px solid var(--border);border-radius:20px;padding:28px 24px}
.change-card--lg{padding:32px 28px}
.change-card .heading-6{margin-bottom:12px}

.cc-icons{margin-bottom:14px}
.cc-pill{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-b);font-size:12px;font-weight:500;color:var(--dark2);background:var(--off-white);padding:6px 14px;border-radius:100px;border:1px solid var(--border)}

/* ===== FEATURED TESTIMONIAL ===== */
.featured-testimonial{padding:var(--gap) 0 60px;text-align:center}
.big-quote{font-family:var(--font-h);font-size:clamp(32px,5vw,52px);font-weight:400;font-style:italic;line-height:1.2;letter-spacing:-0.03em;color:var(--dark);max-width:720px;margin:0 auto 32px}
.quote-author{display:flex;align-items:center;gap:14px;justify-content:center}
.quote-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover}
.quote-name{display:block;font-family:var(--font-b);font-size:15px;font-weight:600;color:var(--dark)}
.quote-role{font-family:var(--font-b);font-size:13px;color:var(--muted)}

/* ===== TESTIMONIAL CAROUSEL ===== */
.carousel-section{padding:0 0 var(--gap)}
.carousel-mask{overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%);padding:0 24px}
.carousel-track{display:flex;gap:24px;cursor:grab;user-select:none}
.carousel-track:active{cursor:grabbing}
.tcard{flex-shrink:0;width:320px;background:var(--bg);border:1px solid var(--border);border-radius:24px;overflow:hidden;backdrop-filter:blur(6px)}
.tcard-photo{width:100%;aspect-ratio:1/1.1;overflow:hidden}
.tcard-photo img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.25,.46,.45,.94)}
.tcard:hover .tcard-photo img{transform:scale(1.04)}
.tcard-body{padding:24px}
.tcard-quote{font-family:var(--font-b);font-size:15px;line-height:1.6;color:var(--dark2);margin-bottom:16px}
.tcard-name{display:block;font-family:var(--font-b);font-size:15px;font-weight:600;color:var(--dark)}
.tcard-role{font-family:var(--font-b);font-size:13px;color:var(--muted)}

/* ===== PRICING (3-column) ===== */
.pricing-section{padding:var(--gap) 0}
.pricing-section .eyebrow-upper{text-align:center}

.pricing-toggle-row{display:flex;justify-content:center;margin-bottom:40px}
.toggle-wrap{display:flex;gap:4px;background:var(--off-white);border-radius:100px;padding:4px;width:fit-content}
.tog{font-family:var(--font-b);font-size:14px;font-weight:500;color:var(--muted);background:transparent;border:none;padding:8px 20px;border-radius:100px;cursor:pointer;transition:.25s}
.tog.active{background:var(--white);color:var(--dark);box-shadow:0 2px 8px rgba(0,0,0,.06)}

.pricing-3col{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:24px;align-items:start}

.pricing-col{padding:32px 24px}
.pricing-col--left{background:transparent}
.pricing-col--left .heading-3{margin-bottom:4px}
.pricing-col--left .body-muted-sm{margin-bottom:20px}

.pricing-col--center{background:var(--beige-card);border-radius:24px;display:flex;flex-direction:column;gap:16px}

.pricing-col--right{background:transparent}

.save-tag{font-family:var(--font-b);font-size:13px;font-weight:600;color:var(--green);background:rgba(14,161,88,.1);padding:4px 12px;border-radius:100px;width:fit-content;transition:opacity .3s}
.save-tag.hidden{opacity:0}
.pc-plan{font-family:var(--font-h);font-size:24px;color:var(--dark);letter-spacing:-.02em}
.pc-price{display:flex;align-items:baseline;gap:4px}
.pc-amount{font-family:var(--font-h);font-size:52px;color:var(--dark);letter-spacing:-.03em;line-height:1;transition:.3s}
.pc-per{font-family:var(--font-b);font-size:18px;color:var(--muted)}
.pc-note{font-family:var(--font-b);font-size:14px;color:var(--muted)}
.pc-features{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.pc-feat{display:flex;align-items:center;gap:12px;font-family:var(--font-b);font-size:15px;color:var(--dark2)}

.dash-list{list-style:none;margin-bottom:12px}
.dash-list li{font-family:var(--font-b);font-size:16px;color:var(--dark2);padding:5px 0 5px 20px;position:relative}
.dash-list li::before{content:"—";position:absolute;left:0;color:var(--muted)}

.bestfor-list{list-style:none}
.bestfor-list li{font-family:var(--font-b);font-size:15px;color:var(--dark2);padding:6px 0;padding-left:20px;position:relative}
.bestfor-list li::before{content:"✓";position:absolute;left:0;color:var(--dark)}

/* ===== STATS ===== */
.stats-section{padding:var(--gap) 0;text-align:center}
.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.stat-num{display:block;font-family:var(--font-h);font-size:clamp(40px,5vw,58px);font-weight:400;letter-spacing:-.03em;color:var(--dark);line-height:1;margin-bottom:8px}
.stat-lbl{font-family:var(--font-m);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

/* ===== ABOUT ===== */
.about-section{padding:var(--gap) 0}
.about-card{background:var(--beige);border-radius:24px;padding:56px 48px;display:flex;gap:56px;align-items:flex-start}
.about-photo-col{flex:0 0 300px}
.about-photo{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:20px;transition:transform 1.6s cubic-bezier(.25,.46,.45,.94)}
[data-zoom].zoomed{transform:scale(1.02)}
.about-text-col{flex:1}
.about-text-col .eyebrow-upper{margin-bottom:16px}
.about-text-col .heading-2{margin-bottom:28px}

/* ===== FAQ ===== */
.faq-section{padding:var(--gap) 0}
.faq-section .eyebrow-upper{text-align:center}
.faq-list{max-width:720px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--border)}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;padding:24px 0;background:none;border:none;cursor:pointer;font-family:var(--font-b);font-size:18px;font-weight:500;color:var(--dark);text-align:left}
.faq-chevron{flex-shrink:0;color:var(--muted);transition:transform .3s}
.faq-item.active .faq-chevron{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease}
.faq-item.active .faq-a{max-height:200px;padding-bottom:24px}
.faq-a p{font-family:var(--font-b);font-size:16px;line-height:1.6;color:var(--dark2)}

/* ===== BOTTOM CTA ===== */
.bottom-cta{padding:0 0 var(--gap)}
.bottom-cta-inner{text-align:center;max-width:640px;margin:0 auto}
.bottom-cta .display-heading{margin-bottom:20px}
.bottom-cta .body-text{margin-bottom:4px}
.bottom-cta .btn{margin-top:28px}

/* ===== PAGE CLOUDS (bottom parallax, like reference) ===== */
.page-clouds{position:relative;width:100%;height:0;pointer-events:none;z-index:0}
.page-cloud{position:absolute;bottom:0;opacity:.3;will-change:transform}
.page-cloud-l{left:-160px;width:600px;bottom:-200px}
.page-cloud-r{right:-160px;width:600px;bottom:-180px}

/* ===== FOOTER ===== */
.footer{position:relative;padding:48px 0 30px;z-index:1}
.footer-inner{position:relative;z-index:1}
.footer-brand{text-align:center;margin-bottom:28px}
.footer-logo-img{height:28px;width:auto;margin:0 auto;opacity:.7}
.footer-meta{display:flex;align-items:center;justify-content:space-between}
.footer-meta p{font-family:var(--font-b);font-size:13px;color:var(--muted)}
.footer-social{display:flex;gap:16px}
.footer-social a{color:var(--muted);opacity:.5;transition:opacity .2s}
.footer-social a:hover{opacity:1}
.footer-loc{font-family:var(--font-m);font-size:12px;color:var(--muted)}

/* ===== SCROLL ANIMATIONS ===== */
[data-animate]{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s ease}
[data-animate="fade"]{transform:none}
[data-animate].visible{opacity:1!important;transform:translateY(0)!important}
[data-delay="50"]{transition-delay:.05s}
[data-delay="100"]{transition-delay:.1s}
[data-delay="200"]{transition-delay:.2s}
[data-delay="300"]{transition-delay:.3s}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
  :root{--gap:96px}
  .hero-title{font-size:52px}
  .hero-deco-left{left:-300px;width:440px}.hero-deco-right{right:-300px;width:440px}
  .split-layout,.split-layout--reverse{flex-direction:column;gap:40px}
  .split-media{flex:none;width:100%;max-width:420px}
  .pricing-3col{grid-template-columns:1fr;gap:32px}
  .pricing-col--center{max-width:420px;margin:0 auto;width:100%}
  .about-card{flex-direction:column;gap:36px;padding:40px 32px}
  .about-photo-col{flex:none;width:100%;max-width:280px}
  .changes-row-3{grid-template-columns:1fr 1fr}
}

@media(max-width:810px){
  .nav-links,.nav-cta{display:none}.menu-toggle{display:block}
  .hero{padding:128px 0 0}
  .hero-title{font-size:44px}
  .hero-content{padding:0 16px}
  .heading-2{font-size:32px}
  .stats-row{grid-template-columns:1fr;gap:32px}
  .footer-meta{flex-direction:column;gap:16px;text-align:center}
  .hero-deco{display:none}
  .tcard{width:270px}
  .changes-row-2{grid-template-columns:1fr}
  .changes-row-3{grid-template-columns:1fr}
  .page-cloud{display:none}
}

@media(max-width:480px){
  .hero-title{font-size:36px}
  .hero{padding:120px 0 0}
  .container{padding:0 16px}
  .hero-media{padding:0 16px}
  .pricing-col{padding:24px 16px}
  .about-card{padding:28px 20px}
}