*{box-sizing:border-box}
:root{color-scheme:light;--bg:#fff8ee;--surface:#fff;--fg:#3a2a55;--muted:#6f6388;--line:#f0e2e6;--accent:#ff9a76;--accent-fg:#3d1d12;--accent-text:#b53b0f;--accent-soft:#fff0e6;--hero:#ffdce8;--hero-fg:#4a2350;--hero-muted:#7a4a6e;--on:#6b4fbb;--on-fg:#fff;--ok:#1a7f4b;--err:#b3261e;--warn-bg:#fff1cf;--warn-fg:#6b4b00;--overlay:rgba(20,17,23,.6);--font-display:"Cormorant Garamond",Georgia,"Times New Roman",serif;--font-body:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;--font-mono:ui-monospace,"SFMono-Regular",Menlo,monospace}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--bg:#1f1830;--surface:#2b2240;--fg:#f8f1fa;--muted:#bdb0d0;--line:#43385e;--accent-text:#ffb59a;--accent-soft:#3d2a33;--on:#7b5fcb;--hero:#3b2766;--hero-fg:#fff;--hero-muted:#d9cdf0;--err:#ff8a80;--warn-bg:#3a2f10;--warn-fg:#f4d78a;--overlay:rgba(0,0,0,.7)}}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:16px;line-height:1.5;padding:12px 14px 132px}
img{max-width:100%}
[hidden]:not([hidden=until-found i]){display:none!important}
.wrap{max-width:560px;margin-inline:auto;display:flex;flex-direction:column;gap:40px}
h1,h2,h3,.price,.total,.count{font-family:var(--font-display);font-variant-numeric:lining-nums tabular-nums}
h2{margin:0;font-size:1.9rem;font-weight:700;line-height:1.05;letter-spacing:-.01em}

/* hero */
.hero{background:var(--hero);color:var(--hero-fg);border-radius:28px;padding:22px 20px 0;display:flex;flex-direction:column;gap:16px;margin-bottom:34px}
.brand{margin:0;font-family:var(--font-display);font-weight:700;font-size:1.5rem;letter-spacing:.02em;color:var(--hero-fg)}.brand:before{content:"\2726";color:var(--accent);margin-right:8px;font-size:1.1rem}
.hero h1{margin:0;font-size:clamp(2.25rem,10.5vw,3rem);line-height:.98;font-weight:600;letter-spacing:-.015em;text-wrap:balance}
.tag{margin:0;color:var(--hero-muted);font-size:15px;max-width:34ch}
.cta{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1.25;text-decoration:none;font-weight:700;background:var(--accent);color:var(--accent-fg);border-radius:14px;padding:15px 20px}
.cta small{font-weight:500;opacity:.8;font-size:13px}
.strip{display:grid;grid-template-columns:1fr 1.12fr 1fr;gap:8px;align-items:end;margin:6px 0 -34px}
.frame{margin:0;min-width:0}
.frame .pic{aspect-ratio:3/4;border-radius:16px;overflow:hidden;border:3px solid var(--hero);background:#222;box-shadow:0 10px 24px rgba(0,0,0,.35)}
.frame:nth-child(1){transform:rotate(-3deg) translateY(4px)}.frame:nth-child(3){transform:rotate(3deg) translateY(4px)}
.frame img,.theme .pic img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.notice{background:var(--warn-bg);color:var(--warn-fg);border-radius:12px;padding:10px 14px;font-size:14px}

/* como funciona */
.how{display:flex;flex-direction:column;gap:14px;padding:0 4px}
.how h2{font-size:1.5rem}
.next{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;counter-reset:n}
.next li{counter-increment:n;display:grid;grid-template-columns:30px 1fr;gap:12px;font-size:15px;color:var(--muted)}
.next li:before{content:counter(n);font-family:var(--font-display);font-weight:700;font-size:1.25rem;line-height:1;width:30px;height:30px;border-radius:50%;background:var(--on);color:var(--accent);display:grid;place-items:center}
.next b{color:var(--fg);font-weight:600}
.trust{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}

/* passos */
section.step{display:flex;flex-direction:column;gap:14px}
.step-head{display:flex;align-items:baseline;gap:12px}
.step-no{font-family:var(--font-display);font-weight:700;font-size:2.6rem;line-height:.8;color:var(--accent-text);min-width:.7em}
.sub{margin:-4px 0 0;color:var(--muted);font-size:14px}
.sub b{color:var(--fg)}

/* pacotes */
.options{display:flex;flex-direction:column;gap:12px}
.opt{position:relative}
.opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.opt label{display:grid;grid-template-columns:auto 1fr auto;gap:2px 16px;align-items:center;background:var(--surface);border:1.5px solid var(--line);border-radius:20px;padding:16px 18px;position:relative}
.opt input:checked+label{background:var(--on);color:var(--on-fg);border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.opt input:focus-visible+label{outline:3px solid var(--accent);outline-offset:3px}
.count{grid-row:1/span 2;font-size:3.1rem;font-weight:700;line-height:.9;color:var(--accent-text);min-width:2ch;text-align:center}
.opt input:checked+label .count{color:var(--accent)}
.count small{display:block;font-family:var(--font-body);font-size:11px;color:var(--muted);font-weight:500;margin-top:4px}
.opt input:checked+label small,.opt input:checked+label .desc{color:#cfc8d6}
.opt .name{font-weight:700;display:flex;align-items:center;gap:8px;min-width:0}
.opt .metal{display:none}
.opt .desc{grid-column:2;color:var(--muted);font-size:14px;min-width:0}
.opt .price{font-size:2rem;font-weight:700;grid-row:1/span 2;grid-column:3;line-height:1}
.opt input:checked+label .price{color:var(--accent)}
.opt .badge{position:absolute;top:-11px;right:16px;background:var(--accent);color:var(--accent-fg);font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px}

/* temas */
.groups{display:flex;flex-direction:column;gap:24px}
.group{display:flex;flex-direction:column;gap:10px}
.group-title{margin:0;font-size:1.3rem;font-weight:700;color:var(--fg);line-height:1}
.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.theme{position:relative;min-width:0}
.theme input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2}
.theme label{display:block;position:relative;border-radius:14px;overflow:hidden;background:var(--surface);border:2px solid transparent;height:100%}
.theme .pic{aspect-ratio:3/4;background:var(--line)}
.theme .tname{position:absolute;left:0;right:0;bottom:0;padding:26px 8px 8px;font-size:12.5px;line-height:1.2;font-weight:600;color:#fff;text-align:left;background:linear-gradient(to top,rgba(0,0,0,.78),transparent);overflow-wrap:anywhere}
.theme .tdesc{display:none}
.theme .pic.plus{display:grid;place-items:center;aspect-ratio:auto;min-height:100%;color:var(--accent-text);font-family:var(--font-display);font-size:3rem;line-height:1;padding:18px 0}
.theme:has(.plus){grid-column:1/-1}
.theme:has(.plus) label{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 14px;padding:12px 16px;border:1.5px dashed var(--line)}
.theme:has(.plus) .pic{padding:0}
.theme:has(.plus) .pic{background:none}
.theme:has(.plus) .tname{position:static;background:none;color:var(--fg);padding:0;font-size:15px}
.theme:has(.plus) .tdesc{display:block;grid-column:2;font-size:13px;color:var(--muted);line-height:1.35}
.theme input:checked+label{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.theme:has(.plus) input:checked+label{background:var(--accent-soft)}
.theme input:focus-visible+label{outline:3px solid var(--accent);outline-offset:2px}
.theme input:disabled+label{opacity:.4}
.theme input:disabled{cursor:not-allowed}
.theme .tick{position:absolute;top:7px;right:7px;width:24px;height:24px;border-radius:50%;background:var(--accent);color:var(--accent-fg);font-size:13px;font-weight:800;display:none;place-items:center;z-index:1;pointer-events:none}
.theme input:checked~.tick{display:grid}

/* entrega */
.dopts{display:grid;gap:10px}
.dopt{position:relative}
.dopt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.dopt label{display:grid;grid-template-columns:auto 1fr auto;column-gap:14px;row-gap:2px;align-items:center;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;padding:15px 18px}
.dopt .dot{grid-row:1/span 2;width:22px;height:22px;border-radius:50%;border:2px solid var(--line)}
.dopt .name{grid-column:2;font-weight:700}
.dopt .desc{grid-column:2;color:var(--muted);font-size:14px}
.dopt .fee{grid-column:3;grid-row:1/span 2;font-family:var(--font-display);font-weight:700;font-size:1.45rem;color:var(--accent-text);line-height:1}
.dopt input:checked+label{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background:var(--accent-soft)}
.dopt input:checked+label .dot{border-color:var(--accent);background:radial-gradient(circle,var(--accent) 0 42%,transparent 47%)}
.dopt input:focus-visible+label{outline:3px solid var(--accent);outline-offset:3px}

/* dados */
.fields{display:flex;flex-direction:column;gap:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:14px;font-weight:600}
.field .opt-tag{color:var(--muted);font-weight:400}
.field input[type=text],.field input[type=tel]{font:inherit;color:var(--fg);background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:15px 16px;width:100%;min-width:0;min-height:52px}
.field input:focus-visible{outline:3px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.field input[aria-invalid=true]{border-color:var(--err)}
.field .help{font-size:13px;color:var(--muted);margin:0}.field .help.err{color:var(--err)}

/* resumo */
.summary{background:var(--surface);border:1.5px solid var(--on);border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:10px}
.row{display:flex;justify-content:space-between;gap:16px;font-variant-numeric:tabular-nums}
.row span:first-child{color:var(--muted);min-width:0}.row span:last-child{text-align:right}
.row.sum{border-top:1.5px dashed var(--line);padding-top:12px;align-items:baseline}
.row.sum span:first-child{color:var(--fg);font-weight:700}
.row.sum span:last-child{font-family:var(--font-display);font-weight:700;font-size:1.9rem;line-height:1}
.hours-note{margin:12px 2px 0;font-size:13px;color:var(--muted);text-align:center}
.px-note{margin:-12px 2px 0;font-size:12px;text-align:center;color:var(--muted)}

/* barra fixa */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:10;background:var(--on);color:#fff;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
.bar-in{max-width:560px;margin-inline:auto;display:flex;align-items:center;gap:16px}
.bar-total{display:flex;flex-direction:column;min-width:0;flex:1}
.bar-total small{font-size:12px;color:#c4bccb;line-height:1.3}
.bar .total{font-size:2.1rem;font-weight:700;line-height:1;color:var(--accent)}
.btn{font:inherit;font-weight:700;border:0;border-radius:14px;padding:15px 22px;cursor:pointer;background:var(--accent);color:var(--accent-fg);text-align:center;text-decoration:none;display:block}
.btn.block{width:100%}
.btn.ghost{background:transparent;color:var(--fg);border:1.5px solid var(--line)}
.btn:focus-visible,.cta:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.btn[aria-disabled=true]{opacity:.5}

/* janela do pix */
.sheet-bg{position:fixed;inset:0;z-index:20;background:var(--overlay);display:flex;align-items:flex-end;justify-content:center}
.sheet{background:var(--surface);width:100%;max-width:560px;max-height:92%;overflow-y:auto;border-radius:28px 28px 0 0;padding:22px 20px calc(22px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:16px}
.sheet-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.sheet h3{margin:0;font-size:2rem;font-weight:700;line-height:1}
.sheet .amount{font-weight:600;color:var(--accent-text);font-size:15px}
.x{font:inherit;background:var(--bg);color:var(--fg);border:0;border-radius:50%;width:40px;height:40px;cursor:pointer;flex:none;font-size:18px;line-height:1}
.x:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.qr{align-self:center;background:#fff;padding:12px;border-radius:16px;line-height:0;border:1px solid var(--line)}
.qr svg{display:block;width:200px;height:200px;max-width:100%}
.code{font-family:var(--font-mono);font-size:12px;word-break:break-all;background:var(--bg);border-radius:10px;padding:10px 12px;user-select:all;max-height:5.5em;overflow:auto;color:var(--muted)}
.hint{font-size:14px;color:var(--muted);margin:0}.hint b{color:var(--fg)}
.after{font-size:13px;color:var(--muted);margin:0;text-align:center}
.order-id{font-family:var(--font-mono);color:var(--fg)}
.stp{display:flex;flex-direction:column;gap:12px;padding-top:16px;border-top:1px dashed var(--line)}
.stp-t{margin:0;display:flex;align-items:center;gap:10px;font-weight:700}
.stp-t span{width:26px;height:26px;border-radius:50%;background:var(--on);color:var(--accent);font-family:var(--font-display);font-size:1.1rem;display:grid;place-items:center;flex:none}
.stp.locked{opacity:.38}
.resume{margin:0;background:var(--accent-soft);border:1px solid var(--accent);border-radius:12px;padding:10px 14px;font-size:14px;font-weight:500}
@media(prefers-reduced-motion:no-preference){.sheet{animation:up .25s ease-out}@keyframes up{0%{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}}

.hero{position:relative}
.lang{position:absolute;top:18px;right:16px;display:flex;gap:8px}
.flag{width:38px;height:28px;padding:0;border:2px solid transparent;border-radius:7px;overflow:hidden;background:none;cursor:pointer;opacity:.65;line-height:0}
.flag svg{width:100%;height:100%;display:block;border-radius:4px}
.flag[aria-pressed=true]{border-color:var(--accent);opacity:1}
.flag:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;margin:18px 0 12px}.or:before,.or:after{content:"";flex:1;height:1px;background:var(--line)}
.btn.stripe{background:#635bff;color:#fff;margin-bottom:10px}

/* refinamento: cores e tipografia */
:root{--hero-bg:linear-gradient(155deg,#ffd9e6 0%,#ffe6d2 55%,#eadcff 100%);--hero-dots:radial-gradient(circle at 90% 10%,rgba(255,255,255,.7) 0 36px,transparent 37px),radial-gradient(circle at 4% 64%,rgba(255,154,118,.30) 0 64px,transparent 65px)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--hero-bg:linear-gradient(155deg,#3b2766,#4a2a66 60%,#5a2f5e);--hero-dots:none}}
.wrap{gap:36px}
.hero{background:var(--hero-dots),var(--hero-bg);padding:22px 20px 0;gap:14px}
.hero h1{font-size:clamp(2rem,9.2vw,2.55rem);line-height:1.05;letter-spacing:-.01em;max-width:18ch;text-wrap:balance}
.tag{font-size:15.5px;line-height:1.5;max-width:32ch}
.cta{box-shadow:0 8px 18px -8px rgba(0,0,0,.28)}
.how h2{font-size:1.45rem}
.step-head{align-items:center;gap:10px}
.step-no{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;min-width:0;border-radius:50%;background:var(--on);color:#fff;font-family:var(--font-body);font-size:15px;font-weight:700;line-height:1}
.step h2{font-size:1.65rem;line-height:1.1}
.group-title{display:flex;align-items:center;gap:8px;font-size:1.2rem}
.group-title:before{content:"";width:12px;height:12px;border-radius:50%;background:#ff9fbd}
.group:nth-child(2) .group-title:before{background:#b9a2f0}
.group:nth-child(3) .group-title:before{background:#ffc78f}
.opt .price{font-size:1.75rem}
.opt label{border-radius:22px}
.next li{line-height:1.45}
.next li b{color:var(--fg)}
.summary{border-color:var(--line);box-shadow:0 10px 26px -16px rgba(60,50,110,.35)}
