.hero{padding:30px 0 10px}
.hero .kicker{font-family:var(--mono);font-size:12px;letter-spacing:.14em;
  color:var(--coral-deep);text-transform:uppercase;margin-bottom:12px;
  display:flex;align-items:center;gap:8px}
.hero .kicker::before{content:"";width:22px;height:2px;background:var(--coral)}

.hero h1{font-size:34px;line-height:1.22;margin-bottom:16px;letter-spacing:-.01em;font-weight:700}
.hero h1 .dim{color:var(--ink-3);font-weight:600}
.hero h1 .hl{color:var(--coral-deep)}
.hero h1 .dot{color:var(--coral)}

.hero-copy>*{animation:fd .6s ease both}
.hero-copy>:nth-child(2){animation-delay:.06s}
.hero-copy>:nth-child(3){animation-delay:.12s}
.hero-copy>:nth-child(4){animation-delay:.18s}
.hero-copy>:nth-child(5){animation-delay:.24s}
@media (prefers-reduced-motion:reduce){.hero-copy>*{animation:none}}
.hero .sub{font-size:16.5px;color:var(--ink-2);line-height:1.75}
.hero .sub b{color:var(--coral-deep)}
.hero-cta{display:flex;gap:12px;align-items:center;margin:20px 0 6px;flex-wrap:wrap}
.hero-cta .btn{width:auto;margin:0;padding:13px 26px;min-height:0;
  text-decoration:none;text-align:center}
.hero-cta .lnk{font-size:14px;font-weight:600;color:var(--ink-2);text-decoration:none}
.hero-cta .lnk:hover{color:var(--coral-deep)}

.hero-cta .lnk.ent{color:var(--coral-deep);border-bottom:1.5px solid var(--coral);padding-bottom:1px}

.trust{display:flex;gap:0;margin:18px 0 4px;border:1px solid var(--line);
  border-radius:10px;overflow:hidden;background:var(--card)}
.trust .ti{flex:1;padding:12px 10px;text-align:center;border-right:1px solid var(--line)}
.trust .ti:last-child{border-right:0}
.trust .ti b{display:block;font-family:var(--mono);font-size:18px;color:var(--ink);line-height:1.2}
.trust .ti span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:3px}
.trust .ti span a{color:var(--coral-deep);text-decoration:underline;text-underline-offset:2px}
@media(max-width:440px){.trust .ti b{font-size:15px}.trust .ti span{font-size:10.5px}}

@media(max-width:899px){.trust{display:grid;grid-template-columns:1fr 1fr}
  .trust .ti{border-right:0;border-bottom:1px solid var(--line)}
  .trust .ti:nth-child(odd){border-right:1px solid var(--line)}
  .trust .ti:last-child{grid-column:1/-1;border-right:0;border-bottom:0}}

.who{display:flex;gap:10px;margin:12px 0 4px}
.who .who-i{flex:1;padding:11px 14px;border:1px solid var(--line);border-radius:10px;
  background:var(--card)}
.who .who-i b{display:block;font-size:13px;color:var(--ink)}
.who .who-i span{display:block;font-size:12px;color:var(--ink-3);margin-top:3px;line-height:1.55}
@media(max-width:560px){.who{flex-direction:column;gap:8px}}
.tag{
  display:inline-block;font-family:var(--mono);font-size:12px;
  border:1px solid var(--line-strong);border-radius:99px;padding:3px 12px;
  margin:0 6px 8px 0;color:var(--ink-2)
}

.sectlabel{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--coral-deep);margin-bottom:2px;
  display:flex;align-items:center;gap:7px}

.sectlabel::before{content:attr(data-n);font-weight:700;color:var(--coral);letter-spacing:.06em}
.sectlabel[data-n]::after{content:"";flex:1;height:1px;background:var(--line);margin-left:6px}

.cmp{width:100%;border-collapse:separate;border-spacing:0;margin:14px 0 4px;font-size:14px}
.cmp th,.cmp td{padding:11px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);line-height:1.6}
.cmp thead th{font-size:13px;color:var(--ink-3);font-weight:600;border-bottom:1px solid var(--line-strong)}
.cmp thead th.us{color:var(--coral-deep)}
.cmp tbody th{font-weight:700;color:var(--ink);white-space:nowrap;width:1%}
.cmp td{color:var(--ink-2)}
.cmp td.us{background:color-mix(in srgb,var(--coral) 8%,transparent);color:var(--ink);font-weight:600}
.cmp thead th.us{background:color-mix(in srgb,var(--coral) 8%,transparent);border-radius:10px 10px 0 0}
.cmp tbody tr:last-child td.us{border-radius:0 0 10px 10px}
.cmp .mk{display:inline-block;width:1.3em;font-weight:700}
.cmp .ok .mk{color:var(--ok)}
.cmp .bad .mk{color:var(--warn)}
.cmp .mid .mk{color:var(--ink-3)}
.cmp-note{font-size:13px;color:var(--ink-3);margin:8px 0 0}
@media(max-width:639px){
  .cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block;width:auto}
  .cmp thead{display:none}
  .cmp tbody tr{border:1px solid var(--line);border-radius:12px;margin:0 0 10px;overflow:hidden}
  .cmp tbody th{background:var(--paper);border-bottom:1px solid var(--line);white-space:normal;width:auto;padding:8px 12px}
  .cmp td{padding:8px 12px}
  .cmp td::before{content:attr(data-l);display:block;font-size:12px;color:var(--ink-3);font-weight:600}
  .cmp td.us::before{color:var(--coral-deep)}
  .cmp tbody tr td:last-child{border-bottom:0}
  .cmp tbody tr:last-child td.us{border-radius:0}
}

.pcards{display:grid;grid-template-columns:1fr;gap:14px;margin:14px 0}
@media(min-width:560px){.pcards{grid-template-columns:1fr 1fr}}
.pcard{border:1px solid var(--line-strong);border-radius:12px;padding:20px 18px;
  background:var(--paper);position:relative;display:flex;flex-direction:column}
.pcard.pwide{grid-column:1/-1}
.pcard.feat{border:2px solid var(--coral);background:var(--card)}
.pcard .badge{position:absolute;top:-11px;right:16px;background:var(--coral);
  color:#fff;font-family:var(--mono);font-size:11px;font-weight:700;
  padding:2px 10px;border-radius:99px;letter-spacing:.05em}
.pcard .pname{font-size:16px;font-weight:700;color:var(--ink)}
.pcard .pmult{font-family:var(--mono);font-size:13px;color:var(--ink-3);margin-top:2px}
.pcard .pprice{font-family:var(--mono);font-weight:700;font-size:30px;color:var(--ink);
  margin:12px 0 2px;letter-spacing:-.01em}
.pcard .pprice small{font-size:14px;font-weight:400;color:var(--ink-3)}
.pcard .pfeat{font-size:13px;color:var(--ink-2);margin-top:8px;line-height:1.7}
details{border-bottom:1px dashed var(--line);padding:12px 0}
details summary{
  font-weight:600;cursor:pointer;list-style:none;display:flex;gap:10px
}
details summary::before{content:"+";font-family:var(--mono);color:var(--coral);font-weight:700}
details[open] summary::before{content:"−"}
details p{margin-top:8px;font-size:14.5px}
.cta-row{margin:22px 0}
#get-code h3{margin-top:18px}
.check{padding-left:2px;margin:10px 0}
.check li{list-style:none;margin:9px 0;color:var(--ink-2);display:flex;gap:9px}
.check li::before{content:"✓";color:var(--ok);font-weight:700;font-family:var(--mono)}
.no{color:var(--ink-3)}
.no::before{content:"✕" !important;color:var(--warn) !important}
.perks{display:grid;grid-template-columns:1fr;gap:12px;margin-top:14px}
@media(min-width:560px){.perks{grid-template-columns:1fr 1fr}}
.perk{border:1px solid var(--line);border-radius:10px;padding:16px;background:var(--paper);
  transition:border-color .15s,transform .15s}
.perk:hover{border-color:var(--coral);transform:translateY(-2px)}
.perk .ic{display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:9px;font-size:19px;margin-bottom:8px;
  background:var(--card);border:1px solid var(--line)}
.perk b{display:block;font-size:15px;margin-bottom:5px}
.perk span{font-size:13.5px;color:var(--ink-2);line-height:1.65}
@media(min-width:560px){.perk-wide{grid-column:1/-1}}
.gallery{display:flex;gap:10px;overflow-x:auto;padding:10px 2px 6px;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.gallery .gimg{flex:0 0 auto;scroll-snap-align:start;padding:0;border:0;
  background:none;cursor:zoom-in;display:block}
.gallery img{height:220px;width:auto;border:1px solid var(--line-strong);
  border-radius:8px;display:block;background:#000;transition:transform .15s}
.gallery .gimg:hover img{transform:translateY(-2px);border-color:var(--coral)}
.galtip{font-size:12px;color:var(--ink-3);display:flex;align-items:center;gap:6px}
.community-entry{display:inline-flex;margin-top:12px;font-size:13.5px;font-weight:700;
  color:var(--coral-deep);text-decoration:none;align-items:center;gap:5px}
.community-entry:hover{text-decoration:underline}

@media(max-width:560px){
  .perk-wide{min-width:0}
  .gallery{gap:12px;padding:12px 0 8px}
  .gallery .gimg{width:calc(100vw - 96px);scroll-snap-align:start}
  .gallery img{width:100%;height:auto;border-radius:10px}
  .galtip{justify-content:center;font-size:12.5px;margin-top:6px}
}
.lb{position:fixed;inset:0;z-index:99;display:flex;
  background:rgba(0,0,0,.92);align-items:center;justify-content:center;
  visibility:hidden;opacity:0;transition:opacity .24s ease,visibility .24s ease}
.lb.on{visibility:visible;opacity:1}

.lb-track{display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.lb-track::-webkit-scrollbar{display:none}
.lb-slide{flex:0 0 100%;height:100%;display:flex;align-items:center;
  justify-content:center;scroll-snap-align:center;scroll-snap-stop:always;padding:16px}
.lb-slide img{max-width:92vw;max-height:84vh;width:auto;height:auto;border-radius:10px;
  box-shadow:0 10px 44px rgba(0,0,0,.6)}
.lb-close{position:absolute;top:14px;right:18px;font-size:32px;line-height:1;z-index:2;
  color:#fff;background:rgba(0,0,0,.35);border:0;cursor:pointer;width:44px;height:44px;
  border-radius:50%;padding:0;display:flex;align-items:center;justify-content:center}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);font-size:30px;z-index:2;
  color:#fff;background:rgba(0,0,0,.35);border:0;cursor:pointer;width:46px;height:46px;
  border-radius:50%;padding:0;display:flex;align-items:center;justify-content:center;
  opacity:.85;transition:opacity .15s,background .15s}
.lb-nav:hover{opacity:1;background:rgba(0,0,0,.55)}
.lb-prev{left:10px}
.lb-next{right:10px}
.lb-dots{position:absolute;bottom:18px;left:0;right:0;display:flex;gap:8px;
  justify-content:center;pointer-events:none;z-index:2}
.lb-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.35);
  transition:background .2s,transform .2s}
.lb-dot.on{background:#fff;transform:scale(1.35)}
@media(max-width:520px){
  .lb-nav{display:none}
  .lb-slide img{max-width:100vw;max-height:82vh}
}

.wxlink{display:inline;padding:0;border:0;background:none;cursor:pointer;
  font:inherit;color:var(--coral-deep);font-weight:700;text-decoration:underline}

.wxcard{background:var(--card);border-radius:14px;padding:22px 24px;text-align:center;
  box-shadow:0 8px 40px rgba(0,0,0,.4)}
.wxcard img{border:1px solid var(--line-strong);border-radius:10px;display:block;margin:0 auto}
.wxcard .wxtip{margin-top:12px;font-size:14px;color:var(--ink-2)}
.wxcard .wxtip b{color:var(--coral-deep)}

@media(min-width:900px){
  .hero{display:grid;grid-template-columns:1.55fr .95fr;gap:48px;
    align-items:center;padding:52px 0 28px}
  .hero h1{font-size:clamp(40px,5.2vw,52px);margin-bottom:18px}
  .hero .sub{font-size:17.5px}
  .hero-cta{margin-bottom:0}
  .trust{flex-direction:column;margin:0}
  .trust .ti{border-right:0;border-bottom:1px solid var(--line);
    text-align:left;padding:14px 18px}
  .trust .ti:last-child{border-bottom:0}
  .trust .ti b{font-size:22px}
  .trust .ti span{font-size:12.5px}
  
  .who{grid-column:1/-1;margin-top:6px}
  
  .why-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:36px;align-items:start}
  .why-grid .check{margin-top:0}
  
  .perks{grid-template-columns:repeat(4,1fr)}
  .perk-wide{grid-column:1/-1}
  
  .selfcheck{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .selfcheck .ck{margin:0}
  
  .card .btn{max-width:460px;margin-left:auto;margin-right:auto}
  
  .faqgrid{column-count:2;column-gap:36px}
  .faqgrid details{break-inside:avoid}
}

.net-diagram svg{width:100%;height:auto;display:block;margin-top:10px}

.card.dark{--paper:#15130f;--card:#221f1a;--ink:#f1ece3;--ink-2:#b5ada0;--ink-3:#857d71;
  --line:#2e2a24;--line-strong:#4d463a;--coral:#e58a68;--coral-deep:#f0a383;
  background:var(--paper);border-color:var(--line);color:var(--ink);
  box-shadow:0 24px 60px -36px rgba(0,0,0,.55)}
.card.dark h2{color:var(--ink)}
.card.dark p{color:var(--ink-2)}
@media (prefers-color-scheme:dark){.card.dark{--paper:#0d0c0a;--card:#1a1815;--line:#26221c}}

.progress{position:fixed;top:0;left:0;width:100%;height:3px;background:var(--coral);
  transform-origin:0 50%;transform:scaleX(0);z-index:60;pointer-events:none;display:none}
.anim .progress{display:block}
.anim .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.anim .reveal.in{opacity:1;transform:none}

.anim .net-diagram .laid{stroke-dasharray:var(--len,2000) var(--gap,2004);stroke-dashoffset:var(--off,2002);
  transition:stroke-dashoffset .8s cubic-bezier(.4,0,.2,1)}
.anim .net-diagram [data-node]{opacity:.2;transition:opacity .7s ease}
.anim .net-diagram .beads{opacity:0;transition:opacity .6s ease}
.anim .net-diagram.lit .laid{stroke-dashoffset:0}
.anim .net-diagram.lit [data-node]{opacity:1}
.anim .net-diagram.lit .laid[data-s="1"]{transition-delay:.25s}
.anim .net-diagram.lit [data-node="1"]{transition-delay:.9s}
.anim .net-diagram.lit .laid[data-s="2"]{transition-delay:1.1s}
.anim .net-diagram.lit [data-node="2"]{transition-delay:1.75s}
.anim .net-diagram.lit .laid[data-s="3"]{transition-delay:1.95s}
.anim .net-diagram.lit .laid[data-s="4"]{transition-delay:2.6s}
.anim .net-diagram.lit [data-node="3"]{transition-delay:3s}
.anim .net-diagram.lit .beads{opacity:1;transition-delay:3.5s}
.net-diagram .node-claude .node{transition:stroke .6s ease 3.1s}
.net-diagram.lit .node-claude .node{stroke:var(--coral);stroke-width:1.6}
@media (prefers-reduced-motion:reduce){
  .anim .reveal,.anim .net-diagram [data-node],.anim .net-diagram .beads{opacity:1;transform:none;transition:none}
  .anim .net-diagram .laid{stroke-dasharray:none;stroke-dashoffset:0;transition:none}
}

.ent-grid{display:grid;grid-template-columns:1fr;gap:12px;margin:14px 0 4px}
@media(min-width:720px){.ent-grid{grid-template-columns:repeat(3,1fr)}}
.ent-i{border:1px solid var(--line);border-radius:10px;padding:16px;background:var(--paper)}
.ent-i i{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--coral-deep);display:block;margin-bottom:6px;letter-spacing:.04em}
.ent-i b{display:block;font-size:15px;margin-bottom:5px;color:var(--ink)}
.ent-i span{font-size:13.5px;color:var(--ink-2);line-height:1.65}
.ent-cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:18px 0 4px}
.ent-cta .btn{width:auto;margin:0;padding:12px 24px;min-height:0;text-decoration:none;text-align:center}
.ent-cta .lnk{font-size:14px;font-weight:600;color:var(--ink-2);text-decoration:none}
.ent-cta .lnk:hover{color:var(--coral-deep)}
.ent-cta .wxlink{font-size:14px}