@import url('https://fonts.googleapis.com/css2?family=Syne:wght@500;600;700;800&family=Inter:wght@400;500;600&display=swap');
:root { --ink:#0a0a0a; --paper:#fff; --muted:#737373; --line:#dedede; --gutter:clamp(24px,5vw,96px); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:94px; }
body { margin:0; font-family:Inter,Arial,sans-serif; background:var(--paper); color:var(--ink); }
[hidden] { display:none !important; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
button,a { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.skip-link { position:fixed; top:0; left:16px; z-index:200; padding:12px; background:#fff; transform:translateY(-120%); }
.skip-link:focus { transform:none; }
#preloader { position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; }
.intro-logo { display:block; }
.intro-skip { background:transparent; }
.site-header { height:92px; padding:0 var(--gutter); display:flex; align-items:center; gap:40px; position:sticky; top:0; background:#fff; z-index:40; border-bottom:1px solid #ececec; }
.brand { font-family:Syne,Arial,sans-serif; font-size:34px; font-weight:800; letter-spacing:-2px; }
.brand-period { margin-left:1px; }
.site-nav { display:flex; gap:34px; align-items:center; margin-left:auto; height:100%; }
.site-nav a { height:100%; display:flex; align-items:center; position:relative; font-size:13px; font-weight:500; }
.site-nav a::after { position:absolute; content:''; bottom:24px; left:0; width:100%; height:1px; background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .2s ease; }
.site-nav a:hover::after,.site-nav a[aria-current]::after { transform:scaleX(1); }
.header-location { padding-left:30px; border-left:1px solid var(--line); font-size:10px; letter-spacing:.16em; }
.menu-toggle { display:none; }
.home-hero { min-height:600px; height:calc(100svh - 92px); max-height:1000px; position:relative; overflow:hidden; background:#090909; color:#fff; }
.hero-photo,.hero-shade { position:absolute; inset:0; }
.hero-photo { opacity:1; transform:scale(1); transition:opacity 1s ease, transform 1.4s ease; }
.hero-photo img { width:100%; height:100%; object-fit:cover; object-position:60% center; display:block; }
.hero-shade { pointer-events:none; background:linear-gradient(90deg,rgba(0,0,0,.52),rgba(0,0,0,.06) 72%),linear-gradient(0deg,rgba(0,0,0,.64),transparent 45%); }
.hero-copy { position:absolute; left:var(--gutter); right:var(--gutter); bottom:145px; opacity:1; transform:translateY(0); transition:opacity .8s ease .15s,transform .8s ease .15s; }
.eyebrow { margin:0 0 28px; font-size:10px; font-weight:500; line-height:1.8; letter-spacing:.18em; }
.hero-copy h1 { font-family:Syne,Arial,sans-serif; font-size:clamp(80px,12vw,190px); font-weight:700; line-height:.88; letter-spacing:-.065em; margin:0; }
.hero-copy h1 span { display:block; font-size:clamp(23px,3vw,46px); letter-spacing:-.035em; line-height:1.4; margin-bottom:12px; }
.scroll-cue { position:absolute; left:var(--gutter); bottom:38px; display:flex; align-items:center; gap:34px; font-size:12px; }
.scroll-cue span { display:grid; place-items:center; border:1px solid #ffffff70; border-radius:50%; width:38px; height:38px; }
.hero-index { position:absolute; right:var(--gutter); bottom:48px; display:flex; align-items:center; gap:14px; font-size:10px; letter-spacing:.14em; }
.hero-index i { display:block; width:50px; height:1px; background:#ffffff70; }
body.intro-active .hero-photo { opacity:0; transform:scale(1.035); }
body.intro-active .hero-copy { opacity:0; transform:translateY(24px); }
.content-section { padding:110px var(--gutter); }
.about-section { display:grid; grid-template-columns:1fr 1fr; gap:10vw; }
.section-heading .eyebrow { color:var(--muted); margin-bottom:24px; }
.section-heading h2 { margin:0; font-family:Syne,Arial,sans-serif; font-size:clamp(36px,4.6vw,72px); font-weight:500; line-height:1.12; letter-spacing:-.055em; }
.company-identity { border-top:1px solid var(--ink); padding-top:20px; }
.section-marker { color:var(--muted); letter-spacing:.16em; font-size:10px; }
.company-name { font-size:clamp(18px,2vw,30px); line-height:1.55; font-weight:400; margin:40px 0 38px; letter-spacing:-.015em; }
.company-location { border-top:1px solid var(--line); padding-top:18px; display:flex; justify-content:space-between; align-items:center; color:var(--muted); font-size:12px; }
.company-location a { display:grid; place-items:center; width:32px; height:32px; color:#000; border:1px solid var(--line); border-radius:50%; }
.dark-section { background:#000; color:#fff; }
.category-grid,.product-grid,.news-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.site-footer { padding:66px var(--gutter) 100px; background:#080808; color:#fff; }
.footer-top { display:flex; justify-content:space-between; align-items:center; gap:30px; padding-bottom:55px; border-bottom:1px solid #333; }
.footer-wordmark { font-family:Syne,Arial,sans-serif; font-size:clamp(55px,8vw,115px); font-weight:700; letter-spacing:-.06em; line-height:1; }
.footer-top nav { display:flex; gap:30px; font-size:12px; color:#ccc; }
.footer-top nav a:hover { color:#fff; text-decoration:underline; }
.footer-bottom { padding-top:25px; display:flex; justify-content:space-between; gap:20px; font-size:9px; color:#999; letter-spacing:.1em; line-height:1.8; }
.preview-tools { box-shadow:none; }
@media(max-width:760px) {
  .site-header { height:76px; gap:20px; }
  .brand { font-size:30px; }
  .header-location { display:none; }
  .menu-toggle { display:flex; margin-left:auto; gap:16px; align-items:center; background:none; border:0; padding:12px 0 12px 12px; font-size:12px; color:#000; }
  .site-nav { position:absolute; top:76px; left:0; right:0; margin:0; padding:20px var(--gutter) 28px; display:none; height:auto; background:#fff; border-bottom:1px solid var(--line); }
  .site-nav.is-open { display:flex; flex-direction:column; align-items:stretch; gap:0; }
  .site-nav a { padding:16px 0; height:auto; font-size:18px; }
  .site-nav a::after { bottom:7px; }
  .home-hero { height:calc(88svh - 76px); min-height:560px; }
  .hero-copy { bottom:130px; }
  .hero-copy .eyebrow { max-width:240px; font-size:8px; margin-bottom:26px; }
  .hero-copy h1 { font-size:clamp(72px,18vw,125px); }
  .hero-index { display:none; }
  .hero-photo img { object-position:60% center; }
  .about-section { grid-template-columns:1fr; gap:50px; }
  .content-section { padding:70px var(--gutter); }
  .footer-top { align-items:flex-start; flex-direction:column; gap:40px; }
  .footer-top nav { flex-wrap:wrap; gap:24px; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .category-grid,.product-grid,.news-grid,.feature-grid { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .hero-copy,.hero-photo { transition:none; } }