@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Manrope:wght@400;500;600;700&display=swap');

:root { --of-black:#0a0a0a; --of-ink:#171717; --of-cream:#f4f1ea; --of-stone:#d9d5cc; --of-accent:#ff3d00; --of-white:#fff; }
body { font-family:'Manrope',sans-serif; color:var(--of-ink); background:var(--of-cream); }
h1,h2,h3,.of-nav,.of-mobile-menu { font-family:'Barlow Condensed',sans-serif; }
.of-kicker { display:block; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; font-weight:700; margin-bottom:1rem; }
.of-utility { height:30px; padding:0 4vw; display:flex; align-items:center; justify-content:space-between; background:var(--of-black); color:#fff; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; }
.of-header { position:relative; z-index:1000; background:rgba(244,241,234,.96); }
.of-nav { height:78px; padding:0 4vw; display:flex; align-items:center; border-bottom:1px solid rgba(10,10,10,.14); text-transform:uppercase; font-size:1.02rem; letter-spacing:.05em; }
.of-logo img { max-height:54px; width:auto; object-fit:contain; }
.of-desktop-nav { display:flex; align-items:stretch; gap:1.7rem; margin:auto; height:100%; }
.of-desktop-nav>a,.of-mega>summary { display:flex; align-items:center; color:var(--of-ink); text-decoration:none; cursor:pointer; list-style:none; font-weight:600; }
.of-desktop-nav>a:hover,.of-mega>summary:hover { color:var(--of-accent); }
.of-nav-sale { color:var(--of-accent)!important; }
.of-mega { display:flex; }
.of-mega>summary::-webkit-details-marker { display:none; }
.of-mega-panel { position:absolute; top:108px; left:0; right:0; padding:3rem 8vw; background:var(--of-cream); border-bottom:1px solid #aaa; display:grid; grid-template-columns:1fr 1.4fr; gap:5rem; box-shadow:0 24px 40px rgba(0,0,0,.12); }
.of-mega[open] .of-mega-panel { animation:ofMegaIn .3s cubic-bezier(.2,.7,.2,1) both; }
.of-mega-panel h3 { font-size:3rem; line-height:.9; text-transform:uppercase; max-width:340px; }
.of-mega-panel a { color:inherit; text-decoration:none; }
.of-mega-links { display:grid; grid-template-columns:repeat(3,1fr); align-content:start; gap:.8rem 2rem; }
.of-mega-links a { border-bottom:1px solid #ccc; padding:.55rem 0; }
.of-mega-segment { grid-template-columns:1.15fr repeat(3,1fr); gap:3rem; }.of-mega-segment h4 { font:700 .72rem/1 'Manrope'; letter-spacing:.14em; text-transform:uppercase; color:#777; margin-bottom:1rem; }.of-mega-segment>div:not(:first-child) a { display:block; color:#111; padding:.38rem 0; font-size:.9rem; }.of-mega-segment>div:not(:first-child) a:hover { color:var(--of-accent); }.of-mega-visual { min-height:235px; padding:2rem; color:#fff; background-size:cover; background-position:center; position:relative; isolation:isolate; }.of-mega-visual:before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(0,0,0,.76),rgba(0,0,0,.14)); }.of-mega-visual h3 { font-size:2.8rem; }.of-mega-visual a { color:#fff; font-weight:700; }.of-brand-previews { display:grid; grid-template-columns:repeat(3,1fr); gap:.45rem; margin:1rem 0; }.of-brand-previews a { aspect-ratio:4/3; overflow:hidden; background:#111; }.of-brand-previews img { width:100%; height:100%; object-fit:cover; }
.of-actions { display:flex; align-items:center; gap:.4rem; }
.of-icon { width:42px; height:42px; display:grid; place-items:center; color:var(--of-ink); position:relative; text-decoration:none; }
.of-cart sup { position:absolute; top:0; right:0; }
.of-menu-toggle { display:none; border:0; background:none; width:42px; height:42px; padding:10px; }
.of-menu-toggle span { display:block; height:2px; background:#111; margin:6px 0; }
.of-mobile-menu { display:none; }
.of-hero { min-height:calc(100vh - 108px); position:relative; color:#fff; overflow:hidden; display:flex; align-items:flex-end; }
.of-hero-media,.of-hero-shade { position:absolute; inset:0; }
.of-hero-slide { position:absolute; inset:0; margin:0; opacity:0; transform:scale(1.035); transition:opacity .9s ease,transform 7s linear; pointer-events:none; }.of-hero-slide.is-active { opacity:1; transform:scale(1); pointer-events:auto; }.of-hero-slide img { width:100%; height:100%; object-fit:cover; object-position:center 35%; }.of-hero-slide:first-child img { animation:ofHero 1.4s cubic-bezier(.2,.7,.2,1) both; }
.of-hero-shade { background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.08) 70%),linear-gradient(0deg,rgba(0,0,0,.4),transparent 45%); pointer-events:none; }
.of-hero-copy { position:relative; z-index:2; padding:0 5vw 8vh; max-width:900px; }
.of-hero-copy h1 { font-size:clamp(5rem,12vw,10rem); line-height:.72; letter-spacing:-.045em; font-weight:900; margin:0 0 2rem; }
.of-hero-copy p { font-size:clamp(1rem,2vw,1.4rem); max-width:500px; }
.of-hero-actions { display:flex; gap:.8rem; margin-top:2rem; flex-wrap:wrap; }
.of-btn { min-height:50px; display:inline-flex; align-items:center; padding:.8rem 1.4rem; text-transform:uppercase; letter-spacing:.08em; font-size:.74rem; font-weight:700; text-decoration:none; transition:.2s; }
.of-btn-light { background:#fff; color:#111; }.of-btn-light:hover { background:var(--of-accent); color:#fff; }
.of-btn-ghost { color:#fff; border:1px solid rgba(255,255,255,.65); }.of-btn-ghost:hover { background:#fff; color:#111; }
.of-btn-dark { background:#111; color:#fff; }.of-btn-dark:hover { background:var(--of-accent); color:#fff; }
.of-scroll-cue { position:absolute; right:4vw; bottom:3rem; z-index:2; writing-mode:vertical-rl; text-transform:uppercase; letter-spacing:.15em; font-size:.65rem; }
.of-slider-controls { position:absolute; z-index:3; left:5vw; bottom:2rem; display:flex; gap:.45rem; }.of-slider-controls button { width:28px; height:3px; padding:0; border:0; background:rgba(255,255,255,.4); transition:width .25s,background .25s; }.of-slider-controls button.is-active { width:52px; background:#fff; }
.of-section { padding:8rem 5vw; }
.of-section-head { display:grid; grid-template-columns:1fr 2fr 1fr; align-items:end; gap:2rem; margin-bottom:4rem; }
.of-section-head h2 { font-size:clamp(3.5rem,8vw,7rem); line-height:.78; text-transform:uppercase; letter-spacing:-.03em; margin:0; }
.of-section-head p,.of-section-head>a { color:inherit; max-width:300px; justify-self:end; text-decoration:none; }
.of-gateway-grid { display:grid; grid-template-columns:1fr 1.3fr 1fr; gap:1rem; align-items:center; }
.of-gateway { height:58vh; min-height:440px; position:relative; overflow:hidden; color:#fff; }
.of-gateway-tall { height:72vh; }
.of-gateway img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1); filter:saturate(.75); }
.of-gateway:hover img { transform:scale(1.035); filter:saturate(1); }
.of-gateway>span { position:absolute; inset:auto 0 0; padding:2rem; background:linear-gradient(transparent,rgba(0,0,0,.8)); font:700 3rem/1 'Barlow Condensed'; text-transform:uppercase; }
.of-gateway small { display:block; font:600 .7rem/1.2 'Manrope'; letter-spacing:.12em; margin-top:.8rem; }
.of-dark { background:var(--of-black); color:#fff; }
.of-product-rail { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:#333; }
.of-product-card { background:#111; min-width:0; }
.of-product-image { aspect-ratio:4/5; display:block; overflow:hidden; position:relative; background:#eee; }
.of-product-image img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }.of-product-image:hover img { transform:scale(1.025); }
.of-badge { position:absolute; top:1rem; left:1rem; padding:.4rem .6rem; background:var(--of-accent); color:#fff; font-size:.62rem; text-transform:uppercase; letter-spacing:.08em; }
.of-product-info { padding:1rem 1rem 1.5rem; display:grid; gap:.35rem; }
.of-product-info>a { color:#fff; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.of-product-code { color:#999; font-size:.65rem; letter-spacing:.08em; }.of-product-info strong { color:#fff; }
.of-product-price { display:flex; align-items:center; gap:.65rem; }.of-product-price del { color:#888; font-size:.78rem; }
.of-editorial { min-height:85vh; display:grid; grid-template-columns:1.25fr .75fr; background:var(--of-accent); }
.of-editorial-media img { width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.1); }
.of-editorial-copy { padding:7vw; align-self:center; color:#fff; }
.of-editorial-copy h2 { font-size:clamp(4rem,8vw,8rem); line-height:.75; text-transform:uppercase; letter-spacing:-.04em; }
.of-editorial-copy p { max-width:480px; font-size:1.08rem; line-height:1.8; margin:2rem 0; }
.of-movement-list { border-top:1px solid #aaa; }
.of-movement-list a { display:grid; grid-template-columns:60px 1fr auto; align-items:center; min-height:104px; color:#111; border-bottom:1px solid #aaa; text-decoration:none; transition:.2s; }
.of-movement-list a:hover { padding-left:1rem; color:var(--of-accent); }
.of-movement-list span { font-size:.7rem; }.of-movement-list strong { font:700 clamp(2rem,5vw,4.2rem)/1 'Barlow Condensed'; text-transform:uppercase; }.of-movement-list em { font-style:normal; font-size:.72rem; text-transform:uppercase; }
.of-brands { padding:5rem 0; overflow:hidden; background:#d8ff00; text-align:center; }
.of-brand-track { display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem 2.4rem; padding:2rem 4vw 0; }
.of-brand-track a { color:#111; text-decoration:none; font:800 clamp(2rem,5vw,4.6rem)/1 'Barlow Condensed'; text-transform:uppercase; }
.of-services { padding:6rem 5vw; display:grid; grid-template-columns:repeat(3,1fr); gap:4rem; background:#fff; }
.of-services span { color:var(--of-accent); font-size:.7rem; }.of-services h3 { font-size:2rem; text-transform:uppercase; }.of-services p { color:#666; }
.of-footer { background:#090909; color:#fff; padding:6rem 5vw 1.5rem; }.of-footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:5vw; }.of-footer-grid img { margin-bottom:1.5rem; }.of-footer h4 { text-transform:uppercase; font-size:.75rem; letter-spacing:.12em; color:#888; }.of-footer a { display:block; color:#fff; text-decoration:none; padding:.3rem 0; }.of-footer p { color:#aaa; max-width:360px; line-height:1.7; }.of-outline-link { border-bottom:1px solid #555; padding-bottom:.8rem!important; }.of-footer-base { display:flex; justify-content:space-between; border-top:1px solid #333; margin-top:5rem; padding-top:1.5rem; color:#777; font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; }
.of-reveal { opacity:0; transform:translateY(28px); transition:opacity .65s,transform .65s; }.of-reveal.is-visible { opacity:1; transform:none; }
.of-shop-grid { padding-top:2rem; }.oe_product_cart { border:0!important; background:#fff!important; }.oe_product_image { overflow:hidden; }.oe_product_image img { transition:transform .4s; }.oe_product:hover .oe_product_image img { transform:scale(1.025); }.of-product-detail { padding-top:3rem; }
.of-size-unavailable { opacity:.34; cursor:not-allowed!important; text-decoration:line-through; }.of-size-unavailable input { pointer-events:none; }.of-size-unavailable .radio_input_value { color:#777!important; }
@keyframes ofHero { from { transform:scale(1.06); opacity:.6; } to { transform:scale(1); opacity:1; } }
@keyframes ofMegaIn { from { opacity:0; transform:translateY(-12px); } to { opacity:1; transform:none; } }
@media(max-width:991px){
  .of-utility { padding:0 1rem; }.of-nav { height:68px; padding:0 1rem; position:relative; }.of-desktop-nav { display:none; }.of-actions { display:flex!important; position:absolute; right:1rem; top:13px; z-index:2; margin:0; }.of-menu-toggle { display:block; }.of-mobile-menu { display:flex; position:fixed; inset:98px 0 0; z-index:999; background:var(--of-black); color:#fff; flex-direction:column; padding:2rem; transform:translateX(100%); transition:transform .25s; }.of-mobile-menu[aria-hidden="false"] { transform:none; }.of-mobile-menu a { color:#fff; text-decoration:none; font-size:2.6rem; line-height:1.35; text-transform:uppercase; border-bottom:1px solid #333; }.of-menu-open { overflow:hidden; }
  .of-hero { min-height:78vh; }.of-hero-copy { padding:0 1.25rem 4rem; width:100%; }.of-hero-copy h1 { font-size:5.4rem; }.of-hero-actions { flex-direction:column; align-items:stretch; }.of-hero-actions .of-btn { width:100%; justify-content:center; }.of-scroll-cue { display:none; }
  .of-section { padding:5rem 1.25rem; }.of-section-head { grid-template-columns:1fr; margin-bottom:2.5rem; }.of-section-head p,.of-section-head>a { justify-self:start; }.of-section-head h2 { font-size:4.2rem; }
  .of-gateway-grid { display:flex; overflow:auto; scroll-snap-type:x mandatory; margin-right:-1.25rem; }.of-gateway,.of-gateway-tall { min-width:82vw; height:62vh; min-height:430px; scroll-snap-align:start; }.of-gateway>span { font-size:2.4rem; }
  .of-product-rail { display:flex; overflow:auto; scroll-snap-type:x mandatory; }.of-product-card { min-width:74vw; scroll-snap-align:start; }
  .of-editorial { grid-template-columns:1fr; }.of-editorial-media { height:62vh; }.of-editorial-copy { padding:4rem 1.25rem; }.of-editorial-copy h2 { font-size:5rem; }
  .of-movement-list a { grid-template-columns:40px 1fr; }.of-movement-list em { display:none; }.of-services { grid-template-columns:1fr; padding:4rem 1.25rem; gap:2rem; }.of-footer { padding:4rem 1.25rem 1.5rem; }.of-footer-grid { grid-template-columns:1fr 1fr; gap:3rem 1.5rem; }
}
@media(max-width:575px){ .of-icon { width:36px; }.of-logo img { width:110px; }.of-footer-grid { grid-template-columns:1fr; }.of-footer-base { flex-direction:column; gap:.5rem; }.of-brand-track { justify-content:flex-start; overflow:auto; flex-wrap:nowrap; }.of-brand-track a { white-space:nowrap; } }
@media(prefers-reduced-motion:reduce){ * { animation:none!important; transition:none!important; scroll-behavior:auto!important; }.of-reveal { opacity:1; transform:none; } }
