@font-face {
  font-family: "Manrope";
  src: url("/fonts/manrope-variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

.page { --ink:#182033; --muted:#5b667b; --orange:#ff6a00; --line:#e9e9e9; background:#fffdf9; color:var(--ink); font-family:Manrope,"Avenir Next",sans-serif; line-height:1.65; min-height:100vh; overflow:clip; padding:0 24px; }
.page * { box-sizing:border-box; }
.page a { color:inherit; text-decoration:none; }
.page a:focus-visible,.page summary:focus-visible { outline:3px solid #ff9b53; outline-offset:4px; }
.header { align-items:center; display:flex; gap:28px; justify-content:space-between; margin:0 auto; max-width:1180px; min-height:82px; }
.brand { align-items:center; display:inline-flex; flex:none; gap:9px; }
.brand img { border-radius:12px; height:42px; object-fit:cover; width:42px; }
.brand>span { font-size:23px; font-weight:850; letter-spacing:-1.5px; line-height:1; }
.brand>span>span { color:var(--orange); }
.brand small { color:var(--muted); display:block; font-size:9px; font-weight:600; letter-spacing:.03em; margin-top:5px; }
.header nav { display:flex; gap:28px; margin-left:auto; }
.header nav a,.footer nav a { color:var(--muted); font-size:13px; font-weight:700; }
.headerCta,.button { align-items:center; background:var(--orange); border:1px solid var(--orange); border-radius:11px; box-shadow:0 8px 18px #ff6a0024; color:white!important; display:inline-flex; font-size:13px; font-weight:800; gap:14px; justify-content:center; min-height:46px; padding:0 18px; transition:transform .18s ease,box-shadow .18s ease,background .18s ease; }
.headerCta:hover,.button:hover { background:#e85200; box-shadow:0 11px 22px #ff6a0032; transform:translateY(-2px); }
.hero { background:radial-gradient(ellipse at 83% 50%,#ffe1cb 0%,#fff7f0 29%,transparent 64%),linear-gradient(120deg,#fff 0%,#fffaf6 100%); border:1px solid #f1e7df; border-radius:26px; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr); margin:10px auto 0; max-width:1180px; min-height:440px; overflow:hidden; padding:clamp(30px,6vw,68px); position:relative; }
.heroCopy { align-self:center; max-width:660px; position:relative; z-index:1; }
.eyebrow,.kicker { color:#e85200; font-size:11px; font-weight:850; letter-spacing:.13em; margin:0 0 16px; text-transform:uppercase; }
.hero h1 { font-size:clamp(38px,5.1vw,62px); font-weight:850; letter-spacing:-.065em; line-height:1.05; margin:0; }
.hero h1 span,.variants h2 span,.cta h2 span { color:var(--orange); }
.lead { color:#3f4b61; font-size:clamp(16px,1.7vw,19px); line-height:1.72; margin:20px 0 24px; max-width:625px; }
.note { color:#727e91; font-size:11px; font-weight:650; margin:15px 0 0; }
.pupWrap { align-items:center; display:flex; justify-content:center; min-height:290px; position:relative; }
.pupWrap::before { background:radial-gradient(ellipse,#ffbb8466,transparent 70%); content:""; inset:10%; position:absolute; }
.pupWrap img { filter:drop-shadow(0 18px 19px #7c3a1424); max-height:350px; max-width:100%; object-fit:contain; position:relative; }
.videoSection,.articleSection,.steps,.variants,.faq { margin:0 auto; max-width:1030px; padding:85px 20px; }
.videoSection { align-items:center; display:grid; gap:48px; grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr); }
.videoSection h2,.articleSection h2,.sectionHeading h2,.variants h2,.faq h2 { font-size:clamp(27px,3.5vw,40px); font-weight:850; letter-spacing:-.055em; line-height:1.14; margin:0; }
.videoSection p:not(.kicker),.articleSection>p:not(.kicker),.variants p:not(.kicker) { color:var(--muted); font-size:15px; line-height:1.8; }
.videoFrame { aspect-ratio:16/9; background:#151a26; border:1px solid #f2e6dc; border-radius:18px; box-shadow:0 24px 60px #18203318; overflow:hidden; }
.videoFrame iframe { border:0; height:100%; width:100%; }
.articleSection { border-bottom:1px solid var(--line); border-top:1px solid var(--line); max-width:990px; }
.articleSection>p:not(.kicker) { max-width:850px; }
.steps { display:grid; gap:13px; grid-template-columns:1fr; }
.sectionHeading { margin-bottom:20px; text-align:center; }
.step { align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:15px; display:grid; gap:20px; grid-template-columns:44px 1fr; padding:22px; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.step:hover { border-color:#ffd0ac; box-shadow:0 15px 38px #1820330c; transform:translateY(-2px); }
.step>span { align-items:center; background:#fff1e7; border-radius:13px; color:#e85200; display:grid; font-size:13px; font-weight:850; height:44px; justify-items:center; }
.step h3 { font-size:17px; letter-spacing:-.025em; margin:0 0 5px; }
.step p { color:var(--muted); font-size:14px; line-height:1.75; margin:0; max-width:780px; }
.variants { align-items:center; background:linear-gradient(115deg,#fff4eb,#fffaf6 66%,#fff); border:1px solid #f4e5d7; border-radius:22px; display:grid; gap:45px; grid-template-columns:1fr .9fr; margin:0 auto; padding:clamp(28px,5vw,52px); }
.variantCard { background:#fff; border:1px solid #ece8e2; border-radius:15px; box-shadow:0 14px 30px #1820330a; padding:20px; }
.variantCard>div strong,.variantCard>div small { display:block; }
.variantCard>div strong { font-size:15px; }
.variantCard>div small,.variantCard>small { color:var(--muted); font-size:11px; }
.variantCard ul { border-top:1px solid var(--line); display:grid; gap:10px; list-style:none; margin:15px 0; padding:14px 0 0; }
.variantCard li { display:flex; font-size:12px; gap:8px; justify-content:space-between; }
.variantCard li span { color:var(--muted); white-space:nowrap; }
.faq { padding-bottom:95px; }
.faq h2 { margin-bottom:24px; }
.faq details { border-bottom:1px solid var(--line); padding:17px 0; }
.faq summary { align-items:center; cursor:pointer; display:flex; font-size:15px; font-weight:750; gap:20px; justify-content:space-between; list-style:none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary span { color:var(--orange); font-size:23px; }
.faq details p { color:var(--muted); font-size:14px; line-height:1.75; margin:10px 0 0; max-width:830px; }
.cta { align-items:center; background:linear-gradient(110deg,#fff2e8,#fff9f4); border:1px solid #f4e4d7; border-radius:22px; display:grid; gap:18px; grid-template-columns:115px 1fr auto; margin:0 auto 60px; max-width:1030px; padding:20px 28px; }
.cta img { height:110px; object-fit:contain; width:110px; }
.cta h2 { font-size:clamp(22px,3vw,30px); font-weight:850; letter-spacing:-.05em; line-height:1.12; margin:0; }
.cta h2 span { color:var(--orange); }
.cta p:not(.kicker) { color:var(--muted); font-size:13px; margin:7px 0 0; }
.cta .kicker { margin-bottom:8px; }
.footer { align-items:center; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:18px 28px; justify-content:space-between; margin:0 auto; max-width:1180px; padding:22px 0 32px; }
.footer>p { color:var(--muted); font-size:12px; font-weight:750; }
.footer nav { display:flex; flex-wrap:wrap; gap:18px; }
.footer>small { color:#828a98; font-size:10px; width:100%; }

@media (max-width:760px) {
  .page { padding:0 14px; }
  .header { flex-wrap:wrap; gap:12px; padding:12px 0; }
  .header nav { display:none; }
  .headerCta { margin-left:auto; min-height:40px; padding:0 12px; }
  .hero { grid-template-columns:1fr; padding:30px 24px 12px; }
  .hero h1 { font-size:clamp(36px,9vw,50px); }
  .pupWrap { min-height:230px; }
  .pupWrap img { max-height:270px; }
  .videoSection { gap:20px; grid-template-columns:1fr; padding:60px 8px; }
  .articleSection,.steps,.faq { padding:62px 8px; }
  .variants { gap:22px; grid-template-columns:1fr; }
  .cta { grid-template-columns:75px 1fr; padding:17px; }
  .cta img { height:76px; width:76px; }
  .cta .button { grid-column:1/-1; width:100%; }
  .footer { align-items:flex-start; flex-direction:column; gap:10px; padding:20px 0; }
}

@media (prefers-reduced-motion: reduce) { .headerCta,.button,.step { transition:none; } .headerCta:hover,.button:hover,.step:hover { transform:none; } }
.articleBody h2 { margin:40px 0 16px; }
.articleBody h2:first-child { margin-top:0; }
.articleBody h3 { font-size:22px; letter-spacing:-.03em; margin-top:32px; }
.articleBody a,.articleSection a,.videoSection a { color:#c64c00; text-decoration:underline; text-underline-offset:3px; }
.articleBody li { color:var(--muted); margin:10px 0; }
.articleBody img { max-width:100%; height:auto; border-radius:14px; }
.articleBody blockquote { border-left:4px solid var(--orange); padding:12px 22px; background:#fff4eb; }
.steps .step h3 a:hover { color:var(--orange); }
.videoPanel { min-width:0; }
.videoPoster { aspect-ratio:16/9; display:block; position:relative; overflow:hidden; border:1px solid #f2e6dc; border-radius:18px; box-shadow:0 24px 60px #18203318; background:linear-gradient(120deg,#fff2e8,#ffd0ac); }
.videoPoster img { display:block; width:100%; height:100%; object-fit:cover; }
.videoPoster>span { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background:#e85200; color:#fff; border-radius:12px; padding:13px 18px; font-size:14px; font-weight:800; white-space:nowrap; box-shadow:0 8px 24px #0005; }
.embeddedPlayer { margin-top:16px; }
.embeddedPlayer summary { color:#c64c00; font-size:13px; font-weight:750; cursor:pointer; margin-bottom:12px; }
.embeddedPlayer .note { margin-top:8px; }
@media(max-width:760px) { .heroCopy,.videoPanel,.articleBody { min-width:0; } .articleBody { overflow-wrap:anywhere; } }

.crumbs{margin:6px auto 0;max-width:1180px;font-size:12px;font-weight:700;color:var(--muted)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.crumbs li+li::before{content:"/";margin-right:6px;color:#c9c9c9}
.crumbs a{color:#c64c00!important}
.status{display:inline-block;border-radius:999px;font-size:11px;font-weight:850;letter-spacing:.06em;padding:5px 12px;margin:0 0 14px;text-transform:uppercase}
.status.live{background:#e7f7ec;color:#17733a}.status.soon{background:#fff1e7;color:#c64c00}
.ctaRow{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ghost{border:1px solid #f1cfb4;border-radius:11px;color:#c64c00!important;font-size:13px;font-weight:800;min-height:46px;display:inline-flex;align-items:center;padding:0 18px;background:#fff}
.planTable{width:100%;border-collapse:collapse;font-size:14px;margin:18px 0;display:block;overflow-x:auto}
.planTable th,.planTable td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.planTable th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.articleBody ul{padding-left:20px}
.platformLinks{margin:0 auto;max-width:1030px;padding:60px 20px}
.platformLinks h2{font-size:clamp(24px,3vw,32px);font-weight:850;letter-spacing:-.05em;margin:0 0 18px}
.platformGrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.platformGrid a{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px 18px;display:block;transition:border-color .2s}
.platformGrid a:hover{border-color:#ffd0ac}
.platformGrid strong{display:block;font-size:15px}.platformGrid small{color:var(--muted);font-size:12px}
.platformGrid a[aria-current]{border-color:var(--orange);background:#fff7f0}
