@font-face { font-family: "KM Caveat"; src: url("fonts/caveat-latin-variable.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
:root { --ink:#0c0d0d; --ink-soft:#282a28; --paper:#f3f0ea; --paper-2:#e8e3dc; --white:#fffefb; --signal:#654aad; --signal-dark:#4e338d; --line:rgba(12,13,13,.15); --muted:#6d6b66; --shadow:0 24px 70px rgba(25,24,21,.11); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:16px; line-height:1.65; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button { font:inherit; }
:focus-visible { outline:3px solid rgba(101,74,173,.45); outline-offset:3px; }
.research-banner { position:relative; z-index:30; padding:.62rem 1rem; color:#fff; background:var(--signal); text-align:center; font-size:.76rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.site-header { position:sticky; top:0; z-index:20; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(12,13,13,.94); color:#fff; backdrop-filter:blur(18px); }
.nav { width:min(1180px,calc(100% - 2.5rem)); min-height:76px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.brand { position:relative; display:inline-flex; align-items:flex-start; padding:.12rem .06rem .48rem; color:#fff; font-size:1.72rem; font-weight:900; letter-spacing:-.075em; line-height:.94; white-space:nowrap; }
.brand::after { content:""; position:absolute; left:0; right:0; bottom:.12rem; height:2px; border-radius:999px; background:currentColor; opacity:.92; }
.brand small { margin-left:.28rem; transform:translateY(-.12rem); font-size:.42em; font-weight:800; letter-spacing:0; line-height:1; }
.nav-links { display:flex; align-items:center; gap:1.8rem; }
.nav-links a { color:rgba(255,255,255,.72); font-size:.84rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; }
.nav-links a:hover { color:#fff; }
.nav-cta { padding:.72rem 1rem; border:1px solid rgba(255,255,255,.25); border-radius:999px; color:#fff!important; }
.menu-button { display:none; width:44px; height:44px; border:1px solid rgba(255,255,255,.2); border-radius:50%; background:transparent; color:#fff; cursor:pointer; }
.product-shell { width:min(1180px,calc(100% - 2.5rem)); margin:0 auto; padding:2.2rem 0 7rem; }
.breadcrumb { display:flex; align-items:center; gap:.5rem; margin:0 0 2rem; color:var(--muted); font-size:.8rem; font-weight:750; letter-spacing:.04em; }
.breadcrumb a { color:var(--signal-dark); }
.product-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:5rem; align-items:center; }
.product-media { overflow:hidden; border:1px solid var(--line); border-radius:1.6rem; background:var(--paper-2); box-shadow:var(--shadow); }
.product-media img { width:100%; aspect-ratio:1; object-fit:cover; }
.eyebrow { display:inline-flex; align-items:center; gap:.75rem; margin:0 0 1rem; color:var(--signal); font-size:.78rem; font-weight:850; letter-spacing:.16em; text-transform:uppercase; }
.eyebrow::before { content:""; width:30px; height:1px; background:currentColor; }
.product-copy h1 { margin:0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(3.2rem,7vw,6.4rem); font-weight:400; letter-spacing:-.065em; line-height:.9; }
.product-format { margin:1.25rem 0 0; color:var(--muted); font-weight:750; }
.product-price { display:block; margin:1.35rem 0 0; color:var(--signal-dark); font-size:clamp(2rem,4vw,3.2rem); font-weight:900; line-height:1; }
.availability { margin:1rem 0 0; padding:1rem 1.1rem; border-left:3px solid var(--signal); background:rgba(101,74,173,.08); color:var(--ink-soft); }
.actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem; }
.button { display:inline-flex; min-height:50px; align-items:center; justify-content:center; padding:.78rem 1.35rem; border:1px solid transparent; border-radius:999px; background:var(--signal); color:#fff; font-weight:800; cursor:pointer; }
.button:hover { background:var(--signal-dark); }
.button.secondary { border-color:var(--line); background:transparent; color:var(--ink); }
.detail-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr); gap:4rem; align-items:start; margin-top:6rem; }
.detail-copy h2 { margin:0 0 1rem; font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.2rem,4vw,3.6rem); font-weight:400; letter-spacing:-.045em; line-height:1.05; }
.detail-copy h3 { margin:2rem 0 .55rem; font-size:1.05rem; letter-spacing:-.01em; }
.detail-copy p { margin:.6rem 0; color:var(--ink-soft); }
.research-list { margin:.7rem 0 0; padding-left:1.2rem; color:var(--ink-soft); }
.research-list li { margin:.38rem 0; }
.spec-card { position:sticky; top:115px; padding:1.5rem; border:1px solid var(--line); border-radius:1.2rem; background:var(--white); box-shadow:var(--shadow); }
.spec-card h2 { margin:0 0 1rem; font-size:.78rem; letter-spacing:.13em; text-transform:uppercase; }
.spec-row { display:grid; grid-template-columns:.8fr 1.2fr; gap:1rem; padding:.8rem 0; border-top:1px solid var(--line); }
.spec-row span:first-child { color:var(--muted); font-size:.78rem; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }
.spec-row span:last-child { text-align:right; font-weight:750; }
.warning { margin-top:5rem; padding:1.6rem 1.8rem; border-radius:1.2rem; background:var(--ink); color:#fff; }
.warning strong { display:block; margin-bottom:.45rem; color:#fff; font-size:.78rem; letter-spacing:.13em; text-transform:uppercase; }
.warning p { margin:0; color:rgba(255,255,255,.65); }
.footer { padding:4.5rem 0 1.5rem; background:#070808; color:#fff; }
.footer-inner { width:min(1180px,calc(100% - 2.5rem)); margin:0 auto; }
.footer-top { display:grid; grid-template-columns:1.3fr .7fr .7fr; gap:4rem; padding-bottom:3rem; }
.footer-brand { max-width:410px; }
.footer-brand .brand { margin-bottom:1rem; }
.footer p { color:rgba(255,255,255,.5); }
.footer h3 { margin:.2rem 0 1rem; font-size:.78rem; letter-spacing:.13em; text-transform:uppercase; }
.footer-links { display:grid; gap:.65rem; }
.footer-links button,.footer-links a { padding:0; border:0; background:transparent; color:rgba(255,255,255,.62); text-align:left; cursor:pointer; }
.footer-links button:hover,.footer-links a:hover { color:#fff; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding-top:1.3rem; border-top:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.38); font-size:.75rem; }
[hidden] { display:none!important; }
body:has(dialog[open]) { overflow:hidden; }
dialog::backdrop { background:rgba(12,13,13,.8); backdrop-filter:blur(6px); }
dialog.modal { inset:0; width:min(720px,calc(100% - 2rem)); height:fit-content; max-height:90dvh; margin:auto; padding:0; border:0; background:transparent; overflow:auto; }
dialog.modal[open] { display:block; }
.modal-card { width:100%; padding:2rem; border-radius:1.4rem; background:var(--white); box-shadow:0 30px 100px rgba(0,0,0,.4); }
.modal-head { display:flex; align-items:start; justify-content:space-between; gap:2rem; }
.modal-head h2 { margin:0; font-family:Georgia,serif; font-size:2.3rem; font-weight:400; }
.modal-close { width:40px; height:40px; border:1px solid var(--line); border-radius:50%; background:transparent; cursor:pointer; }
.modal-body { color:var(--muted); }
.modal-body h3 { color:var(--ink); margin:1.4rem 0 .35rem; }
.consent-dialog { width:min(560px,calc(100% - 2rem)); box-sizing:border-box; border:0; border-radius:18px; background:var(--white); color:var(--ink); padding:clamp(22px,5vw,38px); max-height:90dvh; overflow:auto; }
.consent-dialog h2 { margin:0 0 16px; font-size:clamp(1.5rem,5vw,2rem); line-height:1.2; }
.consent-dialog p { color:var(--muted); }
.consent-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.consent-actions button { flex:1 1 160px; }
.plain-button { border:1px solid var(--ink); border-radius:8px; padding:12px 20px; background:var(--white); color:var(--ink); cursor:pointer; }
.cookie-banner { position:fixed; z-index:40; bottom:16px; left:16px; right:16px; max-width:680px; padding:24px; border:1px solid var(--line); border-radius:18px; background:var(--white); color:var(--ink); box-shadow:var(--shadow); max-height:70dvh; overflow:auto; }
.cookie-banner h2 { font-size:1.2rem; margin:0; }
.cookie-banner p { font-size:.9rem; margin:10px 0; }
.cookie-banner .consent-actions { margin-top:12px; }
.inline-link { padding:0; border:0; background:none; color:inherit; text-decoration:underline; cursor:pointer; }
.cookie-category { display:block; border-top:1px solid var(--line); padding:16px 0; }
.cookie-category small { display:block; color:var(--muted); }
@media (max-width:790px) {
  .menu-button { display:inline-grid; place-items:center; }
  .nav-links { position:absolute; left:1rem; right:1rem; top:calc(100% + .5rem); display:none; align-items:stretch; flex-direction:column; gap:0; padding:.6rem; border:1px solid rgba(255,255,255,.12); border-radius:1rem; background:#111; }
  .nav-links.open { display:flex; }
  .nav-links a { padding:.85rem; }
  .nav-cta { border:0; border-radius:.6rem; }
  .product-hero,.detail-grid { grid-template-columns:1fr; gap:2.4rem; }
  .product-media { max-width:620px; margin:0 auto; }
  .spec-card { position:static; }
  .footer-top { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1/-1; }
}
@media (max-width:520px) {
  .research-banner { font-size:.64rem; letter-spacing:.09em; }
  .nav,.product-shell,.footer-inner { width:min(100% - 1.5rem,1180px); }
  .nav { min-height:68px; }
  .product-shell { padding-top:1.3rem; }
  .product-copy h1 { font-size:clamp(3rem,17vw,4.5rem); }
  .detail-grid { margin-top:4rem; }
  .actions { align-items:stretch; flex-direction:column; }
  .footer-top { grid-template-columns:1fr; gap:2rem; }
  .footer-brand { grid-column:auto; }
  .footer-bottom { align-items:stretch; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }