*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#050505;color:#f2f0eb;font-family:"DM Sans",Arial,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.site-header{position:fixed;z-index:20;top:0;left:0;right:0;height:78px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;background:rgba(5,5,5,.9);border-bottom:1px solid #1d1d1b;backdrop-filter:blur(12px)}.brand{display:flex;align-items:center}.brand img{width:118px;height:auto}.desktop-nav{display:flex;gap:42px;margin-left:auto;margin-right:44px}.desktop-nav a,.header-cta{font-size:10px;letter-spacing:.2em}.desktop-nav a{color:#bcb9b2}.desktop-nav a:hover{color:#fff}.header-cta{border:1px solid #aaa69f;padding:12px 16px}.header-cta span{margin-left:9px}.menu-toggle{display:none;background:none;border:0}.mobile-menu{display:none}.hero{position:relative;margin-top:78px;background:#080808;overflow:hidden}.hero-frame{width:100%;display:flex;justify-content:center;background:#080808}.hero-image{width:100%;height:min(78vh,820px);object-fit:cover;object-position:center 48%}.hero-gradient{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,4,4,.78) 0%,rgba(4,4,4,.38) 35%,rgba(4,4,4,.04) 72%),linear-gradient(0deg,rgba(4,4,4,.75),transparent 48%)}.hero-content{position:absolute;left:7vw;bottom:10%;max-width:600px}.eyebrow{margin:0 0 15px;font-size:9px;letter-spacing:.28em;color:#8f8b84}.hero h1,.section h2,.shop h2,.about h2,.materials h2{margin:0;font-family:"Playfair Display",Georgia,serif;font-weight:500;letter-spacing:.01em;line-height:.94}.hero h1{font-size:clamp(48px,6.3vw,92px)}em{font-style:normal;color:#bdb9b0}.hero-copy{font-size:14px;color:#d2cec7;margin:23px 0 28px}.outline-btn{display:inline-flex;align-items:center;gap:28px;border:1px solid rgba(255,255,255,.65);padding:13px 17px;font-size:9px;letter-spacing:.2em;transition:.25s}.outline-btn:hover{background:#eeeae2;color:#080808}.hero-index{position:absolute;right:5vw;bottom:5%;font-size:9px;letter-spacing:.2em;color:#8b877f}.section{padding:120px 7vw}.collection{background:#070707}.section-heading,.shop-head,.materials-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:58px}.section-heading h2,.shop h2,.about h2,.materials h2{font-size:clamp(44px,5.7vw,78px)}.section-heading>p,.shop-head>p,.materials-head>p{max-width:290px;color:#77736d;font-size:12px;margin:0 0 5px}.product-editorial{display:grid;grid-template-columns:1.25fr .62fr .72fr;grid-template-rows:250px 250px 190px;gap:14px}.product-main{grid-row:1/4;min-height:0}.product-main img,.product-side img{width:100%;height:100%;object-fit:cover}.product-main img{object-position:center center}.product-info{grid-column:2/4;grid-row:1;padding:22px 8px 12px 24px;border-left:1px solid #242422}.product-info h3{font-family:"Playfair Display",Georgia,serif;font-size:40px;line-height:.96;font-weight:500;margin:0 0 18px}.product-desc{color:#8c8881;font-size:12px;max-width:430px;margin:0 0 24px}.side-one{grid-column:2;grid-row:2}.side-two{grid-column:3;grid-row:2}.side-three{grid-column:2/4;grid-row:3}.quality-band{background:#0b0b0b;position:relative;border-top:1px solid #1b1b19;border-bottom:1px solid #1b1b19}.quality-inner{padding:95px 7vw}.quality-inner h2{font-family:"Playfair Display",Georgia,serif;font-size:clamp(36px,4.7vw,66px);font-weight:500;margin:0 0 48px}.quality-grid{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid #282825}.quality-grid div{padding:22px 14px;border-right:1px solid #242421;min-height:100px}.quality-grid div:first-child{padding-left:0}.quality-grid div:last-child{border-right:0}.quality-grid b{display:block;font-size:8px;letter-spacing:.18em;color:#68645e;margin-bottom:13px}.quality-grid span{font-size:11px;color:#d5d1ca}.materials{background:#080808;border-top:1px solid #1b1b19}.materials-head{margin-bottom:55px}.material-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.material-card{min-height:260px;border:1px solid #242421;padding:28px;display:flex;flex-direction:column;justify-content:space-between;background:#0a0a0a}.material-number{font-size:9px;letter-spacing:.18em;color:#66625c}.material-kicker{font-size:9px;letter-spacing:.23em;color:#77736d;margin:0 0 8px}.material-card h3{font-family:"Playfair Display",Georgia,serif;font-size:34px;font-weight:500;margin:0 0 16px}.material-card h3 em{color:#aaa59d}.material-card p:last-child{font-size:12px;color:#85817a;max-width:430px;margin:0}.about{display:grid;grid-template-columns:1fr 1fr;gap:8vw;background:#080808;border-top:1px solid #1b1b19}.about .eyebrow{color:#77736d}.about h2{color:#f0ede7}.about h2 em{color:#aaa69e}.about-copy{align-self:end;max-width:520px;font-size:17px;line-height:1.7;color:#a6a19a}.about-copy p{margin:0 0 20px}.shop{background:#060606}.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.shop-card{min-height:116px;border:1px solid #282825;display:flex;align-items:center;gap:16px;padding:22px;transition:.25s;background:#080808}.shop-card:hover{border-color:#6e6a63;background:#0d0d0d}.market-icon{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;background:#050505;border:1px solid #353530}.market-icon img{width:29px;height:29px}.shop-card>span:nth-child(2){display:flex;flex-direction:column}.shop-card small{font-size:7px;letter-spacing:.18em;color:#68645e;margin-bottom:4px}.shop-card strong{font-size:14px;font-weight:500}.shop-card>b{margin-left:auto;font-size:17px;font-weight:400;color:#a9a49c}.footer{padding:62px 7vw 25px;background:#040404;border-top:1px solid #1d1d1b}.footer-signature{display:flex;align-items:center;gap:28px;justify-content:center}.footer-signature img{width:130px;height:auto}.footer-line{height:1px;background:#252522;flex:1;max-width:260px}.footer-tagline{text-align:center;font-size:8px;letter-spacing:.27em;color:#706c65;margin:16px 0 46px}.footer-links{display:grid;grid-template-columns:1fr 1fr;gap:80px;max-width:720px;margin:0 auto}.footer-links>div{display:flex;flex-direction:column;gap:13px}.footer-links small{font-size:8px;letter-spacing:.22em;color:#5f5b55;margin-bottom:5px}.footer-links a{font-size:11px;color:#d0ccc5;display:flex;align-items:center;gap:10px}.footer-links a img{width:16px;height:16px}.footer-links a span{color:#68645e;margin-left:3px}.footer-bottom{margin-top:50px;padding-top:17px;border-top:1px solid #1c1c1a;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.18em;color:#5f5b55}@media(max-width:900px){.site-header{height:70px;padding:0 5vw}.brand img{width:100px}.desktop-nav,.header-cta{display:none}.menu-toggle{display:flex;width:36px;height:30px;flex-direction:column;justify-content:center;gap:7px;padding:0}.menu-toggle i{display:block;width:24px;height:1px;background:#eee}.mobile-menu{position:fixed;z-index:19;top:70px;left:0;right:0;display:flex;flex-direction:column;background:#050505;border-bottom:1px solid #222;transform:translateY(-130%);transition:.35s;padding:14px 5vw}.mobile-menu.open{transform:translateY(0)}.mobile-menu a{padding:15px 0;font-size:11px;letter-spacing:.18em;border-bottom:1px solid #1d1d1b}.mobile-menu a:last-child{border-bottom:0}.hero{margin-top:70px}.hero-image{height:auto;aspect-ratio:1/1;object-fit:cover;object-position:center center}.hero-gradient{background:linear-gradient(0deg,rgba(4,4,4,.88) 0%,rgba(4,4,4,.18) 55%,rgba(4,4,4,.04) 100%)}.hero-content{left:5vw;right:5vw;bottom:7%;max-width:520px}.hero h1{font-size:clamp(37px,10vw,60px)}.hero-copy{font-size:12px;margin:15px 0 20px}.hero-index{display:none}.section{padding:82px 5vw}.section-heading,.shop-head,.materials-head{display:block;margin-bottom:42px}.section-heading>p,.shop-head>p,.materials-head>p{margin-top:17px}.section-heading h2,.shop h2,.about h2,.materials h2{font-size:46px}.product-editorial{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto auto;gap:10px}.product-main{grid-column:1/3;grid-row:1;min-height:0}.product-info{grid-column:1/3;grid-row:2;padding:24px 0 18px;border-left:0}.product-info h3{font-size:35px}.side-one{grid-column:1;grid-row:3;min-height:0}.side-two{grid-column:2;grid-row:3;min-height:0}.side-three{grid-column:1/3;grid-row:4;min-height:0}.product-side img{height:auto}.materials{padding-top:82px}.material-grid{grid-template-columns:1fr;gap:10px}.material-card{min-height:230px;padding:24px}.quality-inner{padding:78px 5vw}.quality-inner h2{font-size:38px;margin-bottom:38px}.quality-grid{grid-template-columns:repeat(2,1fr)}.quality-grid div{border-bottom:1px solid #242421}.quality-grid div:nth-child(2n){border-right:0}.quality-grid div:nth-last-child(-n+2){border-bottom:0}.about{display:block}.about-copy{margin-top:42px;font-size:15px}.shop-grid{grid-template-columns:1fr}.shop-card{min-height:94px}.footer{padding-left:5vw;padding-right:5vw}.footer-signature{gap:14px}.footer-signature img{width:105px}.footer-line{max-width:none}.footer-links{grid-template-columns:1fr;gap:35px}.footer-bottom{gap:20px;line-height:1.5;flex-wrap:wrap}}@media(max-width:400px){.hero h1{font-size:36px}.hero-copy{font-size:11px}.section-heading h2,.shop h2,.about h2,.materials h2{font-size:42px}.quality-grid span{font-size:10px}.material-card h3{font-size:30px}}

/* V3 editorial refinements */
.campaign-feature{background:#060606;border-top:1px solid #171715;border-bottom:1px solid #171715}
.campaign-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:52px}
.campaign-head h2{font-size:clamp(46px,5.7vw,78px)}
.campaign-head>p{max-width:310px;color:#77736d;font-size:12px;margin:0 0 5px}
.campaign-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,.7fr);gap:14px;align-items:stretch}
.campaign-image-wrap{background:#0a0a0a;overflow:hidden;min-height:0}
.campaign-image-wrap img{width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;object-position:center;transition:transform .6s ease}
.campaign-image-wrap:hover img{transform:scale(1.012)}
.campaign-note{border-left:1px solid #242421;padding:34px 10px 28px 30px;display:flex;flex-direction:column;justify-content:flex-end;min-height:100%}
.campaign-mark{width:44px;height:44px;border:1px solid #363632;display:grid;place-items:center;font-family:"Playfair Display",Georgia,serif;font-size:22px;margin-bottom:auto;color:#e7e3dc}
.campaign-note h3{font-family:"Playfair Display",Georgia,serif;font-size:38px;line-height:.98;font-weight:500;margin:0 0 20px}
.campaign-note>p:not(.eyebrow){font-size:12px;line-height:1.75;color:#85817a;max-width:360px;margin:0 0 25px}
.text-link{display:inline-flex;gap:18px;align-items:center;font-size:9px;letter-spacing:.2em;color:#d8d4cd;border-bottom:1px solid #4a4741;padding-bottom:10px;width:max-content}
.text-link span{font-size:14px}
.material-card h3{font-size:30px;line-height:1.02}
.footer{padding:70px 7vw 24px;background:#030303}
.footer-top{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:start}
.footer-brand{padding-top:3px}
.footer-wordmark{font-family:"Playfair Display",Georgia,serif;font-size:clamp(48px,6vw,82px);line-height:.9;letter-spacing:.04em;margin:0;color:#efede8}
.footer-tagline{text-align:left;font-size:8px;letter-spacing:.28em;color:#6d6962;margin:18px 0 0}
.footer-links{display:grid;grid-template-columns:1fr 1fr;gap:60px;max-width:none;margin:0}
.footer-links>div{display:flex;flex-direction:column;gap:13px}
.footer-links small{font-size:8px;letter-spacing:.22em;color:#5f5b55;margin-bottom:5px}
.footer-links a{font-size:11px;color:#d0ccc5;display:flex;align-items:center;gap:10px}
.footer-links a img{width:16px;height:16px}
.footer-links a span{color:#68645e;margin-left:3px}
.footer-rule{height:1px;background:#1b1b19;margin-top:58px}
.footer-bottom{margin-top:17px;padding-top:0;border-top:0;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.18em;color:#5f5b55}

@media(max-width:900px){
  .campaign-head{display:block;margin-bottom:36px}
  .campaign-head>p{margin-top:17px}
  .campaign-layout{grid-template-columns:1fr;gap:0}
  .campaign-image-wrap img{aspect-ratio:1/1;object-fit:cover}
  .campaign-note{border-left:0;border-top:1px solid #242421;padding:24px 0 0;min-height:300px}
  .campaign-mark{margin-bottom:38px}
  .campaign-note h3{font-size:34px}
  .footer-top{grid-template-columns:1fr;gap:46px}
  .footer-brand{padding-top:0}
  .footer-wordmark{font-size:54px}
  .footer-tagline{text-align:left}
  .footer-links{grid-template-columns:1fr 1fr;gap:28px}
  .footer-bottom{flex-wrap:wrap;gap:15px}
}
@media(max-width:500px){
  .campaign-feature{padding-top:74px;padding-bottom:74px}
  .campaign-image-wrap img{aspect-ratio:1/1}
  .footer-links{grid-template-columns:1fr;gap:34px}
}
/* Collection fifth image: front/back stairs campaign integrated into the product gallery */
.product-feature-wide{grid-column:2/4;grid-row:4;min-height:0;overflow:hidden;background:#090909}
.product-feature-wide img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center}
@media(max-width:900px){
  .product-feature-wide{grid-column:1/3;grid-row:5;min-height:0}
  .product-feature-wide img{height:auto;aspect-ratio:1/1;object-fit:cover}
}

/* V5 collection layout refinement */
.product-editorial{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(0,.72fr) minmax(0,.72fr);
  grid-template-rows:auto 230px 230px 230px;
  gap:14px;
  align-items:stretch;
}
.product-main{grid-column:1;grid-row:1 / 5;min-height:0;overflow:hidden;background:#0a0a0a}
.product-main img{width:100%;height:100%;object-fit:cover;object-position:center center}
.product-info{grid-column:2 / 4;grid-row:1;padding:20px 8px 28px 26px;border-left:1px solid #242422;align-self:start}
.product-info h3{font-size:38px;margin-bottom:16px}
.product-desc{max-width:500px}
.side-one{grid-column:2;grid-row:2;min-height:0;overflow:hidden}
.side-two{grid-column:3;grid-row:2;min-height:0;overflow:hidden}
.side-three{grid-column:2 / 4;grid-row:3;min-height:0;overflow:hidden}
.product-feature-wide{grid-column:2 / 4;grid-row:4;min-height:0;overflow:hidden;background:#090909}
.product-side img,.product-feature-wide img{width:100%;height:100%;object-fit:cover;display:block}
.side-one img{object-position:center center}
.side-two img{object-position:center center}
.side-three img{object-position:center center}
.product-feature-wide img{object-position:center center}
.product-main,.product-side,.product-feature-wide{transition:opacity .25s ease}
.product-main:hover,.product-side:hover,.product-feature-wide:hover{opacity:.96}

@media(max-width:900px){
  .product-editorial{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto auto auto auto auto;
    gap:10px;
  }
  .product-main{grid-column:1 / 3;grid-row:1;height:auto;aspect-ratio:4 / 5}
  .product-main img{height:100%;object-fit:cover}
  .product-info{grid-column:1 / 3;grid-row:2;padding:22px 0 24px;border-left:0;border-top:1px solid #1e1e1c;border-bottom:1px solid #1e1e1c}
  .product-info h3{font-size:34px;margin-bottom:14px}
  .product-desc{font-size:11px;margin-bottom:20px}
  .side-one{grid-column:1;grid-row:3;height:auto;aspect-ratio:3 / 4}
  .side-two{grid-column:2;grid-row:3;height:auto;aspect-ratio:3 / 4}
  .side-three{grid-column:1 / 3;grid-row:4;height:auto;aspect-ratio:16 / 10}
  .product-feature-wide{grid-column:1 / 3;grid-row:5;height:auto;aspect-ratio:1 / 1}
  .product-side img,.product-feature-wide img{height:100%;object-fit:cover}
}

@media(max-width:500px){
  .product-editorial{gap:9px}
  .product-main{aspect-ratio:4 / 5}
  .product-info{padding-top:20px;padding-bottom:22px}
  .product-info h3{font-size:31px}
  .outline-btn{padding:12px 14px}
  .side-one,.side-two{aspect-ratio:1 / 1.22}
  .side-three{aspect-ratio:16 / 10}
  .product-feature-wide{aspect-ratio:1 / 1}
}

/* V6 — clean, balanced collection gallery: simple side-by-side presentation */
.product-editorial{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:auto;
  gap:16px;
  align-items:stretch;
}
.product-info{
  grid-column:1 / -1;
  grid-row:auto;
  padding:0 0 28px;
  border-left:0;
  border-bottom:1px solid #22221f;
}
.product-info h3{font-size:clamp(38px,4vw,58px);}
.product-main,.side-one,.side-two,.side-three,.product-feature-wide{
  grid-column:auto;
  grid-row:auto;
  min-height:0;
  overflow:hidden;
  background:#090909;
}
.product-main,.side-one,.side-two,.side-three{aspect-ratio:4/3;}
.product-main img,.product-side img{width:100%;height:100%;object-fit:cover;display:block;}
.product-main img{object-position:center center;}
.side-one img,.side-two img,.side-three img{object-position:center center;}
.product-feature-wide{grid-column:1 / -1;aspect-ratio:2/1;}
.product-feature-wide img{width:100%;height:100%;object-fit:cover;display:block;object-position:center center;}
@media(max-width:900px){
  .product-editorial{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .product-info{grid-column:1 / -1;padding:20px 0 22px;}
  .product-main,.side-one,.side-two,.side-three{aspect-ratio:1/1.12;}
  .product-feature-wide{grid-column:1 / -1;aspect-ratio:2/1;}
}
@media(max-width:500px){
  .product-editorial{gap:8px;}
  .product-main,.side-one,.side-two,.side-three{aspect-ratio:1/1.15;}
  .product-feature-wide{aspect-ratio:2/1;}
}

/* FINAL COLLECTION — editorial presentation, original aspect ratios preserved */
.collection-product{display:block}
.collection-intro{position:relative;padding:0 0 34px;border-top:1px solid #242421;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.55fr);column-gap:60px;align-items:end}
.collection-intro .eyebrow{padding-top:16px;grid-column:1}
.collection-intro h3{grid-column:1;font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:clamp(42px,5vw,72px);line-height:.92;margin:16px 0 20px;letter-spacing:.01em}
.collection-intro .product-desc{grid-column:2;grid-row:1 / span 2;align-self:end;max-width:360px;color:#85817a;font-size:12px;line-height:1.75;margin:0 0 22px}
.product-specs{grid-column:1;display:flex;flex-wrap:wrap;gap:8px 18px;margin:0 0 22px;color:#aaa69f;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.product-specs span{position:relative}.product-specs span+span:before{content:"/";position:absolute;left:-11px;color:#4d4a45}
.collection-intro .outline-btn{grid-column:1;width:max-content}
.collection-gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;align-items:start}
.collection-photo{margin:0;background:#090909;overflow:visible}
.collection-photo img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;object-position:center center}
.collection-photo img{transition:opacity .25s ease}.collection-photo:hover img{opacity:.95}
.photo-a{grid-column:1 / span 7}.photo-b{grid-column:8 / span 5}.photo-c{grid-column:1 / span 5}.photo-d{grid-column:6 / span 7}.photo-e{grid-column:1 / -1;max-width:820px;justify-self:center}.photo-f{grid-column:1 / -1;max-width:980px;justify-self:center}.photo-g{grid-column:1 / -1;max-width:980px;justify-self:center}
@media(max-width:900px){
  .collection-product{display:block}
  .collection-intro{display:block;padding:0 0 30px;border-top:0}
  .collection-intro .eyebrow{padding-top:0}
  .collection-intro h3{font-size:clamp(40px,9vw,58px);margin:15px 0 18px}
  .collection-intro .product-desc{max-width:520px;margin:0 0 20px}
  .collection-intro .outline-btn{margin-top:2px}
  .collection-gallery{grid-template-columns:1fr;gap:14px}
  .photo-a,.photo-b,.photo-c,.photo-d,.photo-e,.photo-f,.photo-g{grid-column:1;max-width:none}
}
@media(max-width:500px){
  .collection-gallery{gap:10px}
  .collection-intro{padding-bottom:24px}
  .collection-intro h3{font-size:39px}
  .product-specs{gap:7px 15px;font-size:8px}
}


/* TYPHON V5.2 — conservative cinematic motion, built on the verified V4 files */
html { scroll-behavior: smooth; }

/* Gentle first-load movement: content remains visible even if animation is unsupported. */
.hero-image {
  animation: typhonHeroSettle 1.1s ease-out both;
}
.hero-content .eyebrow,
.hero-content h1,
.hero-content .hero-copy,
.hero-content .outline-btn {
  animation: typhonTextSettle .7s ease-out both;
}
.hero-content h1 { animation-delay: .08s; }
.hero-content .hero-copy { animation-delay: .16s; }
.hero-content .outline-btn { animation-delay: .24s; }

@keyframes typhonHeroSettle {
  from { opacity: .88; transform: scale(1.012); filter: brightness(.94); }
  to   { opacity: 1; transform: scale(1); filter: brightness(1); }
}
@keyframes typhonTextSettle {
  from { opacity: .82; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Editorial photo finish: no fixed dimensions, no crop rules, no image ratio changes. */
.collection-photo { position: relative; overflow: visible; }
.collection-photo img {
  transition: filter .55s ease, transform .75s cubic-bezier(.2,.7,.2,1);
}
.collection-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(108deg, transparent 34%, rgba(235,232,224,.13) 49%, transparent 64%);
  transform: translateX(-120%);
}
.collection-photo:hover img {
  filter: brightness(1.035);
  transform: none;
}
.collection-photo:hover::after {
  opacity: 1;
  transform: translateX(120%);
  transition: transform 1s ease, opacity .2s ease;
}

/* Restrained silver glint on interactive controls. */
.outline-btn, .header-cta, .shop-card {
  position: relative;
  overflow: hidden;
}
.outline-btn::after, .header-cta::after, .shop-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(235,232,224,.12) 50%, transparent 65%);
  transform: translateX(-120%);
}
.outline-btn:hover::after, .header-cta:hover::after, .shop-card:hover::after {
  opacity: 1;
  transform: translateX(120%);
  transition: transform .85s ease, opacity .2s ease;
}
.shop-card, .material-card {
  transition: transform .3s ease, border-color .3s ease;
}
.shop-card:hover, .material-card:hover { transform: translateY(-2px); }
.brand img { transition: filter .35s ease; }
.brand:hover img { filter: drop-shadow(0 0 7px rgba(220,216,206,.24)); }

@media (max-width: 900px) {
  /* Touch screens should not keep hover transforms after a tap. */
  .collection-photo:hover img, .shop-card:hover, .material-card:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-image, .hero-content .eyebrow, .hero-content h1,
  .hero-content .hero-copy, .hero-content .outline-btn { animation: none !important; }
  .collection-photo img, .shop-card, .material-card, .brand img { transition: none !important; }
}

/* V5.2.1 safety: collection photos always retain their complete native frame. */
.collection-photo img { width:100%; height:auto; object-fit:contain; transform:none !important; }
.collection-photo:hover img { transform:none !important; }


/* ==========================================================
   TYPHON CINEMATIC MOTION — V6
   Refined entrance, scroll reveals and restrained silver glints.
   No image assets are replaced and collection image proportions
   remain native (width:100%, height:auto, object-fit:contain).
   ========================================================== */

:root {
  --typhon-silver: rgba(224, 220, 211, .72);
  --typhon-glint: rgba(235, 232, 224, .16);
}

/* A quiet metallic reading indicator */
.scroll-progress {
  position: fixed;
  z-index: 60;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(90deg, #77736b 0%, #e8e4da 48%, #8d8980 100%);
  box-shadow: 0 0 9px rgba(220, 216, 205, .22);
  pointer-events: none;
  will-change: transform;
}

.site-header {
  transition: background .45s ease, border-color .45s ease,
              box-shadow .45s ease, height .45s ease;
}
.site-header.is-scrolled {
  background: rgba(4, 4, 4, .96);
  border-bottom-color: rgba(220, 216, 205, .18);
  box-shadow: 0 8px 30px rgba(0, 0, 0, .22);
}

/* Cinematic hero atmosphere */
.hero {
  isolation: isolate;
}
.hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  opacity: .34;
  background:
    radial-gradient(ellipse at 72% 22%, rgba(220, 216, 205, .12), transparent 32%),
    linear-gradient(112deg, transparent 28%, rgba(225, 221, 212, .055) 49%, transparent 68%);
  background-size: 100% 100%, 230% 100%;
  background-position: center, -150% center;
  animation: heroAtmosphere 9s ease-in-out 1.2s infinite;
}
.hero-content { z-index: 2; }
.hero-image {
  transform-origin: center center;
  will-change: transform;
}
.hero-content .eyebrow {
  letter-spacing: .34em;
}
.hero h1 {
  text-shadow: 0 5px 32px rgba(0, 0, 0, .25);
}
.hero .outline-btn {
  box-shadow: 0 0 0 0 rgba(230, 226, 216, 0);
  transition: color .35s ease, background .35s ease, border-color .35s ease,
              box-shadow .45s ease, transform .35s ease;
}
.hero .outline-btn:hover {
  box-shadow: 0 0 24px rgba(230, 226, 216, .10);
  transform: translateY(-2px);
}

/* Scroll entrance: activated only after JS has successfully initialized. */
.motion-ready .reveal-item {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  transition:
    opacity .9s cubic-bezier(.2,.65,.25,1),
    transform 1s cubic-bezier(.2,.65,.25,1);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
.motion-ready .reveal-item.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* Photo glint runs once as each original image enters the viewport. */
.collection-photo {
  position: relative;
  isolation: isolate;
}
.collection-photo::before {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(
    112deg,
    transparent 34%,
    rgba(240, 237, 229, .035) 43%,
    rgba(240, 237, 229, .19) 50%,
    rgba(240, 237, 229, .045) 57%,
    transparent 66%
  );
  transform: translateX(-125%);
}
.collection-photo.shine-pass::before {
  animation: editorialGlint 1.65s cubic-bezier(.22,.65,.25,1) .12s 1 both;
}
.collection-photo img {
  transition: filter .7s ease;
  backface-visibility: hidden;
}
.collection-photo:hover img {
  filter: brightness(1.045) contrast(1.015);
}

/* A very restrained moving sheen on interactive surfaces */
.shop-card,
.material-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform .45s cubic-bezier(.2,.65,.25,1),
              border-color .45s ease, background .45s ease;
}
.shop-card::before,
.material-card::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -10% auto -10% -55%;
  width: 42%;
  pointer-events: none;
  opacity: 0;
  transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(231, 227, 217, .09), transparent);
}
.shop-card > *,
.material-card > * {
  position: relative;
  z-index: 1;
}
.shop-card.surface-glint::before,
.material-card.surface-glint::before {
  animation: surfaceGlint 1.5s ease-out .35s 1 both;
}
.shop-card:hover,
.material-card:hover {
  transform: translateY(-3px);
  border-color: rgba(208, 203, 192, .48);
}

/* Typography and section dividers receive a soft metallic accent */
.section-heading h2 em,
.materials h2 em,
.about h2 em,
.shop h2 em {
  transition: color .65s ease, text-shadow .65s ease;
}
.section-heading.is-visible h2 em,
.materials-head.is-visible h2 em,
.shop-head.is-visible h2 em,
.about > div.is-visible h2 em {
  color: #d0cbc1;
  text-shadow: 0 0 22px rgba(214, 209, 198, .12);
}
.quality-band {
  overflow: hidden;
}
.quality-band::before {
  content: "";
  position: absolute;
  top: -35%;
  bottom: -35%;
  left: -45%;
  width: 28%;
  pointer-events: none;
  transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(225, 221, 212, .045), transparent);
  animation: qualitySweep 11s ease-in-out 2s infinite;
}
.quality-inner { position: relative; z-index: 1; }

@keyframes heroAtmosphere {
  0%, 100% { background-position: center, -150% center; opacity: .18; }
  48% { background-position: center, 150% center; opacity: .42; }
  52% { background-position: center, 150% center; opacity: .12; }
}
@keyframes editorialGlint {
  0% { opacity: 0; transform: translateX(-125%); }
  12% { opacity: 1; }
  82% { opacity: .8; }
  100% { opacity: 0; transform: translateX(125%); }
}
@keyframes surfaceGlint {
  0% { opacity: 0; left: -55%; }
  18% { opacity: 1; }
  100% { opacity: 0; left: 125%; }
}
@keyframes qualitySweep {
  0%, 68%, 100% { left: -45%; opacity: 0; }
  74% { opacity: .8; }
  91% { left: 125%; opacity: .5; }
}

@media (max-width: 900px) {
  .hero::after { animation-duration: 12s; opacity: .22; }
  .motion-ready .reveal-item {
    transform: translate3d(0, 18px, 0);
    transition-duration: .75s;
  }
  .shop-card:hover,
  .material-card:hover { transform: none; }
  .collection-photo:hover img { filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-progress { display: none; }
  .hero::after,
  .quality-band::before,
  .collection-photo.shine-pass::before,
  .shop-card.surface-glint::before,
  .material-card.surface-glint::before {
    animation: none !important;
  }
  .motion-ready .reveal-item {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .site-header,
  .shop-card,
  .material-card,
  .collection-photo img {
    transition: none !important;
  }
}


/* ==========================================================
   TYPHON V7 — MOBILE WIDTH REPAIR + REPEATING CINEMATIC MOTION
   ========================================================== */
html, body {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  overflow-x: clip;
}
body { position: relative; }
main { display: block; width: 100%; max-width: 100%; min-width: 0; margin: 0; }
main > section, .hero, .collection, .materials, .quality-band,
.about, .shop, .footer, .hero-frame, .collection-gallery {
  width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box;
}
.site-header { width: 100%; max-width: 100%; box-sizing: border-box; }
.hero-frame, .hero-image { min-width: 0; }
.hero-image { display:block; max-width:100%; }
.section { min-width:0; }
.collection-product, .collection-intro, .collection-gallery,
.collection-photo { min-width:0; }
.collection-photo img { width:100%; height:auto; max-width:100%; object-fit:contain; }

/* Cinematic opening title: short, elegant and never traps the page. */
.intro-screen {
  position: fixed; inset: 0; z-index: 1000;
  display:flex; align-items:center; justify-content:center;
  background: radial-gradient(ellipse at 50% 44%, #171614 0%, #080808 42%, #020202 100%);
  pointer-events:none;
  animation: introCurtain 2.35s cubic-bezier(.76,0,.2,1) .15s forwards;
}
.intro-mark {
  display:flex; flex-direction:column; align-items:center; gap:17px;
  opacity:0; transform:translateY(12px) scale(.97);
  animation: introBrand 1.05s cubic-bezier(.2,.7,.2,1) .12s forwards;
}
.intro-mark img { width:clamp(76px, 19vw, 128px); height:auto; filter:drop-shadow(0 0 18px rgba(224,218,205,.2)); }
.intro-mark span { color:#aaa59b; font-size:8px; letter-spacing:.42em; text-align:center; }
.intro-mark i { width:90px; height:1px; display:block; background:linear-gradient(90deg,transparent,#c9c1b3,transparent); transform:scaleX(0); transform-origin:center; animation:introLine .75s ease .65s forwards; }
@keyframes introBrand { to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes introLine { to { transform:scaleX(1); } }
@keyframes introCurtain { 0%,68% { opacity:1; visibility:visible; } 100% { opacity:0; visibility:hidden; } }

/* Dragon silhouette glides across the hero, behind the copy. */
.hero { isolation:isolate; }
.hero-frame { position:relative; z-index:0; }
.dragon-flight {
  position:absolute; z-index:1; top:8%; left:0;
  width:min(86vw, 1120px); height:auto; aspect-ratio:1200 / 360;
  opacity:0; pointer-events:none; overflow:visible;
  animation: dragonTraverse 24s ease-in-out 2.2s infinite;
}
.dragon-flight svg { width:100%; height:100%; display:block; overflow:visible; }
.hero-gradient { z-index:2; pointer-events:none; }
.hero-content, .hero-index { z-index:3; }
@keyframes dragonTraverse {
  0% { transform:translate3d(-115%, 12px, 0) scale(.82); opacity:0; }
  8% { opacity:.34; }
  18% { transform:translate3d(-35%, -4px, 0) scale(.94); opacity:.28; }
  38% { transform:translate3d(25%, 7px, 0) scale(1); opacity:.2; }
  47% { transform:translate3d(115%, -8px, 0) scale(.88); opacity:0; }
  100% { transform:translate3d(115%, -8px, 0) scale(.88); opacity:0; }
}

/* Repeating silver glints: one soft sweep, then a long quiet interval. */
.collection-photo { position:relative; isolation:isolate; overflow:hidden; }
.collection-photo::before {
  content:""; position:absolute; z-index:2; inset:0; pointer-events:none;
  opacity:0; transform:translateX(-135%);
  background:linear-gradient(108deg,transparent 35%,rgba(236,232,222,.035) 43%,rgba(236,232,222,.2) 50%,rgba(236,232,222,.045) 57%,transparent 65%);
}
.collection-photo.shine-pass::before {
  animation: repeatingPhotoGlint 8.8s ease-in-out .4s infinite;
}
@keyframes repeatingPhotoGlint {
  0%, 70%, 100% { opacity:0; transform:translateX(-135%); }
  73% { opacity:1; }
  88% { opacity:.65; transform:translateX(135%); }
  89% { opacity:0; transform:translateX(135%); }
}
.shop-card.surface-glint::before, .material-card.surface-glint::before {
  animation: repeatingSurfaceGlint 10s ease-in-out .8s infinite;
}
@keyframes repeatingSurfaceGlint {
  0%, 74%, 100% { opacity:0; left:-55%; }
  78% { opacity:.8; }
  94% { opacity:.45; left:125%; }
}

/* Hero image and copy arrive with a smoother staged reveal. */
.hero-image { animation: heroRevealV7 1.45s cubic-bezier(.2,.65,.25,1) both; }
.hero-content .eyebrow, .hero-content h1, .hero-content .hero-copy,
.hero-content .outline-btn {
  animation: heroCopyRevealV7 .95s cubic-bezier(.2,.65,.25,1) both;
}
.hero-content .eyebrow { animation-delay:.25s; }
.hero-content h1 { animation-delay:.4s; }
.hero-content .hero-copy { animation-delay:.58s; }
.hero-content .outline-btn { animation-delay:.74s; }
@keyframes heroRevealV7 {
  from { opacity:.58; transform:scale(1.035); filter:brightness(.72); }
  to { opacity:1; transform:scale(1); filter:brightness(1); }
}
@keyframes heroCopyRevealV7 {
  from { opacity:0; transform:translateY(18px); filter:blur(3px); }
  to { opacity:1; transform:translateY(0); filter:blur(0); }
}

@media (max-width: 900px) {
  html, body, main, main > section, .hero, .collection, .materials,
  .quality-band, .about, .shop, .footer { width:100% !important; max-width:100% !important; }
  .hero { margin-top:70px; }
  .hero-frame { width:100%; }
  .hero-image { width:100%; max-width:100%; height:auto; aspect-ratio:1 / 1; object-fit:cover; }
  .hero-content { left:5vw; right:5vw; max-width:90%; }
  .section { padding-left:5vw; padding-right:5vw; }
  .collection-gallery { display:grid; grid-template-columns:minmax(0,1fr); width:100%; }
  .collection-photo { width:100%; max-width:100%; }
  .collection-photo img { width:100%; height:auto; object-fit:contain; }
  .dragon-flight { top:10%; width:112vw; left:0; animation-duration:28s; }
}
@media (max-width: 500px) {
  .hero-content { max-width:90%; }
  .hero h1 { font-size:clamp(34px, 9.5vw, 48px); }
  .dragon-flight { top:7%; width:128vw; }
}
@media (prefers-reduced-motion: reduce) {
  .intro-screen { display:none !important; animation:none !important; }
  .intro-mark, .hero-image, .hero-content .eyebrow, .hero-content h1,
  .hero-content .hero-copy, .hero-content .outline-btn { animation:none !important; opacity:1 !important; transform:none !important; filter:none !important; }
  .dragon-flight, .collection-photo.shine-pass::before,
  .shop-card.surface-glint::before, .material-card.surface-glint::before,
  .quality-band::before { animation:none !important; }
  .motion-ready .reveal-item { opacity:1 !important; transform:none !important; transition:none !important; }
}


/* V8 — the dragon now roams around the full viewport, not just the hero. */
.dragon-flight {
  position:fixed !important;
  z-index:8 !important;
  top:0 !important;
  left:0 !important;
  width:clamp(190px, 30vw, 350px) !important;
  height:auto !important;
  aspect-ratio:440 / 260;
  opacity:0;
  pointer-events:none !important;
  overflow:visible !important;
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 12px rgba(205,194,176,.2));
  will-change:transform, opacity;
  animation:dragonPageOrbit 38s cubic-bezier(.42,0,.58,1) 1.4s infinite !important;
}
.dragon-flight svg {width:100%;height:100%;display:block;overflow:visible;}
@keyframes dragonPageOrbit {
  0%   {transform:translate3d(-125vw, 7vh, 0) rotate(12deg) scale(.72);opacity:0}
  7%   {opacity:.42}
  18%  {transform:translate3d(12vw, 13vh, 0) rotate(-2deg) scale(.9);opacity:.34}
  31%  {transform:translate3d(69vw, 8vh, 0) rotate(-17deg) scale(.78);opacity:.3}
  43%  {transform:translate3d(76vw, 42vh, 0) rotate(76deg) scale(.82);opacity:.38}
  57%  {transform:translate3d(37vw, 76vh, 0) rotate(164deg) scale(.92);opacity:.32}
  70%  {transform:translate3d(-7vw, 59vh, 0) rotate(204deg) scale(.8);opacity:.36}
  83%  {transform:translate3d(4vw, 22vh, 0) rotate(278deg) scale(.88);opacity:.3}
  93%  {opacity:.4}
  100% {transform:translate3d(-125vw, 7vh, 0) rotate(372deg) scale(.72);opacity:0}
}
@media(max-width:700px) {
  .dragon-flight {width:clamp(170px, 52vw, 245px) !important;animation-duration:34s !important;}
}
@media(prefers-reduced-motion:reduce) {
  .dragon-flight {animation:none !important;opacity:.16 !important;transform:translate3d(62vw,8vh,0) rotate(-12deg) scale(.8) !important;}
}


/* V9 — refined dark-metal dragon with a slower cinematic orbit. */
.dragon-flight {
  z-index:4 !important;
  width:clamp(230px, 44vw, 520px) !important;
  aspect-ratio:900 / 560 !important;
  opacity:0;
  mix-blend-mode:screen;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.72)) drop-shadow(0 0 9px rgba(191,174,147,.18));
  animation:dragonPageOrbitV9 52s cubic-bezier(.42,0,.58,1) 2.6s infinite !important;
}
.dragon-flight svg {width:100%;height:100%;display:block;overflow:visible;}
@keyframes dragonPageOrbitV9 {
  0% {transform:translate3d(-112vw,5vh,0) rotate(-12deg) scale(.78);opacity:0}
  6% {opacity:.43}
  18% {transform:translate3d(4vw,11vh,0) rotate(5deg) scale(.88);opacity:.38}
  30% {transform:translate3d(58vw,18vh,0) rotate(24deg) scale(.78);opacity:.34}
  42% {transform:translate3d(65vw,43vh,0) rotate(92deg) scale(.82);opacity:.4}
  56% {transform:translate3d(34vw,72vh,0) rotate(168deg) scale(.92);opacity:.34}
  69% {transform:translate3d(-8vw,58vh,0) rotate(218deg) scale(.8);opacity:.37}
  82% {transform:translate3d(2vw,22vh,0) rotate(286deg) scale(.9);opacity:.32}
  94% {opacity:.4}
  100% {transform:translate3d(-112vw,5vh,0) rotate(348deg) scale(.78);opacity:0}
}
@media(max-width:700px) {
  .dragon-flight {width:clamp(210px, 64vw, 310px) !important;animation-duration:48s !important;}
}
@media(prefers-reduced-motion:reduce) {
  .dragon-flight {animation:none !important;opacity:.2 !important;transform:translate3d(38vw,14vh,0) rotate(-8deg) scale(.86) !important;}
}


/* V10 — use a real campaign dragon detail, never a hand-drawn line illustration. */
.dragon-flight {
  position:fixed !important;
  z-index:4 !important;
  top:0 !important;
  left:0 !important;
  width:clamp(220px, 34vw, 390px) !important;
  height:auto !important;
  aspect-ratio:287 / 263 !important;
  opacity:0;
  pointer-events:none !important;
  overflow:visible !important;
  mix-blend-mode:screen;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.7)) drop-shadow(0 0 16px rgba(185,158,121,.2));
  will-change:transform,opacity;
  animation:dragonRealOrbit 42s cubic-bezier(.45,0,.55,1) 2s infinite !important;
}
.dragon-flight img {
  display:block;
  width:100%;
  height:auto;
  opacity:.78;
  transform-origin:50% 50%;
}
@keyframes dragonRealOrbit {
  0%   {transform:translate3d(-105vw,7vh,0) rotate(-10deg) scale(.72);opacity:0}
  7%   {opacity:.48}
  19%  {transform:translate3d(8vw,5vh,0) rotate(2deg) scale(.88);opacity:.44}
  31%  {transform:translate3d(67vw,18vh,0) rotate(18deg) scale(.78);opacity:.38}
  44%  {transform:translate3d(72vw,43vh,0) rotate(82deg) scale(.82);opacity:.42}
  58%  {transform:translate3d(32vw,76vh,0) rotate(170deg) scale(.9);opacity:.36}
  72%  {transform:translate3d(-9vw,55vh,0) rotate(252deg) scale(.8);opacity:.4}
  86%  {transform:translate3d(10vw,17vh,0) rotate(330deg) scale(.86);opacity:.42}
  94%  {opacity:.46}
  100% {transform:translate3d(-105vw,7vh,0) rotate(350deg) scale(.72);opacity:0}
}
@media(max-width:700px) {
  .dragon-flight {width:clamp(165px, 48vw, 230px) !important;animation-duration:38s !important;}
}
@media(prefers-reduced-motion:reduce) {
  .dragon-flight {animation:none !important;opacity:.22 !important;transform:translate3d(55vw,12vh,0) rotate(0) scale(.8) !important;}
}

/* V12 — dragon/serpent visual effects removed; retain the site's other animations. */

/* V15: Restore the original V4 plain near-black background.
   All previous fade-in, scroll reveal and photo glint effects remain. */
body { background: #050505; }

/* ==========================================================
   TYPHON V16 — stronger silver finish + mobile-first polish
   Keeps V4 near-black background, original photography and no smoke/audio.
   ========================================================== */
:root { --typhon-highlight: rgba(238,235,226,.32); }

/* Cleaner first impression: short, confident brand reveal. */
.intro-screen {
  background: #050505 !important;
  animation: introExitV16 1.75s cubic-bezier(.7,0,.25,1) .18s forwards !important;
}
.intro-mark {
  gap: 14px;
  animation: introMarkV16 .95s cubic-bezier(.16,1,.3,1) .08s both !important;
}
.intro-mark img {
  width: clamp(82px, 18vw, 124px);
  filter: drop-shadow(0 0 12px rgba(230,226,216,.16));
}
.intro-mark span { font-size: 8px; letter-spacing: .32em; }
.intro-mark i {
  width: 116px;
  background: linear-gradient(90deg,transparent,#e1ddd3 48%,transparent);
  box-shadow: 0 0 12px rgba(224,220,211,.28);
  animation: introLineV16 .65s ease .5s both !important;
}
@keyframes introMarkV16 {
  0% { opacity:0; transform:translateY(14px) scale(.94); filter:blur(5px); }
  65% { opacity:1; filter:blur(0); }
  100% { opacity:1; transform:translateY(0) scale(1); filter:blur(0); }
}
@keyframes introLineV16 { from { transform:scaleX(.05); opacity:.25; } to { transform:scaleX(1); opacity:1; } }
@keyframes introExitV16 {
  0%,64% { opacity:1; visibility:visible; }
  100% { opacity:0; visibility:hidden; }
}

/* Hero comes in as one composed image, then copy follows without a hard flash. */
.hero-image { animation: heroImageV16 1.15s cubic-bezier(.2,.7,.2,1) .05s both !important; }
.hero-content .eyebrow, .hero-content h1, .hero-content .hero-copy, .hero-content .outline-btn {
  animation: heroCopyV16 .78s cubic-bezier(.2,.75,.25,1) both !important;
}
.hero-content .eyebrow { animation-delay:.24s !important; }
.hero-content h1 { animation-delay:.36s !important; }
.hero-content .hero-copy { animation-delay:.5s !important; }
.hero-content .outline-btn { animation-delay:.62s !important; }
@keyframes heroImageV16 {
  from { opacity:.35; transform:scale(1.025); filter:brightness(.78); }
  to { opacity:1; transform:scale(1); filter:brightness(1); }
}
@keyframes heroCopyV16 {
  from { opacity:0; transform:translateY(13px); filter:blur(2px); }
  to { opacity:1; transform:translateY(0); filter:blur(0); }
}

/* More legible silver glints: brighter, wider, and repeated with breathing room. */
.collection-photo { overflow:hidden !important; background:#090909; }
.collection-photo::before {
  z-index:4 !important;
  width:58%;
  inset:-8% auto -8% -70% !important;
  opacity:0;
  transform:skewX(-17deg) translateX(-140%) !important;
  background:linear-gradient(90deg,transparent 0%,rgba(245,242,233,.06) 26%,rgba(245,242,233,.34) 50%,rgba(245,242,233,.09) 72%,transparent 100%) !important;
  filter:blur(.3px);
}
.collection-photo.shine-pass::before {
  animation: photoGlintV16 8.2s cubic-bezier(.2,.65,.25,1) .5s infinite !important;
}
@keyframes photoGlintV16 {
  0%,68%,100% { opacity:0; transform:skewX(-17deg) translateX(-140%); }
  72% { opacity:1; }
  88% { opacity:.78; transform:skewX(-17deg) translateX(330%); }
  90% { opacity:0; transform:skewX(-17deg) translateX(330%); }
}
.shop-card::before, .material-card::before {
  width:54% !important;
  background:linear-gradient(90deg,transparent,rgba(245,242,233,.19),transparent) !important;
}
.shop-card.surface-glint::before, .material-card.surface-glint::before {
  animation: panelGlintV16 9.5s ease-in-out 1s infinite !important;
}
@keyframes panelGlintV16 {
  0%,72%,100% { opacity:0; left:-65%; }
  77% { opacity:.95; }
  94% { opacity:.5; left:130%; }
}
.outline-btn::after, .header-cta::after, .shop-card::after {
  background:linear-gradient(105deg,transparent 25%,rgba(245,242,233,.26) 50%,transparent 75%) !important;
}
.quality-band::before {
  width:34%;
  background:linear-gradient(90deg,transparent,rgba(235,231,221,.095),transparent);
  animation:qualitySweepV16 9s ease-in-out 2s infinite;
}
@keyframes qualitySweepV16 {
  0%,65%,100% { left:-48%; opacity:0; }
  72% { opacity:.9; }
  91% { left:125%; opacity:.65; }
}

/* Mobile: comfortable tap targets, shorter line lengths and a balanced gallery. */
@media (max-width:900px) {
  .site-header { height:66px; padding-inline:22px; }
  .brand img { width:94px; }
  .mobile-menu { top:66px; padding:12px 22px 18px; }
  .mobile-menu a { min-height:50px; display:flex; align-items:center; font-size:11px; }
  .menu-toggle { width:44px; height:44px; align-items:flex-end; }
  .menu-toggle i { width:25px; }
  .hero { margin-top:66px; }
  .hero-image { aspect-ratio:4 / 5 !important; object-position:center 42% !important; }
  .hero-content { left:22px; right:22px; bottom:7%; max-width:620px; }
  .hero h1 { font-size:clamp(36px,8.7vw,58px); line-height:.98; }
  .hero-copy { max-width:340px; line-height:1.55; }
  .section { padding:70px 22px; }
  .section-heading, .shop-head, .materials-head { margin-bottom:32px; }
  .section-heading h2, .shop h2, .about h2, .materials h2 { font-size:clamp(40px,8vw,52px); }
  .section-heading>p, .shop-head>p, .materials-head>p { max-width:420px; font-size:13px; line-height:1.65; }
  .collection-gallery { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .collection-photo:first-child { grid-column:1 / -1; }
  .collection-photo { align-self:start; }
  .collection-photo img { width:100%; height:auto; object-fit:contain; }
  .collection-intro h3 { font-size:clamp(34px,7vw,44px); }
  .product-desc { font-size:13px; line-height:1.65; }
  .product-specs { flex-wrap:wrap; font-size:9px; }
  .quality-inner { padding:66px 22px; }
  .quality-inner h2 { font-size:clamp(32px,7vw,42px); line-height:1.04; }
  .quality-grid div { min-height:88px; padding:18px 12px; }
  .quality-grid span { font-size:12px; line-height:1.45; }
  .material-card { min-height:210px; padding:22px; }
  .material-card h3 { font-size:clamp(27px,6vw,34px); }
  .material-card p:last-child { font-size:13px; line-height:1.65; }
  .about { gap:0; }
  .about-copy { margin-top:28px; font-size:15px; line-height:1.75; }
  .shop-card { min-height:82px; padding:17px; }
  .shop-card strong { font-size:15px; }
  .footer { padding:54px 22px 22px; }
  .footer-links { gap:30px; }
  .footer-links a { min-height:30px; font-size:12px; }
  .footer-bottom { font-size:8px; line-height:1.7; }
}
@media (max-width:520px) {
  .hero-image { aspect-ratio:4 / 5 !important; }
  .hero-content { bottom:6%; }
  .hero .eyebrow { font-size:8px; margin-bottom:10px; }
  .hero h1 { font-size:clamp(33px,8.5vw,43px); }
  .hero-copy { font-size:11px; margin:12px 0 16px; }
  .outline-btn { min-height:44px; padding:12px 14px; gap:18px; }
  .section { padding-block:60px; }
  .collection-gallery { gap:8px !important; }
  .quality-grid div { padding:16px 10px; }
  .footer-wordmark { font-size:48px; }
  .footer-tagline { font-size:7px; letter-spacing:.22em; }
}
@media (prefers-reduced-motion:reduce) {
  .intro-screen, .intro-mark, .intro-mark i, .hero-image,
  .hero-content .eyebrow, .hero-content h1, .hero-content .hero-copy,
  .hero-content .outline-btn, .collection-photo.shine-pass::before,
  .shop-card.surface-glint::before, .material-card.surface-glint::before,
  .quality-band::before { animation:none !important; }
  .intro-screen { display:none !important; }
}


/* ==========================================================
   TYPHON V17 — MOBILE-FIRST EDITORIAL REFINEMENT
   ========================================================== */
:root{--v17-ink:#050505;--v17-silver:rgba(242,240,234,.82);--v17-line:#292825}
html{scroll-padding-top:76px}
body{background:#050505;overflow-x:clip}
.site-header{height:74px;padding-inline:clamp(20px,5vw,72px);background:rgba(5,5,5,.94);border-bottom-color:rgba(225,222,214,.13)}
.brand img{width:112px}
.desktop-nav{gap:clamp(22px,3vw,42px)}
.desktop-nav a,.header-cta{font-size:10px;letter-spacing:.19em}
.hero{margin-top:74px;isolation:isolate;background:#050505}
.hero-frame{position:relative}
.hero-image{height:min(76svh,780px);min-height:510px;object-position:center 44%}
.hero-gradient{background:linear-gradient(90deg,rgba(3,3,3,.66),rgba(3,3,3,.18) 58%,transparent 100%),linear-gradient(0deg,rgba(3,3,3,.76),transparent 58%)}
.hero-content{left:clamp(24px,7vw,100px);bottom:9%;right:7vw}
.hero h1{max-width:780px;text-wrap:balance}
.hero-copy{line-height:1.65;max-width:420px}
.outline-btn{min-height:46px;align-items:center;justify-content:center}
.section-heading h2,.shop h2,.about h2,.materials h2{line-height:.98}
.collection-gallery{gap:16px}
.collection-photo{position:relative;isolation:isolate;background:#090909;overflow:hidden!important}
.collection-photo img{width:100%;height:auto;display:block;object-fit:contain;transform:none!important}
.collection-photo::before{content:"";position:absolute;z-index:3;top:-12%;bottom:-12%;left:-78%;width:52%;pointer-events:none;opacity:0;transform:skewX(-18deg);background:linear-gradient(90deg,transparent 0%,rgba(244,242,235,.08) 25%,rgba(250,248,241,.62) 50%,rgba(244,242,235,.14) 72%,transparent 100%);filter:blur(.35px);mix-blend-mode:screen}
.collection-photo.shine-pass::before{animation:v17PhotoShine 7.4s cubic-bezier(.2,.65,.25,1) 1.1s infinite}
@keyframes v17PhotoShine{0%,64%,100%{left:-78%;opacity:0}69%{opacity:.92}86%{left:138%;opacity:.58}89%{opacity:0}}
.outline-btn,.header-cta,.shop-card,.material-card{isolation:isolate}
.outline-btn::after,.header-cta::after,.shop-card::after,.material-card::after{content:"";position:absolute;z-index:2;inset:-1px;pointer-events:none;opacity:0;transform:translateX(-130%);background:linear-gradient(105deg,transparent 25%,rgba(245,243,236,.38) 50%,transparent 75%)}
.outline-btn,.header-cta{overflow:hidden}
.outline-btn:hover::after,.header-cta:hover::after,.shop-card:hover::after,.material-card:hover::after{opacity:1;transform:translateX(130%);transition:transform 1s ease,opacity .18s ease}
.shop-card,.material-card{position:relative;overflow:hidden}
.shop-card.surface-glint::after,.material-card.surface-glint::after{animation:v17PanelShine 8.8s ease-in-out 1.3s infinite}
@keyframes v17PanelShine{0%,68%,100%{opacity:0;transform:translateX(-130%)}74%{opacity:.9}91%{opacity:.55;transform:translateX(130%)}}
.quality-band{overflow:hidden}
.quality-band::before{content:"";position:absolute;z-index:0;top:0;bottom:0;left:-55%;width:38%;pointer-events:none;opacity:0;background:linear-gradient(100deg,transparent,rgba(238,236,229,.13),transparent);animation:v17QualityShine 10s ease-in-out 2s infinite}
.quality-inner{position:relative;z-index:1}
@keyframes v17QualityShine{0%,68%,100%{left:-55%;opacity:0}75%{opacity:.9}94%{left:125%;opacity:.5}}
/* Short opening sequence, then a quick handoff to the hero. */
.intro-screen{background:#050505!important;animation:v17IntroExit 1.55s cubic-bezier(.72,0,.24,1) .12s forwards!important}
.intro-mark{animation:v17IntroMark .82s cubic-bezier(.16,1,.3,1) .05s both!important}
.intro-mark img{filter:drop-shadow(0 0 15px rgba(236,232,221,.24))}
.intro-mark span{letter-spacing:.28em}
.intro-mark i{animation:v17IntroLine .58s ease .36s both!important}
@keyframes v17IntroMark{0%{opacity:0;transform:translateY(12px) scale(.96);filter:blur(4px)}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes v17IntroLine{from{transform:scaleX(.05);opacity:.2}to{transform:scaleX(1);opacity:1}}
@keyframes v17IntroExit{0%,56%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
.hero-image{animation:v17HeroImage 1.05s cubic-bezier(.2,.7,.2,1) .12s both!important}
.hero-content .eyebrow,.hero-content h1,.hero-content .hero-copy,.hero-content .outline-btn{animation:v17HeroCopy .72s cubic-bezier(.2,.75,.25,1) both!important}
.hero-content .eyebrow{animation-delay:.32s!important}.hero-content h1{animation-delay:.42s!important}.hero-content .hero-copy{animation-delay:.53s!important}.hero-content .outline-btn{animation-delay:.64s!important}
@keyframes v17HeroImage{from{opacity:.35;transform:scale(1.018);filter:brightness(.82)}to{opacity:1;transform:scale(1);filter:brightness(1)}}
@keyframes v17HeroCopy{from{opacity:0;transform:translateY(11px);filter:blur(1.5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@media(max-width:900px){
 .site-header{height:64px;padding-inline:20px}.brand img{width:92px}.mobile-menu{top:64px;padding:10px 20px 16px;background:rgba(5,5,5,.98)}
 .menu-toggle{width:44px;height:44px;justify-content:center;align-items:flex-end}.menu-toggle i{width:25px}
 .hero{margin-top:64px}.hero-image{height:auto;min-height:0;aspect-ratio:5/4!important;object-fit:cover;object-position:center 40%!important}
 .hero-gradient{background:linear-gradient(0deg,rgba(3,3,3,.94) 0%,rgba(3,3,3,.52) 38%,rgba(3,3,3,.06) 100%)}
 .hero-content{left:22px;right:22px;bottom:22px;max-width:600px}.hero .eyebrow{font-size:8px;letter-spacing:.24em;margin-bottom:9px}
 .hero h1{font-size:clamp(31px,7.6vw,48px);line-height:1.02;letter-spacing:0}.hero-copy{font-size:11px;line-height:1.5;margin:10px 0 13px}
 .hero .outline-btn{min-height:42px;padding:10px 13px;font-size:8px;gap:18px}
 .section{padding:58px 20px}.section-heading,.shop-head,.materials-head{display:block;margin-bottom:27px}
 .section-heading h2,.shop h2,.about h2,.materials h2{font-size:clamp(37px,8vw,48px);line-height:.98}
 .section-heading>p,.shop-head>p,.materials-head>p{font-size:12px;line-height:1.65;margin-top:12px}
 .collection-intro{padding-bottom:22px}.collection-intro .eyebrow{font-size:8px;letter-spacing:.22em}
 .collection-intro h3{font-size:clamp(34px,7.5vw,44px);line-height:.98;margin:11px 0 13px}
 .collection-intro .product-desc{font-size:12px;line-height:1.65;margin-bottom:14px}
 .product-specs{gap:7px 14px;font-size:8px;letter-spacing:.1em;margin-bottom:17px}
 .collection-gallery{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;align-items:start}
 .collection-photo{grid-column:auto!important;grid-row:auto!important;min-width:0}.collection-photo img{width:100%;height:auto;object-fit:contain}
 .quality-inner{padding:58px 20px}.quality-inner h2{font-size:clamp(30px,7vw,39px);line-height:1.04;margin-bottom:28px}
 .quality-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quality-grid div{min-height:80px;padding:15px 10px}
 .quality-grid b{font-size:8px;margin-bottom:8px}.quality-grid span{font-size:11px;line-height:1.45}
 .material-grid{grid-template-columns:1fr;gap:10px}.material-card{min-height:190px;padding:20px}
 .material-card h3{font-size:clamp(27px,6vw,32px);line-height:1.05}.material-card p:last-child{font-size:12px;line-height:1.65}
 .about{display:grid;grid-template-columns:1fr;gap:0}.about-copy{margin-top:22px;font-size:14px;line-height:1.7}
 .shop-grid{grid-template-columns:1fr;gap:9px}.shop-card{min-height:76px;padding:14px}.market-icon{width:42px;height:42px}.shop-card strong{font-size:14px}
 .footer{padding:48px 20px 20px}.footer-top{grid-template-columns:1fr;gap:30px}.footer-wordmark{font-size:48px}
 .footer-tagline{font-size:7px;letter-spacing:.22em;margin-top:12px}.footer-links{grid-template-columns:1fr 1fr;gap:20px}
 .footer-links a{font-size:11px;line-height:1.4;min-height:32px}.footer-rule{margin-top:36px}
 .footer-bottom{margin-top:14px;gap:8px;flex-wrap:wrap;font-size:7px;line-height:1.6}.scroll-progress{height:2px}
}
@media(max-width:380px){.hero-content{left:17px;right:17px;bottom:17px}.hero h1{font-size:30px}.hero-copy{font-size:10px}.section{padding-inline:17px}.collection-gallery{gap:7px!important}.footer-links{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.intro-screen,.intro-mark,.intro-mark i,.hero-image,.hero-content .eyebrow,.hero-content h1,.hero-content .hero-copy,.hero-content .outline-btn,.collection-photo.shine-pass::before,.shop-card.surface-glint::after,.material-card.surface-glint::after,.quality-band::before{animation:none!important}.intro-screen{display:none!important}}
