
:root{--bg:#090A0C;--surface:#111318;--surface2:#171A20;--line:#2B3038;--text:#F5F7FA;--muted:#9099A6;--accent:#F1F3F6;--ink:#0B0D10;--button-radius:12px;--card-radius:22px;--font-heading:"Space Grotesk";--font-body:"Inter"}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body),system-ui,-apple-system,Segoe UI,sans-serif;transition:background .25s,color .25s}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}
h1,h2,h3,.brand strong,.mark{font-family:var(--font-heading),var(--font-body),sans-serif}
.site-header{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:15px 5vw;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:10px}.mark{width:42px;height:42px;border-radius:calc(var(--button-radius) + 2px);display:grid;place-items:center;background:var(--accent);color:var(--ink);font-size:11px;font-weight:900;overflow:hidden}.mark img{width:100%;height:100%;object-fit:contain;padding:5px}.brand-copy{display:grid}.brand-copy small{color:var(--muted);font-size:10px;letter-spacing:.12em}
.site-header nav{display:flex;gap:24px}.site-header nav a{font-size:13px;color:var(--muted);transition:.2s}.site-header nav a:hover{color:var(--text)}
.btn{border:1px solid var(--line);border-radius:var(--button-radius);background:var(--surface2);color:var(--text);padding:12px 16px;font-weight:800;transition:.2s}.btn:hover{transform:translateY(-1px);filter:brightness(1.06)}.btn.primary{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.eyebrow{font-size:10px;letter-spacing:.21em;color:var(--muted);font-weight:800;text-transform:uppercase}
.hero{max-width:1500px;margin:auto;min-height:72vh;padding:84px 6vw;display:grid;grid-template-columns:1fr .86fr;align-items:center;gap:44px}.hero h1{font-size:clamp(48px,7vw,100px);line-height:.94;letter-spacing:-.055em;margin:15px 0 22px}.hero p{color:var(--muted);max-width:680px;line-height:1.75;font-size:16px}
.hero-card{position:relative;min-height:440px;border:1px solid var(--line);border-radius:calc(var(--card-radius) + 8px);overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 28% 25%,color-mix(in srgb,var(--accent) 36%,transparent),transparent 34%),linear-gradient(145deg,var(--surface2),var(--surface));box-shadow:0 34px 90px color-mix(in srgb,var(--bg) 70%,transparent)}
.hero-card::after{content:"";position:absolute;width:62%;height:22%;bottom:7%;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,transparent);filter:blur(28px)}.hero-card.glass{background:linear-gradient(135deg,color-mix(in srgb,var(--surface2) 78%,transparent),color-mix(in srgb,var(--accent) 8%,var(--surface)));backdrop-filter:blur(20px)}.hero-card.clean{background:var(--surface)}
.hero-logo{position:relative;z-index:1;max-width:78%;max-height:340px;object-fit:contain;filter:drop-shadow(0 28px 34px rgba(0,0,0,.35));animation:floatLogo 5s ease-in-out infinite}.hero-monogram{position:relative;z-index:1;font-family:var(--font-heading);font-size:clamp(80px,13vw,180px);font-weight:800;letter-spacing:-.09em}@keyframes floatLogo{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-9px) rotate(1deg)}}
.section{max-width:1500px;margin:auto;padding:88px 6vw}.section-head{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:30px}.section-head h2,.about h2,.contact h2{font-size:clamp(34px,4vw,60px);margin:8px 0 0;letter-spacing:-.045em}
.featured-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.featured{min-height:480px;border:1px solid var(--line);border-radius:var(--card-radius);overflow:hidden;position:relative;background:var(--surface);cursor:pointer}.featured img{width:100%;height:100%;object-fit:cover;transition:.35s}.featured:hover img{transform:scale(1.02)}.featured .overlay{position:absolute;inset:0;padding:24px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(to top,rgba(0,0,0,.86),transparent 67%);color:#fff}.featured h3{font-size:30px;margin:7px 0}
.search{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:var(--button-radius);padding:12px 14px;outline:none;min-width:230px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}.filter{border:1px solid var(--line);background:var(--surface);color:var(--muted);padding:8px 13px;border-radius:999px;cursor:pointer}.filter.active{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.catalog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.product{border:1px solid var(--line);border-radius:var(--card-radius);overflow:hidden;background:var(--surface);cursor:pointer;transition:.22s}.product:hover{transform:translateY(-3px);box-shadow:0 16px 44px rgba(0,0,0,.16)}.product img{width:100%;aspect-ratio:1/1;object-fit:cover}.product .copy{padding:15px}.product .copy small{color:var(--muted)}.product h3{margin:6px 0}.product p{font-size:12px;color:var(--muted);line-height:1.5}.price-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}.stock-chip{font-size:11px;border:1px solid var(--line);border-radius:999px;padding:4px 8px;color:var(--muted)}
.about{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.about>div{border:1px solid var(--line);border-radius:var(--card-radius);background:var(--surface);padding:45px}.about p{color:var(--muted);line-height:1.8}.about-art{display:grid!important;place-items:center;overflow:hidden;min-height:320px}.about-art img{max-width:70%;max-height:260px;object-fit:contain}.about-word{font-family:var(--font-heading);font-size:clamp(80px,12vw,170px);font-weight:800;letter-spacing:-.08em}
.contact{display:flex;justify-content:space-between;align-items:end;gap:20px;border-top:1px solid var(--line)}.contact-links{display:flex;gap:8px;flex-wrap:wrap}.contact-links a{border:1px solid var(--line);background:var(--surface);padding:10px 13px;border-radius:var(--button-radius);color:var(--muted)}footer{display:flex;justify-content:space-between;padding:25px 5vw;border-top:1px solid var(--line);color:var(--muted)}
dialog{width:min(900px,calc(100% - 24px));border:1px solid var(--line);border-radius:var(--card-radius);background:var(--surface);color:var(--text);padding:0;overflow:hidden}dialog::backdrop{background:rgba(0,0,0,.75);backdrop-filter:blur(4px)}.modal-grid{display:grid;grid-template-columns:1fr 1fr}.modal-grid>img{width:100%;height:100%;min-height:520px;object-fit:cover}.modal-copy{padding:45px;display:flex;flex-direction:column;justify-content:center}.modal-copy h2{font-size:45px;margin:10px 0}.modal-copy p{color:var(--muted);line-height:1.8}.tags{display:flex;gap:8px;flex-wrap:wrap}.tags span{border:1px solid var(--line);border-radius:999px;padding:7px 9px;color:var(--muted);font-size:11px}.close{position:absolute;right:14px;top:14px;width:38px;height:38px;border-radius:var(--button-radius);border:1px solid var(--line);background:var(--bg);color:var(--text);font-size:20px}.order-box{margin-top:20px;display:grid;gap:8px}.variant-select{width:100%;border:1px solid var(--line);background:var(--surface2);color:var(--text);border-radius:var(--button-radius);padding:11px 12px;outline:none}.quantity-row input{width:100px;border:1px solid var(--line);background:var(--surface2);color:var(--text);border-radius:var(--button-radius);padding:11px 12px;outline:none}.demo-btn{margin-top:14px;border:1px solid var(--accent);background:var(--accent);color:var(--ink);border-radius:var(--button-radius);padding:12px 15px;font-weight:800}
@media(max-width:900px){.site-header nav{display:none}.hero,.about{grid-template-columns:1fr}.featured-grid{grid-template-columns:1fr}.catalog-grid{grid-template-columns:repeat(2,1fr)}.hero-card{min-height:380px}}@media(max-width:560px){
.catalog-grid{grid-template-columns:1fr}
.section{padding:64px 16px}
.hero{padding:58px 16px}
.featured{min-height:420px}
.contact,.section-head{align-items:flex-start;flex-direction:column}
.search{width:100%}
dialog{
  width:calc(100% - 16px);
  max-height:calc(100dvh - 16px);
  overflow-y:auto;
  overscroll-behavior:contain;
}
.modal-grid{grid-template-columns:1fr}
.modal-grid>img{
  min-height:0;
  height:240px;
  max-height:38dvh;
  object-fit:contain;
  background:var(--surface2);
}
.modal-copy{padding:20px}
.modal-copy h2{font-size:32px;line-height:1.05}
.close{
  position:sticky;
  top:10px;
  margin-left:auto;
  display:block;
  z-index:20;
}
.order-box{margin-top:14px}
.demo-btn{width:100%}
}

/* Cloudflare demo refinements */
.demo-pill{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:7px 12px;color:var(--muted);font-size:11px;letter-spacing:.13em;gap:8px;margin-bottom:16px}
.demo-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:#d0b69a}
.product:focus-visible,.featured:focus-visible,.filter:focus-visible,.close:focus-visible{outline:2px solid var(--text);outline-offset:3px}
.product img,.featured img{background:var(--surface2)}
.mobile-hint{font-size:12px;color:var(--muted);margin-top:12px}
.empty-state{grid-column:1/-1;padding:40px 20px;text-align:center;border:1px dashed var(--line);border-radius:var(--card-radius);color:var(--muted)}
button[disabled]{cursor:not-allowed;opacity:.45}
@media(max-width:560px){.hero h1{font-size:clamp(46px,13vw,72px)}.hero-card{min-height:320px}.hero{gap:26px}.modal-grid>img{height:220px}.featured{min-height:360px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}

.hero-monogram img{max-width:100%;max-height:320px;object-fit:contain}
