/* Teleon Works — Graphite. Original tenant design, no third-party theme assets. */
:root { color-scheme: light; --paper:#f4f3ef; --ink:#202226; --ink-dim:#55595c; --ink-faint:#676d70; --panel:#fff; --panel-2:#ecebe6; --line:rgba(28,31,34,.28); --line-soft:rgba(28,31,34,.16); --line-faint:rgba(28,31,34,.09); --metal:#555e65; --metal-bright:#414b52; --signal:#a3340c; --accent:#cf491d; --muted:#656a6d; --radius:4px; --shadow-window:0 16px 48px #161a2012; }
body { background:var(--paper); color:var(--ink); letter-spacing:-.015em; }
body::before,body::after { display:none; }
h1,h2,h3,.brand,.hero h1,.section-heading h2,.catalog-intro h1,.account-intro h1,.guest-order-intro h1,.lineup-rail span { font-family:Arial,Helvetica,system-ui,sans-serif; font-weight:650; }
.site-header { background:#171b1e; color:#f6f5f1; border-bottom:1px solid #ffffff24; padding:1.35rem max(1.25rem,calc((100vw - 1320px)/2)); backdrop-filter:none; }
.brand { font-size:1rem; font-weight:800; letter-spacing:.14em; white-space:nowrap; }
.brand::before { content:""; display:inline-block; width:9px; height:18px; margin-right:12px; background:#ed6938; transform:skew(-18deg); vertical-align:-3px; }
.site-header nav a,.site-header .currency-selector { color:#d4d8da; }
.site-header nav a:hover { color:white; }
.site-header .currency-selector select { color:#fff; background:#242b30; border-color:#566069; }
.nav-category-menu { background:#20272c; border-color:#455059; border-radius:4px; }
.nav-category-menu a:hover { background:#313a41; color:white; }
.container { width:min(1320px,calc(100% - 3rem)); padding:3.5rem 0; }
.graphite-home { padding-top:0; }
.graphite-hero { position:relative; isolation:isolate; display:grid; grid-template-columns:1.1fr 1fr; align-items:center; min-height:620px; gap:1rem; padding:5.5rem 0 4rem; color:#f4f3ef; }
.graphite-hero::before { content:""; position:absolute; inset:0; z-index:-2; background:#171b1e; box-shadow:0 0 0 100vmax #171b1e; clip-path:inset(0 -100vmax); }
.graphite-hero-copy { position:relative; z-index:2; }
.graphite-hero .eyebrow { color:#abb3b8; font-size:.68rem; letter-spacing:.23em; display:flex; align-items:center; gap:12px; }
.graphite-hero .eyebrow::before { content:""; width:28px; height:1px; background:#ed6938; }
.graphite-hero h1 { font-size:clamp(3.6rem,6vw,6rem); line-height:1; letter-spacing:-.065em; margin:1.8rem 0; max-width:12ch; font-weight:650; }
.graphite-hero h1 span { color:#aab2b8; }
.graphite-hero-copy > p:not(.eyebrow) { color:#b7bec3; font-size:1rem; line-height:1.8; max-width:34ch; }
.graphite-hero .button.primary { margin-top:1.6rem; padding:1rem 1.6rem; background:#ed6938; border-color:#ed6938; color:#171b1e; }
.graphite-hero .button.primary:hover { background:#ff885b; }
.graphite-art { width:100%; max-width:580px; min-width:0; justify-self:end; margin:0; aspect-ratio:1; height:auto; object-fit:contain; }
.graphite-art-caption { position:absolute; right:0; bottom:2.4rem; color:#929ea5; font: .65rem/1.6 ui-monospace,monospace; letter-spacing:.1em; text-transform:uppercase; }
.graphite-index { display:flex; justify-content:space-between; gap:1.5rem; padding:1.25rem 0; border-bottom:1px solid var(--line-soft); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.graphite-index span { color:var(--muted); }
.graphite-selection { padding-top:4.5rem; }
.section-heading h2 { font-size:clamp(2rem,3vw,3rem); letter-spacing:-.055em; line-height:1.1; }
.eyebrow { color:var(--muted); font-size:.65rem; letter-spacing:.17em; }
.text-link { color:var(--ink); text-underline-offset:5px; }
.button,button,input,select,textarea { border-radius:3px; }
.button { background:transparent; color:var(--ink); border:1px solid #9c9f9c; box-shadow:none; text-transform:none; letter-spacing:.01em; }
.button:hover { background:#e2e3de; border-color:#555d61; box-shadow:none; }
.button.primary { color:#fff; background:#a93811; border-color:#a93811; }
.button.primary:hover { background:#842a0d; }
.button:disabled { opacity:.55; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid #b9491d; outline-offset:4px; }
.product-grid { gap:2rem; grid-template-columns:repeat(3,minmax(0,1fr)); }
.card,.product-info.card { background:#fff; border:1px solid var(--line-soft); border-radius:4px; box-shadow:none; }
.product-card { border:0; border-radius:0; background:transparent; padding:0 0 1rem; box-shadow:none; }
.product-card:hover { background:transparent; border-color:transparent; transform:none; }
.product-card img,.product-card video { border:0; border-radius:3px; background:#e9e9e4; object-fit:contain; }
.product-card .storefront-gallery { background:#e9e9e4; border-radius:3px; }
.product-card h3 { font-size:1.1rem; font-weight:650; line-height:1.4; margin-top:.8rem; }
.product-card .product-category { color:#626a70; font-size:.65rem; letter-spacing:.12em; }
.product-card .price { color:#202226; font-family:inherit; font-size:1.15rem; font-weight:700; }
.product-card .button-row { gap:.5rem; }
.product-card-specs dt { color:#666c70; }
.product-card-specs dd { color:#343b40; }
.catalog-intro { padding:1.5rem 0 2rem; }
.catalog-intro h1 { font-size:clamp(3rem,6vw,5.5rem); }
.catalog-controls { background:transparent; border-color:var(--line-soft); box-shadow:none; }
input,select,textarea { background:#fff; color:#202226; border-color:#939b9f; }
.category-filters button,.category-filter { color:#32393f; }
.product-info h1 { font-size:clamp(2rem,3vw,3.3rem); line-height:1.12; letter-spacing:-.045em; }
.product-info .price { color:#202226; }
.main-product-media,.gallery { background:#e9e9e4; border-radius:4px; }
.hero { background:#e9e9e4; box-shadow:none; color:var(--ink); border-radius:4px; }
.hero::before,.hero::after { display:none; }
.buying-context { color:var(--ink-dim); background:transparent; border-color:var(--line-soft); }
.site-footer { border-top:1px solid #ffffff24; background:#171b1e; color:#aeb7be; padding:3rem max(1.5rem,calc((100vw - 1320px)/2)); margin-top:3rem; }
.site-footer a { color:#ecedeb; }
.site-footer p { color:#aeb7be; }
.graphite-preview-notice { margin:0; padding:.7rem 1.5rem; text-align:center; background:#e4e7e4; color:#343a3e; font:500 .75rem/1.5 system-ui,sans-serif; }
@media(min-width:1500px) { .graphite-hero { min-height:690px; } }
@media(max-width:900px) { .site-header { flex-wrap:wrap; gap:1rem; } .site-header nav { gap:.85rem; } .graphite-hero { min-height:520px; } .graphite-hero h1 { font-size:clamp(3.5rem,8vw,5rem); } .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .container { width:calc(100% - 2.5rem); padding-top:2rem; } .graphite-home { padding-top:0; } .site-header { position:relative; padding:1.1rem 1.25rem; } .site-header nav { width:100%; justify-content:space-between; gap:.5rem; } .site-header nav a { font-size:.76rem; } .currency-selector span { display:none; } .graphite-hero { display:block; min-height:0; padding:3rem 0 1.5rem; overflow:visible; } .graphite-hero::before { inset:0 -1.25rem; } .graphite-hero h1 { font-size:clamp(3.6rem,15vw,5.5rem); } .graphite-art { display:block; width:90%; margin:-2rem 0 -1rem auto; opacity:.8; } .graphite-art-caption { right:0; bottom:1rem; font-size:.55rem; } .graphite-index { font-size:.61rem; gap:1rem; } .graphite-index span { display:none; } .graphite-selection { padding-top:3rem; } .product-grid { gap:1.5rem; grid-template-columns:1fr; } .section-heading { align-items:start; gap:1rem; } .section-heading .text-link { font-size:.8rem; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }
