:root{--paper:#f4f3f1;--surface:#fff;--ink:#17202e;--muted:#5b6575;--line:#dcdad5;--slate:#2f4a6d;--slate-d:#223852;--navy:#0b1220;--danger:#a82a2a;--ok:#1d6b45;--radius:8px;
--display:'Montserrat','Segoe UI',system-ui,sans-serif;--body:'Hanken Grotesk','Segoe UI',system-ui,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--body)}
img,svg{max-width:100%}
a{color:var(--slate);text-underline-offset:3px}
a:hover{color:var(--slate-d)}
:focus-visible{outline:3px solid #4a7bd0;outline-offset:3px;border-radius:3px}
h1,h2,h3{font-family:var(--display);line-height:1.15;letter-spacing:-.01em;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,4.5vw,2.8rem)}
h2{font-size:clamp(1.25rem,2.5vw,1.6rem);margin-top:1.8em}
h3{font-size:1.15rem}
h3 a{color:inherit;text-decoration:none}
p{margin:0 0 1em;max-width:68ch}
.lede{font-size:1.2rem;color:var(--muted);max-width:56ch}
.muted{color:var(--muted)}.small{font-size:.9rem}.num{text-align:right}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.5rem 1rem;z-index:99}.skip:focus{left:0}
.wrap{width:min(1160px,100% - 32px);margin-inline:auto}
.narrow{max-width:640px}
.page{padding-block:24px 56px}.block{padding-block:24px 8px}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}

/* header */
.top{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.top__bar{display:flex;align-items:center;gap:20px;min-height:68px;flex-wrap:wrap;padding-block:8px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand__text{display:flex;flex-direction:column;line-height:1.1}
.brand__text strong{font:700 1.05rem var(--display);letter-spacing:.04em}
.brand__text small{color:var(--muted);font-size:.8rem}
.search{flex:1;min-width:180px;max-width:420px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:0 14px;background:#fafaf9;color:var(--muted);margin-left:auto}
.search input{flex:1;border:0;background:none;padding:10px 0;font:inherit;color:var(--ink);min-width:0}
.search input:focus{outline:none}.search:focus-within{border-color:var(--slate)}
.nav{display:flex;align-items:center;gap:18px}
.nav a{color:var(--ink);text-decoration:none;font-weight:500}
.nav a[aria-current=page]{color:var(--slate);text-decoration:underline;text-underline-offset:8px}
.iconlink{display:grid;place-items:center;position:relative}
.badge{position:absolute;top:-8px;right:-10px;background:var(--slate);color:#fff;font-size:.72rem;min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center;padding:0 4px}

/* buttons / forms */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--slate);color:#fff;border:1px solid var(--slate);border-radius:var(--radius);padding:11px 22px;font:600 1rem var(--body);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--slate-d);color:#fff}
.btn--block{display:flex;width:100%}
.btn--small{padding:6px 14px;font-size:.9rem}
.btn--ghost{background:transparent;color:var(--slate)}.btn--ghost:hover{background:#e9eef5;color:var(--slate-d)}
.btn--danger{background:var(--danger);border-color:var(--danger)}.btn--danger:hover{background:#862020}
.btn--disabled,.btn:disabled{background:#c9ccd1;border-color:#c9ccd1;color:#fff;cursor:not-allowed}
.linkbtn{background:none;border:0;color:var(--slate);text-decoration:underline;font:inherit;cursor:pointer;padding:0}
.form{display:grid;gap:16px;max-width:520px}
.form label{display:grid;gap:6px;font-weight:500}
.form--inline{max-width:420px}
input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],textarea,select{font:inherit;padding:10px 12px;border:1px solid #bfc3ca;border-radius:var(--radius);background:#fff;color:var(--ink);width:100%}
select{width:auto;min-width:160px}
.help{font-weight:400;color:var(--muted);font-size:.9rem}
.check{display:flex!important;grid-template-columns:none;gap:10px;align-items:flex-start;font-weight:400!important}
.check input{width:auto;margin-top:.35em}
.check--plain{padding:3px 0}

/* notices */
.notice{border-radius:var(--radius);padding:12px 16px;margin:16px 0;border:1px solid;max-width:none}
.notice--ok{background:#e8f4ec;border-color:#a8d3b8;color:#12482e}
.notice--info{background:#e9eff7;border-color:#b5c7de;color:#1f3552}
.notice--error{background:#fbeaea;border-color:#e2aaaa;color:#7b1d1d}
.notice__lead{margin:0 0 4px;font-weight:700}.notice ul{margin:0;padding-left:20px}

.crumbs{display:flex;gap:8px;color:var(--muted);font-size:.9rem;margin-bottom:16px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}

/* hero + cards */
.hero{background:linear-gradient(180deg,#e9edf3,var(--paper));padding-block:48px}
.hero__grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.hero__art svg{width:100%;height:auto}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.card__art{display:block;background:#eef1f5;padding:12px}
.card__art svg,.art--img{display:block;width:100%;height:auto;border-radius:6px}
.card__body{padding:16px;display:flex;flex-direction:column;flex:1}
.card__body p{flex:1}
.card__price{font-weight:700;color:var(--slate);flex:0!important}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.tile{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;text-decoration:none;color:var(--ink);font-weight:600}
a.tile:hover{border-color:var(--slate)}
.tile span:not(.tile__icon):not(.muted){flex:1}
.tile .muted{font-weight:400;flex-basis:100%}
.tile--static,.tiles a.tile{flex-wrap:wrap}
.tile__icon{color:var(--slate);display:inline-grid}
.help-link{display:flex;gap:8px;align-items:center;margin-top:28px;color:var(--muted)}

/* listing */
.listing{display:grid;grid-template-columns:220px 1fr;gap:32px}
.filters h2{font-size:1rem;margin:0 0 8px}.filters h2:not(:first-child){margin-top:24px}
.listing__head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.sort{display:flex;align-items:center;gap:8px}

/* detail */
.detail{display:grid;grid-template-columns:1.1fr 1fr;gap:40px}
.gallery__main{background:#eef1f5;padding:16px;border-radius:var(--radius);border:1px solid var(--line)}
.thumbs{display:flex;gap:8px;margin-top:10px}.thumb{border:1px solid var(--line);background:#fff;padding:2px;border-radius:6px;cursor:pointer;width:72px}
.thumb img{display:block;width:100%}
.req{display:flex;gap:8px;align-items:center;color:var(--muted)}
.ticks{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:8px}
.ticks li{display:flex;gap:10px;align-items:flex-start}.ticks svg{color:var(--ok);flex:none;margin-top:5px}
.buybox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;display:grid;gap:14px;max-width:420px}
.buybox label{display:grid;gap:6px;font-weight:500}.buybox select{width:100%}
.buybox__price{font:700 1.6rem var(--display);margin:0}
.faq{margin-top:40px;max-width:760px}
details{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px;margin-bottom:8px}
summary{cursor:pointer;font-weight:600}details p{margin:.6em 0 0}

/* tables / cart / checkout */
.tablewrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.table th,.table td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.table th.num,.table td.num{text-align:right}
.table th{font-size:.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.cart__product{display:flex;gap:12px;align-items:center;min-width:240px}
.cart__thumb{width:84px;flex:none}.cart__thumb svg{display:block}
.qty{display:flex;gap:8px;align-items:center}.qty input{width:70px}
.cartgrid,.checkout{display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start}
.checkout__main{display:grid;gap:16px}
.summary,.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.panel h2,.summary h2{margin-top:0;font-size:1.2rem}
.summary dl{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin:0 0 16px}.summary dd{margin:0;text-align:right}
.summary .total{font-weight:700;font-size:1.15rem;border-top:1px solid var(--line);padding-top:8px}
.summary__lines{list-style:none;padding:0;margin:0 0 12px}.summary__lines li{display:flex;justify-content:space-between;gap:12px;padding:6px 0}
.secure{display:flex;gap:6px;align-items:center;color:var(--muted);font-size:.9rem;margin-top:12px}
.back{margin-top:20px}

/* account */
.account{display:grid;grid-template-columns:220px 1fr;gap:32px}
.side{display:grid;gap:4px;align-content:start}.side h2{margin:0 0 8px;font-size:1.1rem}
.side__link{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:var(--radius);color:var(--ink);text-decoration:none;font:500 1rem var(--body);background:none;border:0;cursor:pointer;width:100%;text-align:left}
.side__link:hover,.side__link.is-active{background:#e6ebf2;color:var(--slate-d)}
.libcard{display:grid;grid-template-columns:150px 1fr auto;gap:20px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:14px}
.libcard__art svg{display:block}
.keyrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:6px}
.keyrow__label{font-size:.85rem;color:var(--muted)}
.keyrow__key{background:#eef1f5;padding:4px 10px;border-radius:6px;font-size:.95rem}
.licenses{list-style:none;padding:0;display:grid;gap:12px}
.licrow{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.pill{background:#e8f4ec;color:var(--ok);padding:2px 10px;border-radius:999px;font-size:.85rem;font-weight:600}
.facts{display:grid;grid-template-columns:120px 1fr;gap:8px 16px}.facts dt{color:var(--muted)}.facts dd{margin:0}

/* support / about */
.helpsearch{display:flex;gap:10px;align-items:center;max-width:560px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 8px 6px 16px;margin-bottom:24px}
.helpsearch input{border:0;flex:1;padding:6px}.helpsearch input:focus{outline:none}
.contact{margin-top:32px}
.steps{padding-left:20px}.steps li{margin-bottom:10px}
.band{background:var(--navy);color:#e9edf5;padding-block:56px}
.band h1{color:#fff}.band .lede{color:#b9c3d6}
.band__grid{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.band__logo{width:100%;max-width:380px;height:auto;justify-self:center}
.eyebrow{color:#8fa6c8;text-transform:uppercase;letter-spacing:.12em;font-size:.85rem;font-weight:700}
.tagline-big{font:700 clamp(1.3rem,3vw,1.8rem) var(--display);margin:32px 0 16px}

/* legal */
.legal{max-width:760px}.legal h2{margin-top:1.6em}

/* footer */
.foot{background:var(--navy);color:#b9c3d6;margin-top:40px;padding-block:28px}
.foot a{color:#d5deee}
.foot__bar,.foot__legal{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
.foot__nav{display:flex;gap:20px}
.foot__legal{margin-top:12px;padding-top:12px;border-top:1px solid #243049;font-size:.9rem}
.foot__legal p{margin:0}.foot__legal a{margin-right:14px}

/* coming soon */
.soon-page{background:var(--navy);color:#e9edf5;min-height:100vh}
.soon{min-height:100vh;display:grid;place-items:center;padding:24px;text-align:center}
.soon__inner{max-width:520px}.soon__logo{width:min(340px,80%);height:auto}
.soon__tag{color:#8fa6c8;letter-spacing:.06em;margin:0 auto 8px}
.soon h1{color:#fff;font-size:clamp(1.8rem,5vw,2.4rem)}
.soon a{color:#9fc0ff}.soon p{margin-inline:auto}

@media(max-width:860px){
.hero__grid,.detail,.cartgrid,.checkout,.listing,.account,.band__grid{grid-template-columns:1fr}
.libcard{grid-template-columns:1fr}.search{order:3;max-width:none;flex-basis:100%;margin-left:0}
.nav{margin-left:auto}.hero{padding-block:28px}
.table--cart thead{display:none}.table--cart,.table--cart tbody,.table--cart tr,.table--cart td{display:block;width:100%}
.table--cart tr{padding:10px 0;border-bottom:1px solid var(--line)}.table--cart td{border:0;padding:6px 14px}
.table--cart td[data-label]::before{content:attr(data-label) ": ";color:var(--muted)}
.table--cart td.num{text-align:left}
}
.search input[type=search],.helpsearch input[type=search]{border:0;background:none;border-radius:0;padding:10px 0}
.helpsearch input[type=search]{padding:6px}