*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --cream: #FCF6EF; --cream-2: #F6F0E9; --panel: #FFF7ED; --card: #FFFFFF;
      --espresso: #2F1706; --ink: #2A150A; --mocha: #624C41;
      --amber: #E4924E; --amber-soft: #FFEDD7; --muted: #8b7d70; --line: #EADFD2;
      --pill: 12px; --r: 12px; --i1:url("/assets/slide-1.jpg?v=2"); --i2:url("/assets/slide-2.jpg"); --i3:url("/assets/slide-3.jpg"); --i4:url("/assets/slide-4.jpg"); --i5:url("/assets/slide-5.jpg");
      --shadow-card: 0 22px 50px rgba(74,45,20,0.16);
      --shadow-soft: 0 8px 26px rgba(74,45,20,0.10);
    }
    html { scroll-behavior: smooth; }
    body { font-family:'Space Grotesk',-apple-system,system-ui,sans-serif; background:var(--cream); color:var(--ink); line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
    a { text-decoration:none; color:inherit; }
    .serif { font-family:'Space Grotesk',sans-serif; } .mono { font-family:'Fira Code',ui-monospace,monospace; }
    .wrap { max-width:1200px; margin:0 auto; padding:0 28px; }
    .btn { display:inline-flex; align-items:center; gap:8px; border:none; cursor:pointer; font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:600; padding:13px 22px; border-radius:var(--r); transition:transform .15s, opacity .15s, box-shadow .2s; }
    .btn:hover { transform:translateY(-1px); }
    .btn-dark { background:var(--espresso); color:#fff; } .btn-dark:hover{opacity:.9;}
    .btn-ghost { background:#fff; color:var(--ink); border:1px solid var(--line); }
    .btn-lg { padding:15px 28px; font-size:16px; }
    /* NAV: full-width and transparent at the top, then morphs into an inset floating bar on scroll */
    #site-header { position:fixed; z-index:100; top:0; left:0; right:0; transition:all .5s cubic-bezier(.4,0,.2,1); }
    #site-header.scrolled { top:16px; left:16px; right:16px; }
    #site-header nav { margin:0 auto; max-width:1400px; background:transparent; border:1px solid transparent; border-radius:0; transition:all .5s cubic-bezier(.4,0,.2,1); }
    #site-header.scrolled nav { max-width:1200px; background:rgba(252,246,239,.82); -webkit-backdrop-filter:saturate(1.4) blur(20px); backdrop-filter:saturate(1.4) blur(20px); border-color:rgba(228,146,78,.2); border-radius:20px; box-shadow:0 10px 30px rgba(74,45,20,.10); }
    .nav-row { display:flex; align-items:center; justify-content:space-between; gap:16px; height:72px; padding:16px 32px; transition:all .5s cubic-bezier(.4,0,.2,1); }
    #site-header.scrolled .nav-row { height:56px; padding:10px 24px; }
    .nav-logo { display:flex; align-items:center; } .nav-logo img { height:25px; width:auto; }
    .nav-right { display:flex; align-items:center; gap:24px; }
    .nav-links { display:flex; align-items:center; gap:24px; list-style:none; }
    .nav-links > li > a, .dd-btn { font:inherit; font-size:14px; font-weight:500; color:var(--ink); transition:color .15s; }
    .nav-links > li > a:hover, .dd-btn:hover { color:var(--amber); }
    .nav-signin { font-size:14px; font-weight:500; color:var(--ink); transition:color .15s; } .nav-signin:hover { color:var(--amber); }
    .nav-cta { background:var(--espresso); color:#fff; padding:9px 18px; border-radius:var(--pill); font-weight:600; font-size:14px; display:inline-flex; align-items:center; transition:opacity .15s; } .nav-cta:hover { opacity:.9; }
    .nav-toggle { display:none; background:transparent; border:none; cursor:pointer; color:var(--ink); padding:6px; }
    .nav-toggle svg { width:24px; height:24px; }
    /* dropdown panels */
    .dd { position:relative; }
    .dd-btn { background:none; border:none; cursor:pointer; display:inline-flex; align-items:center; gap:4px; padding:0; }
    .dd-btn .chev { font-size:10px; transition:transform .15s ease; }
    .dd.open .chev { transform:rotate(180deg); }
    .dd-panel { display:none; position:absolute; top:calc(100% + 18px); left:50%; transform:translateX(-50%); width:400px; max-width:calc(100vw - 32px); background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 14px 44px rgba(74,45,20,.15); padding:10px; z-index:200; text-align:left; }
    .dd.open .dd-panel { display:block; }
    .dd-item { display:flex; align-items:center; gap:14px; padding:10px; border-radius:12px; transition:background .15s; }
    .dd-item:hover { background:var(--cream-2); }
    .dd-ic { flex:none; width:42px; height:42px; border-radius:12px; background:var(--amber-soft); color:var(--amber); display:grid; place-items:center; transition:background .15s, color .15s; }
    .dd-ic svg { width:20px; height:20px; }
    .dd-item:hover .dd-ic { background:var(--espresso); color:#fff; }
    .dd-tx b { display:block; font-size:14px; font-weight:600; color:var(--ink); line-height:1.3; }
    .dd-tx small { display:block; font-size:12.5px; color:var(--muted); line-height:1.4; margin-top:2px; }
    .dd-cta { display:block; margin:6px 4px 2px; padding:12px 10px 6px; border-top:1px solid var(--line); font-size:13px; font-weight:600; color:var(--amber); }
    @media (prefers-reduced-motion: reduce){ #site-header, #site-header nav, .nav-row { transition:none; } }
    @media (max-width:900px){
      #site-header.scrolled { top:8px; left:8px; right:8px; }
      .nav-row, #site-header.scrolled .nav-row { height:60px; padding:10px 18px; }
      .nav-toggle { display:inline-flex; }
      .nav-right { position:absolute; top:calc(100% + 8px); left:12px; right:12px; flex-direction:column; align-items:stretch; gap:6px; background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:14px; box-shadow:var(--shadow-soft); display:none; max-height:calc(100vh - 100px); overflow-y:auto; }
      #site-header.open .nav-right { display:flex; }
      .nav-links { flex-direction:column; align-items:stretch; gap:2px; }
      .nav-links > li > a, .dd-btn { display:flex; width:100%; align-items:center; justify-content:space-between; padding:12px 10px; border-radius:10px; font-size:15px; }
      .dd-panel { position:static; transform:none; width:auto; max-width:none; box-shadow:none; border:none; background:transparent; padding:2px 0 8px; border-radius:0; }
      .dd-item:hover { background:rgba(228,146,78,.10); }
      .nav-signin { padding:12px 10px; font-size:15px; }
      .nav-cta { justify-content:center; padding:13px 18px; margin-top:4px; }
    }

    /* HERO with ROTATING RING */
    .hero { position:relative; text-align:center; overflow:hidden; padding-bottom: 40px; }
    .hero::before { content:""; position:absolute; inset:0 0 auto 0; height:680px; z-index:0; pointer-events:none; background: radial-gradient(58% 62% at 50% 16%, rgba(228,146,78,0.18), rgba(228,146,78,0) 62%); }
    /* fade the bottom of the hero into the page background (bottom 35%) */
    .hero::after { content:""; position:absolute; left:0; right:0; bottom:0; height:35%; z-index:1; pointer-events:none; background: linear-gradient(to bottom, rgba(252,246,239,0) 0%, var(--cream) 78%); }
    .ring-stage { position:relative; z-index:1; height: 470px; margin-top: 96px; }
    .ring { position:absolute; left:50%; top: 132px; width: 1780px; height: 1780px; margin-left:-890px; border-radius:50%; animation: spin 60s linear infinite; will-change: transform; }
    @keyframes spin { to { transform: rotate(-360deg); } }
    .rcard { position:absolute; left:50%; top:50%; width: 220px; height: 286px; margin:-143px 0 0 -110px; transform: rotate(var(--a)) translateY(-890px); border-radius: 26px; overflow:hidden; background:#eee; border: 6px solid rgba(255,255,255,0.9); box-shadow: 0 26px 48px rgba(74,45,20,0.20); }
    .rcard { background-size:cover; background-position:center; }
    .prompt { position:relative; z-index:5; margin: -46px auto 0; max-width:820px;
      border:3px solid transparent; border-radius:28px;
      background:
        linear-gradient(#fff,#fff) padding-box,
        linear-gradient(90deg,#E4924E,#F0B45A,#E86C52,#D9557A,#A06CC9,#5B8FB0,#46B39D,#F0B45A,#E4924E) border-box;
      background-size:100% 100%, 420% 100%;
      animation: borderslide 3s linear infinite;
      box-shadow: 0 30px 60px rgba(74,45,20,0.20);
      padding:30px 28px 24px; text-align:left; transition: box-shadow .4s; }
    @keyframes borderslide { to { background-position: 0 0, -420% 0; } }
    .prompt::after { content:""; position:absolute; inset:0; border-radius:25px; box-shadow: inset 0 0 0 3px var(--amber); opacity:0; transition:opacity .45s; pointer-events:none; }
    .prompt:focus-within { animation-play-state:paused; box-shadow: 0 30px 60px rgba(74,45,20,0.20), 0 0 0 5px rgba(228,146,78,0.20); }
    .prompt:focus-within::after { opacity:1; }
    .prompt-input { display:flex; align-items:center; gap:12px; padding:6px 6px 18px; }
    .prompt-input .dot { color:var(--amber); font-size:22px; }
    .pfield { flex:1; min-width:0; border:none; outline:none; background:transparent; font-family:'Space Grotesk',sans-serif; font-size:19px; color:var(--ink); }
    .pfield::placeholder { color:var(--muted); opacity:1; }
    .prompt-row { display:flex; align-items:center; gap:9px; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:18px; }
    .chip { display:inline-flex; align-items:center; gap:6px; font-family:'Fira Code',monospace; font-size:13px; font-weight:500; color:var(--mocha); background:var(--cream-2); border:1px solid var(--line); border-radius:var(--pill); padding:8px 15px; }
    .go { margin-left:auto; display:inline-flex; align-items:center; gap:8px; background:var(--espresso); color:#fff; border:none; cursor:pointer; font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:15px; padding:13px 24px; border-radius:var(--pill); transition:opacity .15s; }
    .go:hover { opacity:.9; }
    @media (max-width:560px){ .chip.hide-sm{display:none;} }
    .hero-head { position:relative; z-index:2; margin-top:52px; }
    .hero-head h1 { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:clamp(34px,4.6vw,60px); line-height:1.08; letter-spacing:-0.03em; color:var(--ink); }
    .hero-head p { font-size:clamp(16px,1.8vw,19px); color:var(--muted); max-width:560px; margin:20px auto 30px; }
    .hero-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
    @media (max-width: 760px){
      .ring-stage { height: 340px; }
      .ring { top: 96px; width: 1200px; height: 1200px; margin-left:-600px; }
      .rcard { width: 150px; height: 196px; margin:-98px 0 0 -75px; transform: rotate(var(--a)) translateY(-600px); }
    }
    @media (prefers-reduced-motion: reduce){ .ring, .prompt { animation: none; } }

    section.blk { padding:100px 0; } .blk.panel { background:var(--panel); }
    .eyebrow { font-family:'Fira Code',monospace; font-size:12px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--amber); margin-bottom:16px; display:inline-block; }
    .h2 { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:clamp(32px,4.2vw,54px); line-height:1.1; letter-spacing:-0.03em; }
    .sub { font-size:18px; color:var(--muted); max-width:560px; }
    .center { text-align:center; } .center .sub { margin-left:auto; margin-right:auto; }
    .steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:22px; margin-top:54px; text-align:left; }
    .step { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:32px; display:flex; flex-direction:column; }
    .step-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:26px; }
    .step-num { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:36px; line-height:1; color:var(--ink); }
    .step-chip { font-family:'Fira Code',monospace; font-size:11px; font-weight:700; letter-spacing:.1em; color:var(--mocha); background:var(--amber-soft); border-radius:100px; padding:6px 12px; }
    .step h3 { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:21px; margin-bottom:10px; }
    .step p { font-size:15px; color:var(--muted); margin-bottom:18px; }
    .step-more { margin-top:auto; font-size:14px; font-weight:600; color:var(--amber); }
    .step-more:hover { text-decoration:underline; }
    .feats { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:18px; margin-top:54px; }
    .feat { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:30px; transition:transform .2s, box-shadow .2s; }
    .feat:hover { transform:translateY(-3px); box-shadow:var(--shadow-soft); }
    .feat .ic { width:50px; height:50px; border-radius:14px; background:var(--amber-soft); display:flex; align-items:center; justify-content:center; font-size:23px; margin-bottom:18px; }
    .feat h3 { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:21px; margin-bottom:8px; }
    .feat p { font-size:15px; color:var(--muted); line-height:1.7; }
    .plans { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:20px; max-width:780px; margin:54px auto 0; text-align:left; }
    .plan { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:36px 32px; }
    .plan.hot { background:var(--espresso); color:#fff; box-shadow:var(--shadow-card); }
    .plan .pin { font-family:'Fira Code',monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase; padding:4px 11px; border-radius:100px; background:var(--amber-soft); color:var(--mocha); display:inline-block; margin-bottom:16px; }
    .plan.hot .pin { background:rgba(228,146,78,.25); color:#ffd9b3; }
    .plan .nm { font-family:'Space Grotesk',sans-serif; font-size:24px; font-weight:600; margin-bottom:4px; }
    .plan .pr { font-family:'Space Grotesk',sans-serif; font-size:48px; font-weight:600; letter-spacing:-0.02em; }
    .plan .pe { font-size:13px; color:var(--muted); margin-bottom:24px; } .plan.hot .pe{color:rgba(255,255,255,.55);}
    .plan ul { list-style:none; display:flex; flex-direction:column; gap:11px; margin-bottom:28px; }
    .plan li { font-size:15px; display:flex; align-items:center; gap:11px; }
    .plan li::before { content:"✓"; width:20px; height:20px; border-radius:50%; background:var(--amber-soft); color:var(--mocha); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; flex-shrink:0; }
    .plan.hot li::before { background:rgba(228,146,78,.25); color:#ffd9b3; }
    .pbtn { display:block; text-align:center; padding:13px; border-radius:var(--pill); font-weight:600; font-size:15px; transition:all .15s; }
    .pbtn.out { border:1.5px solid var(--line); color:var(--ink); } .pbtn.out:hover{ border-color:var(--amber); background:var(--amber-soft); }
    .pbtn.wht { background:#fff; color:var(--ink); } .pbtn.wht:hover{ opacity:.9; }
    .quotes { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:18px; margin-top:54px; text-align:left; }
    .q { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:28px; }
    .q .st { color:var(--amber); letter-spacing:2px; margin-bottom:14px; }
    .q p { font-size:16px; margin-bottom:20px; }
    .q .who { display:flex; align-items:center; gap:11px; }
    .q .who .a { width:40px; height:40px; border-radius:50%; overflow:hidden; }
    .q .who .a { background-size:cover; background-position:center; }
    .q .who b { font-size:14px; display:block; } .q .who span { font-size:12.5px; color:var(--muted); }
    .faq { max-width:760px; margin:44px auto 0; text-align:left; }
    .faq details { border-bottom:1px solid var(--line); }
    .faq summary { list-style:none; cursor:pointer; padding:20px 4px; font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:500; display:flex; justify-content:space-between; gap:16px; }
    .faq summary::-webkit-details-marker{ display:none; }
    .faq summary::after { content:"+"; color:var(--amber); font-size:24px; } .faq details[open] summary::after { content:"−"; }
    .faq p { padding:0 4px 22px; color:var(--muted); font-size:15.5px; }
    .final { padding:40px 0 110px; }
    .final .box { background:var(--espresso); color:#fff; border-radius:34px; padding:78px 40px; text-align:center; position:relative; overflow:hidden; }
    .final .box::before{ content:""; position:absolute; top:-45%; left:50%; transform:translateX(-50%); width:640px; height:520px; background:radial-gradient(circle,rgba(228,146,78,.35),transparent 62%); }
    .final .box > *{ position:relative; z-index:1; }
    .final h2 { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:clamp(34px,5vw,56px); letter-spacing:-0.03em; margin-bottom:14px; }
    .final p { color:rgba(255,255,255,.72); font-size:18px; max-width:480px; margin:0 auto 30px; }
    .btn-cream { background:var(--cream); color:var(--espresso); }
    footer { background:#241206; color:rgba(255,255,255,.5); padding:56px 0 30px; }
    .ft { display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,.08); }
    .ft .b { max-width:280px; } .ft .b img { height:26px; filter:brightness(0) invert(1) opacity(.6); margin-bottom:14px; } .ft .b p { font-size:14px; }
    .ft .cols { display:flex; gap:60px; flex-wrap:wrap; }
    .ft .cols h4 { font-family:'Fira Code',monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.4); margin-bottom:15px; }
    .ft .cols a { display:block; font-size:14px; color:rgba(255,255,255,.62); margin-bottom:11px; } .ft .cols a:hover{color:#fff;}
    .fb { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; padding-top:22px; font-size:13px; }
      .go { text-decoration:none; }
    .q h3 { font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:20px; margin-bottom:8px; }
    .q p { margin-bottom:0; color:var(--muted); font-size:15.5px; }
    .fine { font-size:13px; color:var(--muted); margin-top:26px; }
    .step-chip, .plan .pin { border-radius:8px; }
    .btn-dark, .btn-ghost, .btn-cream, .nav-cta, .go, .pbtn { border-radius:var(--pill); }

/* PRICING: per-channel price card + calculator */
.pcard { display:grid; grid-template-columns:1.1fr 1fr; gap:0; max-width:920px; margin:54px auto 0; background:var(--card); border:1px solid var(--line); border-radius:24px; overflow:hidden; box-shadow:var(--shadow-soft); text-align:left; }
.pcard .l { padding:40px 38px; }
.pcard .r { padding:40px 38px; background:var(--espresso); color:#fff; display:flex; flex-direction:column; justify-content:center; }
.pcard .big { font-size:72px; font-weight:600; letter-spacing:-0.04em; line-height:1; }
.pcard .per { font-size:15px; color:var(--muted); margin:8px 0 26px; }
.pcard ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.pcard li { font-size:15px; display:flex; gap:10px; align-items:flex-start; }
.pcard li::before { content:"✓"; flex:none; width:20px; height:20px; border-radius:6px; background:var(--amber-soft); color:var(--mocha); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; margin-top:2px; }
.calc-label { font-family:'Fira Code',monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.55); margin-bottom:14px; }
.stepper { display:flex; align-items:center; gap:14px; margin-bottom:22px; }
.stepper button { width:44px; height:44px; border-radius:12px; border:1px solid rgba(255,255,255,.25); background:transparent; color:#fff; font-size:22px; cursor:pointer; transition:background .15s; }
.stepper button:hover { background:rgba(255,255,255,.12); }
.stepper output { min-width:64px; text-align:center; font-size:40px; font-weight:600; letter-spacing:-0.02em; }
.stepper span { font-size:15px; color:rgba(255,255,255,.65); }
.calc-total { font-size:44px; font-weight:600; letter-spacing:-0.03em; }
.calc-total small { font-size:16px; font-weight:500; color:rgba(255,255,255,.6); letter-spacing:0; }
.calc-note { font-size:13.5px; color:rgba(255,255,255,.6); margin-top:8px; }
@media (max-width:760px){ .pcard { grid-template-columns:1fr; } .pcard .l, .pcard .r { padding:30px 24px; } .pcard .big { font-size:60px; } }