.fg{--bg:#f3f6fa;--surface:#fff;--ink:#0f1b2d;--muted:#52627a;--line:#d8e0ec;--glow:#1f6bff;--glow-soft:#1f6bff22;--btn-ink:#fff;background:var(--bg);color:var(--ink);line-height:1.6;font-family:inherit;box-sizing:border-box;
& *{box-sizing:border-box}
.wrap{max-width:1100px;margin:0 auto;padding:0 1.25rem 3rem}
.product{display:grid;grid-template-columns:1.1fr 1fr;gap:2.5rem;align-items:start;padding-top:1.5rem}
@media(max-width:800px){.product{grid-template-columns:1fr}}
.stage{aspect-ratio:1/1;border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 55%,var(--glow-soft),transparent 60%),var(--surface);border:1px solid var(--line);display:grid;place-items:center;text-align:center;color:var(--muted);box-shadow:0 0 60px var(--glow-soft)}
.stage img{width:100%;height:100%;object-fit:cover;display:block}
.thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem;margin-top:.6rem}
.thumbs button{aspect-ratio:1/1;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:0;overflow:hidden;cursor:pointer}
.thumbs img{width:100%;height:100%;object-fit:cover;display:block}
& h1{font-size:clamp(1.7rem,4vw,2.4rem);line-height:1.15;margin:.2rem 0 .5rem;font-weight:800;color:var(--ink)}
.rating{color:var(--muted);font-size:.9rem}
.price{font-size:1.9rem;font-weight:800;margin:.8rem 0 0}
.tax{font-size:.8rem;color:var(--muted);margin:0 0 1rem}
.tag{font-style:normal;font-size:.8rem;font-weight:800;color:var(--btn-ink);background:var(--glow);border-radius:999px;padding:.2rem .7rem;vertical-align:middle;margin-left:.4rem}
.tag[hidden]{display:none}
& ul.usp{list-style:none;padding:0;margin:0 0 1.2rem}
& ul.usp li{padding:.3rem 0 .3rem 1.6rem;position:relative}
& ul.usp li:before{content:"";position:absolute;left:0;top:.8rem;width:.75rem;height:.75rem;border-radius:50%;background:var(--glow);box-shadow:0 0 10px var(--glow)}
& fieldset{border:0;padding:0;margin:0 0 1rem;min-width:0}
& legend{font-weight:700;margin-bottom:.5rem;padding:0}
.sw{display:flex;gap:.6rem;flex-wrap:wrap}
.sw label{cursor:pointer}
.sw input{position:absolute;opacity:0}
.sw span{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .9rem;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);font-weight:500}
.sw i{width:.9rem;height:.9rem;border-radius:50%;display:inline-block}
.sw input:checked+span{border-color:var(--glow);box-shadow:0 0 0 3px var(--glow-soft)}
.sw input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
.sw input:disabled+span{opacity:.5;cursor:not-allowed}
.row{display:flex;gap:.75rem;margin:1rem 0 .6rem}
.bun{display:grid;gap:.6rem}
.bun label{cursor:pointer}
.bun input{position:absolute;opacity:0}
.bun span{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.8rem 1rem;border:1.5px solid var(--line);border-radius:12px;background:var(--surface)}
.bun em{font-style:normal;font-size:.8rem;font-weight:700;color:var(--btn-ink);background:var(--glow);border-radius:999px;padding:.15rem .6rem;margin-left:.5rem}
.bun em[hidden]{display:none}
.bun input:checked+span{border-color:var(--glow);box-shadow:0 0 0 3px var(--glow-soft)}
.bun input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
.cta{flex:1;border:2px solid var(--glow);border-radius:12px;background:linear-gradient(var(--glow),var(--glow)) center/100% 100% no-repeat;color:var(--btn-ink);font:inherit;font-weight:800;padding:.85rem 1rem;cursor:pointer;box-shadow:0 6px 24px var(--glow-soft);transition:background-size .4s ease,color .4s ease}
@media(hover:hover){.cta:hover:not(:disabled){background-size:0 100%;color:var(--glow)}}
@media(prefers-reduced-motion:reduce){.cta{transition:none}}
.cta:disabled{opacity:.5;cursor:not-allowed}
.cta:focus-visible,.tnav button:focus-visible,.thumbs button:focus-visible,& summary:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.trust{display:flex;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:var(--muted)}
.note{font-size:.8rem;color:var(--muted);border-left:3px solid var(--glow);padding-left:.75rem;margin-top:1rem}
& section{margin-top:3.5rem}
& h2{font-size:clamp(1.4rem,3vw,1.9rem);margin:0 0 1rem;font-weight:800;color:var(--ink)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:1.2rem}
#hw h2{text-align:center;margin:.4rem 0 2rem}
.hw{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:900px;margin:0 auto}
.hw>div{text-align:center;position:relative}
.ic{position:relative;width:4.4rem;height:4.4rem;margin:0 auto .9rem;border-radius:50%;background:#0f1b2d;color:#e8b98a;display:grid;place-items:center}
.ic svg{width:1.6rem;height:1.6rem}
.ic i{position:absolute;top:-.2rem;right:-.3rem;width:1.5rem;height:1.5rem;border-radius:50%;background:#b07c4f;color:#fff;font-style:normal;font-size:.75rem;font-weight:800;display:grid;place-items:center}
.hw>div:not(:last-child):after{content:"";position:absolute;top:2.2rem;left:calc(50% + 2.6rem);width:calc(100% - 4.2rem);border-top:2px dashed var(--line)}
.hw h3{margin:0 0 .3rem}
.hw p{margin:0;color:var(--muted);font-size:.95rem}
@media(max-width:700px){.hw{grid-template-columns:1fr;gap:1.6rem}.hw>div:not(:last-child):after{display:none}}
.media{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
@media(max-width:800px){.media{grid-template-columns:1fr}}
.media div{aspect-ratio:9/12;border:1px dashed var(--line);border-radius:14px;display:grid;place-items:center;text-align:center;padding:1rem;color:var(--muted);font-size:.9rem;background:var(--surface)}
& details{border-bottom:1px solid var(--line);padding:.9rem 0}
& summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:1rem}
& summary::-webkit-details-marker{display:none}
& summary::after{content:"+";color:var(--glow);font-size:1.3rem;line-height:1}
& details[open] summary::after{content:"−"}
& details p{margin:.6rem 0 0;color:var(--muted)}
.empty{text-align:center;color:var(--muted)}
.eyebrow2{text-align:center;color:#b07c4f;letter-spacing:.18em;font-size:.8rem;font-weight:800;text-transform:uppercase}
#tsec h2{text-align:center;margin:.4rem 0 1.5rem}
#tsec[hidden]{display:none}
.tcard{display:grid;grid-template-columns:1fr 1fr;background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden}
@media(max-width:800px){.tcard{grid-template-columns:1fr}}
.timg{position:relative;min-height:340px;background:var(--glow-soft);display:grid;place-items:center;color:var(--muted);text-align:center;padding:1rem}
.timg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tbody{padding:2rem;display:flex;flex-direction:column;justify-content:center;gap:.6rem}
.tbody .st{color:#b07c4f}
.tbody h3{margin:0;font-size:1.6rem}
.tbody p{margin:0;font-size:1.05rem}
.tbody small{font-weight:800}
.tnav{display:flex;justify-content:center;gap:.8rem;margin-top:1rem}
.tnav button{width:2.6rem;height:2.6rem;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-size:1.2rem;cursor:pointer;padding:0}
.cta2{background:#0f1b2d;color:#fff;text-align:center;padding:3.5rem 1.25rem;margin-top:3.5rem}
.eyebrow{color:#e8b98a;letter-spacing:.18em;font-size:.8rem;font-weight:800;text-transform:uppercase}
.cta2 h2{color:#fff;margin:.6rem 0 1.6rem}
.facts{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;max-width:1000px;margin:0 auto 1.8rem}
.facts div{flex:1 1 190px;max-width:240px;border:1px solid #2a3a58;border-radius:16px;padding:1.1rem .8rem}
.facts [hidden]{display:none}
.facts b{display:block;color:#e8b98a;font-size:1.25rem}
.facts span{color:#d5deee;font-size:.9rem}
.cta2 a.btn{display:inline-block;background:#fff;color:#0f1b2d;font-weight:800;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-radius:999px;padding:1rem 2.4rem}
.cta2 a.btn:focus-visible{outline:2px solid #e8b98a;outline-offset:3px}
.cta2 p{color:#d5deee;font-size:.9rem;margin:1rem 0 0}
.rsum{display:flex;gap:1.2rem;align-items:center;padding-bottom:1.5rem;margin-bottom:1.5rem;border-bottom:1px solid var(--line)}
.big{font-size:4rem;font-weight:800;line-height:1}
.st{color:#f5a623;letter-spacing:.1em}
.rsum .st{font-size:1.4rem}
.rsum small{color:var(--muted);font-size:.95rem}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
@media(max-width:900px){.rgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.rgrid{grid-template-columns:1fr}}
.rev{display:flex;flex-direction:column;gap:.7rem;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:1.2rem}
.rev .st{font-size:.9rem}
.rh{display:flex;gap:.8rem;align-items:center}
.av{flex:none;width:2.8rem;height:2.8rem;border-radius:50%;background:#0f1b2d;color:#fff;display:grid;place-items:center;font-weight:800}
.av.b{background:#b07c4f}
.rn b{display:block}
.rn span{font-size:.8rem;color:var(--muted)}
.rev p{margin:0}
.vf{color:#2e9d57;font-size:.8rem;margin-top:auto;display:flex;align-items:center;gap:.35rem}
.vf:before{content:"✓";display:inline-grid;place-items:center;width:.95rem;height:.95rem;border-radius:50%;background:#2e9d57;color:#fff;font-size:.6rem}
.more{display:block;margin:1rem auto 0;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-weight:700;border-radius:12px;padding:.7rem 1.2rem;cursor:pointer}
.table{width:100%;border-collapse:collapse}
.table td{padding:.55rem 0;border-bottom:1px solid var(--line)}
.table td:first-child{color:var(--muted);width:45%}
}
.fg[data-glow="rot"]{--glow:#e5384f;--glow-soft:#e5384f22}
.fg[data-glow="gruen"]{--glow:#12a150;--glow-soft:#12a15022}