/* ATHENICS R57 — accessory atmosphere and architectural light mode */
:root{--r57-black:#111111;--r57-white:#FFFFFF;--r57-steel:#B8BDC5;--r57-graphite:#2E3238;--r57-red:#C8102E;--r57-red-deep:#A60F28;--r57-off:#F8F8F8;--r57-ice:#EEF1F4;--r57-line:#D6D8DC;--r57-shadow:0 18px 44px rgba(17,17,17,.10)}
/* Light mode is a designed palette, not a dark-mode inversion. */
html:not(.dark){--background:var(--r57-off);--foreground:var(--r57-black);--card:var(--r57-white);--primary:var(--r57-black);--accent:var(--r57-red);--muted:#2e3238;--border:var(--r57-line);--steel:var(--r57-steel);color-scheme:light;background:var(--r57-off)}
html:not(.dark) body{background:var(--r57-off);color:var(--r57-black)}html:not(.dark) .site-shell{background:var(--r57-off);color:var(--r57-black)}html:not(.dark) .site-header{background:rgba(255,255,255,.92);border-color:var(--r57-line);box-shadow:0 2px 18px rgba(17,17,17,.06)}html:not(.dark) .section-pad:nth-of-type(odd){background:var(--r57-white)}html:not(.dark) .section-pad:nth-of-type(even){background:var(--r57-ice)}html:not(.dark) .route-label{border-color:var(--r57-line);color:var(--r57-graphite)}html:not(.dark) .site-footer{background:var(--r57-black);color:var(--r57-white)}html:not(.dark) .site-footer a,html:not(.dark) .site-footer .muted{color:#eef1f4}html:not(.dark) .button-red{background:var(--r57-black);color:var(--r57-white)}html:not(.dark) .button-red:hover,html:not(.dark) .button-red:focus-visible{background:var(--r57-red);color:#fff}html:not(.dark) .button-outline{border-color:var(--r57-graphite);color:var(--r57-black)}html:not(.dark) input,html:not(.dark) select,html:not(.dark) textarea{background:var(--r57-white);border-color:var(--r57-line);color:var(--r57-black)}html:not(.dark) input::placeholder,html:not(.dark) textarea::placeholder{color:#2e3238}
/* Accessory cards: Cap remains the atmosphere reference; other products gain restrained light and steel depth. */
.accessory-card{position:relative;overflow:hidden;border-color:color-mix(in srgb,var(--border) 82%,var(--steel));background:linear-gradient(145deg,color-mix(in srgb,var(--card) 94%,var(--steel)),var(--card));box-shadow:0 8px 20px rgba(10,14,18,.08);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,filter .24s ease}.accessory-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,transparent 35%,rgba(184,189,197,.12) 52%,transparent 67%);opacity:.4;transform:translateX(-28%);transition:opacity .24s ease,transform .45s ease}.accessory-card img{filter:grayscale(.58) contrast(1.04) brightness(1.02);transition:filter .24s ease,transform .35s ease}.accessory-card div{position:relative;z-index:1;background:color-mix(in srgb,var(--card) 92%,transparent)}.accessory-card:hover,.accessory-card:focus-within{border-color:var(--r57-red);box-shadow:var(--r57-shadow),0 0 0 1px color-mix(in srgb,var(--r57-red) 34%,transparent);transform:translateY(-4px) scale(1.02)}.accessory-card:hover::after,.accessory-card:focus-within::after{opacity:.9;transform:translateX(28%)}.accessory-card:hover img,.accessory-card:focus-within img{filter:grayscale(.08) contrast(1.07) saturate(1.08) brightness(1.04);transform:scale(1.02)}.accessory-card strong{color:var(--foreground)}.accessory-card span{color:var(--muted)}
/* Touch and reduced-motion users still see the enhanced card treatment without relying on hover. */
@media (hover:none){.accessory-card img{filter:grayscale(.18) contrast(1.05) saturate(1.03);}.accessory-card:active{transform:scale(.99)}}
@media (prefers-reduced-motion:reduce){.accessory-card,.accessory-card::after,.accessory-card img{transition:none!important}}
