/* ============================================================
   Erisha Longevity – FZCO
   ============================================================ */

:root{
  /* ground */
  --ink:      #04120C;
  --ink-2:    #071B12;
  --bark:     #0A2115;
  --bark-2:   #0F2E1F;
  --bark-3:   #143824;

  /* light surfaces */
  --paper:    #ECEEE2;
  --paper-2:  #F5F6EE;

  /* house metal */
  --gold:     #C6A24A;
  --gold-lt:  #E8D3A0;
  --gold-dk:  #8A6F2C;

  /* text */
  --tx:       #D2DDCE;
  --tx-mute:  #8CA294;
  --tx-dim:   #61776A;
  --ink-tx:   #0A2015;
  --ink-mute: #4A5E52;

  /* rules */
  --line:     rgba(198,162,74,.22);
  --line-2:   rgba(210,221,206,.11);
  --line-3:   rgba(210,221,206,.06);

  /* the live brand accent — swapped by JS */
  --acc:      #C6A24A;
  --acc-soft: rgba(198,162,74,.16);

  --display: 'Fraunces','Iowan Old Style',Georgia,serif;
  --body:    'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:    'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;

  --pad:  clamp(18px,4.6vw,60px);
  --maxw: 1300px;
  --nav:  66px;
  --ease: cubic-bezier(.22,.68,.32,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--nav) + 56px);
  -webkit-text-size-adjust:100%;
}

body{
  margin:0;
  background:var(--ink);
  color:var(--tx);
  font-family:var(--body);
  font-size:clamp(15px,.5vw + 13.6px,16.5px);
  line-height:1.65;
  font-weight:350;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img,video{ max-width:100%; display:block; }
a{ color:inherit; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select,textarea{ font:inherit; color:inherit; }

::selection{ background:var(--gold); color:var(--ink); }

:focus-visible{
  outline:2px solid var(--gold-lt);
  outline-offset:3px;
  border-radius:2px;
}

.sr{
  position:absolute; width:1px; height:1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;
}

.skip{
  position:absolute; left:-9999px; top:8px; z-index:300;
  background:var(--gold); color:var(--ink);
  padding:10px 16px; text-decoration:none; border-radius:2px;
}
.skip:focus{ left:12px; }

.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }

/* ── type ────────────────────────────────────────────────── */

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:420;
  font-variation-settings:'SOFT' 24,'WONK' 1,'opsz' 40;
  line-height:1.06;
  letter-spacing:-.018em;
  margin:0;
  color:var(--paper);
}

.mono{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-weight:400;
}

.eyebrow{
  font-family:var(--mono);
  font-size:.685rem;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 18px;
  display:flex; align-items:center; gap:12px;
}
.eyebrow::after{
  content:''; flex:1; height:1px;
  background:linear-gradient(90deg,var(--line),transparent);
}

.lede{
  font-size:clamp(1.02rem,.5vw + .92rem,1.2rem);
  color:var(--tx-mute);
  max-width:62ch;
  line-height:1.62;
}

/* ── masthead ────────────────────────────────────────────── */

.mast{
  position:fixed; inset:0 0 auto; z-index:120;
  height:var(--nav);
  display:flex; align-items:center;
  background:rgba(4,18,12,.72);
  backdrop-filter:saturate(150%) blur(16px);
  -webkit-backdrop-filter:saturate(150%) blur(16px);
  border-bottom:1px solid var(--line-3);
  transition:background .3s var(--ease),border-color .3s var(--ease);
}
.mast.solid{ background:rgba(4,18,12,.95); border-bottom-color:var(--line); }

.mast .wrap{
  display:flex; align-items:center; gap:20px; width:100%;
}

.mark{ display:flex; align-items:center; gap:11px; text-decoration:none; flex:none; }
.mark img{ height:30px; width:auto; }
.mark b{
  font-family:var(--display); font-weight:500; font-size:1.02rem;
  letter-spacing:-.01em; color:var(--paper); line-height:1;
}
.mark span{
  display:block; font-family:var(--mono); font-size:.56rem;
  letter-spacing:.22em; color:var(--gold); text-transform:uppercase; margin-top:3px;
}

.mast nav{ margin-left:auto; display:flex; align-items:center; gap:4px; }
.mast nav a{
  font-family:var(--mono); font-size:.68rem; letter-spacing:.13em;
  text-transform:uppercase; color:var(--tx-mute);
  text-decoration:none; padding:9px 12px; border-radius:2px;
  transition:color .2s var(--ease),background .2s var(--ease);
}
.mast nav a:hover{ color:var(--paper); background:rgba(210,221,206,.05); }

.mast .cta{
  flex:none; margin-left:8px;
  font-family:var(--mono); font-size:.67rem; letter-spacing:.13em;
  text-transform:uppercase; text-decoration:none;
  padding:9px 17px; border:1px solid var(--gold);
  color:var(--gold); border-radius:2px;
  transition:background .22s var(--ease),color .22s var(--ease);
}
.mast .cta:hover{ background:var(--gold); color:var(--ink); }

.burger{ display:none; margin-left:auto; padding:10px; }
.burger i{
  display:block; width:22px; height:1.5px; background:var(--paper);
  transition:transform .3s var(--ease),opacity .2s var(--ease);
}
.burger i + i{ margin-top:5px; }
.burger[aria-expanded="true"] i:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger[aria-expanded="true"] i:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] i:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* ── hero ────────────────────────────────────────────────── */

.hero{
  position:relative; overflow:hidden;
  padding:calc(var(--nav) + clamp(56px,10vh,110px)) 0 clamp(40px,6vh,72px);
  border-bottom:1px solid var(--line-3);
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  overflow:hidden;
}
.hero-bg video,.hero-bg img{
  width:100%; height:100%; object-fit:cover;
  opacity:.24; filter:saturate(.7) contrast(1.05);
}
.hero-bg::after{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(120% 90% at 18% 8%,rgba(4,18,12,.42),rgba(4,18,12,.93) 62%),
    linear-gradient(180deg,rgba(4,18,12,.6),var(--ink) 92%);
}
.hero .wrap{ position:relative; z-index:1; }

.hero h1{
  font-size:clamp(2.5rem,6.4vw,5.1rem);
  max-width:16ch;
  margin-bottom:22px;
}
.hero h1 em{
  font-style:italic; color:var(--gold-lt);
  font-variation-settings:'SOFT' 60,'WONK' 1;
}

.hero-foot{
  display:flex; flex-wrap:wrap; gap:14px 34px;
  align-items:baseline; margin-top:30px;
  padding-top:22px; border-top:1px solid var(--line-3);
}
.hero-foot .mono{ color:var(--tx-dim); }
.hero-foot .mono b{ color:var(--gold); font-weight:400; }

/* ── brand architecture rail (hero signature) ────────────── */

.arch{
  display:grid; gap:1px;
  grid-template-columns:repeat(4,1fr);
  margin-top:clamp(34px,5vh,58px);
  background:var(--line-3);
  border:1px solid var(--line-3);
}
/* a stretched, invisible button gives the whole card one hit target
   while the content inside stays real headings and paragraphs */
.hit{
  position:absolute; inset:0; z-index:3;
  display:block; width:100%; height:100%;
  background:none; border:0; cursor:pointer; text-decoration:none;
}
.hit:focus-visible{ outline:2px solid var(--gold-lt); outline-offset:-3px; }

.arch-card{
  position:relative; display:block; width:100%; text-align:left;
  background:rgba(10,33,21,.78);
  padding:26px 22px 24px;
  transition:background .3s var(--ease),transform .3s var(--ease);
  overflow:hidden;
}
.arch-card::before{
  content:''; position:absolute; inset:auto 0 0 0; height:2px;
  background:var(--card-acc); transform:scaleX(0); transform-origin:left;
  transition:transform .45s var(--ease);
}
.arch-card:hover{ background:rgba(15,46,31,.92); }
.arch-card:hover::before{ transform:scaleX(1); }

.arch-card .n{
  font-family:var(--mono); font-size:.62rem; letter-spacing:.2em;
  color:var(--card-acc); text-transform:uppercase;
}
.arch-card h3{
  font-size:1.32rem; margin:12px 0 7px; color:var(--paper);
}
.arch-card p{
  margin:0; font-size:.855rem; color:var(--tx-dim); line-height:1.5;
}
.arch-card .go{
  margin-top:18px; display:flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:.63rem; letter-spacing:.15em;
  text-transform:uppercase; color:var(--tx-mute);
}
.arch-card .go svg{ transition:transform .3s var(--ease); }
.arch-card:hover .go{ color:var(--card-acc); }
.arch-card:hover .go svg{ transform:translateX(4px); }

/* ── section frame ───────────────────────────────────────── */

.sect{ padding:clamp(58px,9vh,104px) 0; border-bottom:1px solid var(--line-3); }
.sect.tight{ padding-block:clamp(40px,6vh,68px); }
.sect-head{ max-width:64ch; margin-bottom:clamp(30px,4vh,48px); }
.sect-head h2{ font-size:clamp(1.75rem,3.6vw,2.7rem); margin-bottom:16px; }

/* ── catalogue: brand rail ───────────────────────────────── */

.catalogue{ padding-top:0; }

.brand-rail{
  position:sticky; top:var(--nav); z-index:80;
  background:rgba(4,18,12,.94);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.brand-rail .wrap{
  display:flex; gap:2px; overflow-x:auto; scrollbar-width:none;
}
.brand-rail .wrap::-webkit-scrollbar{ display:none; }

.brand-tab{
  position:relative; flex:none; padding:17px 20px 15px;
  font-family:var(--display); font-size:1.02rem; font-weight:430;
  color:var(--tx-dim); white-space:nowrap;
  transition:color .25s var(--ease);
}
.brand-tab small{
  display:block; font-family:var(--mono); font-size:.575rem;
  letter-spacing:.17em; text-transform:uppercase;
  color:var(--tx-dim); opacity:.7; margin-top:3px; font-weight:400;
}
.brand-tab::after{
  content:''; position:absolute; inset:auto 20px -1px;
  height:2px; background:var(--tab-acc);
  transform:scaleX(0); transition:transform .32s var(--ease);
}
.brand-tab:hover{ color:var(--tx); }
.brand-tab[aria-selected="true"]{ color:var(--paper); }
.brand-tab[aria-selected="true"] small{ color:var(--tab-acc); opacity:1; }
.brand-tab[aria-selected="true"]::after{ transform:scaleX(1); }

/* ── catalogue: brand intro ──────────────────────────────── */

.brand-intro{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr);
  gap:clamp(24px,4vw,64px); align-items:end;
  padding:clamp(38px,5.5vh,64px) 0 clamp(26px,3.5vh,38px);
}
.brand-intro h2{
  font-size:clamp(2rem,4.6vw,3.4rem);
  color:var(--paper); margin-bottom:14px;
}
.brand-intro .tagline{
  font-family:var(--mono); font-size:.7rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--acc); margin:0 0 18px;
}
.brand-intro p.blurb{ margin:0; color:var(--tx-mute); max-width:52ch; }
.brand-stats{
  display:flex; gap:28px; flex-wrap:wrap;
  padding-bottom:6px;
}
.brand-stats div span{
  display:block; font-family:var(--display); font-size:1.9rem;
  color:var(--acc); line-height:1;
}
.brand-stats div small{
  display:block; font-family:var(--mono); font-size:.6rem;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--tx-dim); margin-top:8px;
}

/* ── catalogue: head tabs ────────────────────────────────── */

.head-rail{
  display:flex; gap:0; overflow-x:auto; scrollbar-width:none;
  border-top:1px solid var(--line-3);
  border-bottom:1px solid var(--line-3);
}
.head-rail::-webkit-scrollbar{ display:none; }

.head-tab{
  position:relative; flex:none; padding:15px 42px 15px 20px;
  text-align:left; white-space:nowrap;
  border-right:1px solid var(--line-3);
  transition:background .22s var(--ease);
}
.head-tab:first-child{ padding-left:0; }
.head-tab:last-child{ border-right:0; }
.head-tab b{
  display:block; font-weight:500; font-size:.9rem;
  color:var(--tx-dim); transition:color .22s var(--ease);
}
.head-tab small{
  display:block; font-family:var(--mono); font-size:.575rem;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--tx-dim); opacity:.62; margin-top:4px;
}
.head-tab i{
  position:absolute; top:15px; right:8px;
  font-family:var(--mono); font-style:normal; font-size:.58rem;
  color:var(--tx-dim); opacity:.5;
}
.head-tab:hover b{ color:var(--tx); }
.head-tab[aria-selected="true"] b{ color:var(--acc); }
.head-tab[aria-selected="true"] small{ opacity:.9; }
.head-tab[aria-selected="true"]::after{
  content:''; position:absolute; inset:auto 0 -1px 0; height:2px; background:var(--acc);
}

/* ── catalogue: toolbar ──────────────────────────────────── */

.toolbar{
  display:flex; flex-wrap:wrap; gap:16px 22px;
  align-items:center; padding:22px 0 6px;
}
.search{
  position:relative; flex:1 1 240px; max-width:340px;
}
.search input{
  width:100%; background:transparent;
  border:0; border-bottom:1px solid var(--line-2);
  padding:9px 30px 9px 0; color:var(--paper);
  font-size:.92rem; transition:border-color .25s var(--ease);
}
.search input::placeholder{ color:var(--tx-dim); }
.search input:focus{ outline:0; border-bottom-color:var(--acc); }
.search svg{
  position:absolute; right:2px; top:50%; transform:translateY(-50%);
  color:var(--tx-dim); pointer-events:none;
}

.chips{ display:flex; flex-wrap:wrap; gap:6px; }
.chip{
  font-family:var(--mono); font-size:.615rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--tx-mute);
  padding:6px 12px; border:1px solid var(--line-2); border-radius:100px;
  transition:all .2s var(--ease);
}
.chip:hover{ border-color:var(--tx-dim); color:var(--tx); }
.chip[aria-pressed="true"]{
  background:var(--acc); border-color:var(--acc); color:var(--ink); font-weight:500;
}

.count{
  margin-left:auto; font-family:var(--mono); font-size:.66rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--tx-dim);
}
.count b{ color:var(--acc); font-weight:400; }

/* ── catalogue: the shelf ────────────────────────────────── */

.shelf{
  display:grid; gap:0;
  grid-template-columns:repeat(auto-fill,minmax(224px,1fr));
  margin-top:6px;
  border-top:1px solid var(--line-3);
  border-left:1px solid var(--line-3);
}

.spec-card{
  position:relative; text-align:left; width:100%;
  padding:22px 20px 24px;
  margin:0;
  border-right:1px solid var(--line-3);
  border-bottom:1px solid var(--line-3);
  background:transparent;
  transition:background .3s var(--ease);
  display:flex; flex-direction:column;
}
.spec-card:hover{ background:rgba(15,46,31,.55); }

/* the gilt shelf rule — the signature */
.spec-card::after{
  content:''; position:absolute; inset:auto 0 -1px 0; height:1px;
  background:var(--acc); transform:scaleX(0); transform-origin:left;
  transition:transform .5s var(--ease);
}
.spec-card:hover::after{ transform:scaleX(1); }

.spec-card .idx{
  font-family:var(--mono); font-size:.575rem; letter-spacing:.15em;
  color:var(--tx-dim); margin:0 0 14px;
}

.spec-shot{
  position:relative; aspect-ratio:3/4; margin-bottom:16px;
  background:var(--bark); overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.spec-shot img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .7s var(--ease), filter .4s var(--ease);
  filter:saturate(.95);
}
.spec-card:hover .spec-shot img{ transform:scale(1.05); filter:saturate(1.08); }
.spec-shot.contain img{ object-fit:contain; padding:8px; }

/* the beverage specimen bottle */
.spec-shot.bottle{
  background:linear-gradient(170deg,var(--bark-2),var(--ink-2));
}
.spec-shot.bottle svg{ width:56%; height:auto; }

/* the healthcare capability tile */
.spec-shot.clinical{
  background:
    linear-gradient(150deg,var(--bark-2),var(--ink-2)),
    radial-gradient(circle at 30% 25%,var(--acc-soft),transparent 62%);
  background-blend-mode:normal;
}
.spec-shot.clinical .glyph{
  font-family:var(--display); font-size:2.6rem; color:var(--acc);
  opacity:.85; font-variation-settings:'SOFT' 60,'WONK' 1;
}

.spec-card h4{
  font-size:1.06rem; color:var(--paper); margin-bottom:6px; line-height:1.2;
}
.spec-card .strap{
  font-size:.775rem; color:var(--tx-dim); margin:0 0 12px; line-height:1.42;
}
.spec-tags{ display:flex; flex-wrap:wrap; gap:5px; margin:auto 0 0; }
.spec-tags span{
  font-family:var(--mono); font-size:.55rem; letter-spacing:.11em;
  text-transform:uppercase; color:var(--acc);
  border:1px solid var(--acc-soft); background:var(--acc-soft);
  padding:3px 7px; border-radius:2px;
}

.empty{
  grid-column:1/-1; padding:64px 0; text-align:center; color:var(--tx-dim);
}
.empty b{ display:block; font-family:var(--display); font-size:1.4rem; color:var(--tx-mute); margin-bottom:8px; }

/* ── specimen sheet (detail modal) ───────────────────────── */

.sheet-bd{
  position:fixed; inset:0; z-index:200;
  background:rgba(2,10,6,.82);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  opacity:0; pointer-events:none; transition:opacity .3s var(--ease);
  display:grid; place-items:center; padding:var(--pad);
}
.sheet-bd.open{ opacity:1; pointer-events:auto; }

.sheet{
  width:min(920px,100%); max-height:88vh; overflow:auto;
  background:var(--bark); border:1px solid var(--line);
  display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1fr);
  transform:translateY(14px) scale(.985);
  transition:transform .38s var(--ease);
  scrollbar-width:thin;
}
.sheet-bd.open .sheet{ transform:none; }

.sheet-shot{
  background:var(--ink-2); position:relative; min-height:280px;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.sheet-shot img{ width:100%; height:100%; object-fit:cover; }
.sheet-shot.contain img{ object-fit:contain; padding:22px; }
.sheet-shot svg{ width:52%; }
.sheet-shot .glyph{
  font-family:var(--display); font-size:5rem; color:var(--acc); opacity:.8;
  font-variation-settings:'SOFT' 60,'WONK' 1;
}

.sheet-body{ padding:clamp(24px,3.4vw,38px); }
.sheet-body .idx{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.18em;
  color:var(--acc); text-transform:uppercase;
}
.sheet-body h3{
  font-size:clamp(1.5rem,3vw,2.1rem); margin:12px 0 6px; color:var(--paper);
}
.sheet-body .strap{ font-size:.86rem; color:var(--tx-dim); margin:0 0 20px; }
.sheet-body .desc{ color:var(--tx-mute); margin:0 0 24px; font-size:.94rem; }

.sheet-block{ margin-bottom:22px; }
.sheet-block > h5{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--tx-dim);
  margin:0 0 10px; font-weight:400;
}
.bots{ display:flex; flex-wrap:wrap; gap:6px; }
.bots span{
  font-size:.755rem; color:var(--tx);
  border:1px solid var(--line-2); padding:4px 10px; border-radius:100px;
}

.spec-table{ width:100%; border-collapse:collapse; }
.spec-table tr{ border-bottom:1px solid var(--line-3); }
.spec-table tr:last-child{ border-bottom:0; }
.spec-table th{
  text-align:left; font-family:var(--mono); font-size:.6rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--tx-dim);
  font-weight:400; padding:9px 14px 9px 0; width:38%; vertical-align:top;
}
.spec-table td{ padding:9px 0; font-size:.83rem; color:var(--tx); }

.sheet-close{
  position:absolute; top:12px; right:12px; z-index:3;
  width:34px; height:34px; display:grid; place-items:center;
  background:rgba(4,18,12,.72); border:1px solid var(--line-2);
  color:var(--paper); border-radius:2px;
  transition:background .2s var(--ease);
}
.sheet-close:hover{ background:var(--gold); color:var(--ink); border-color:var(--gold); }

.sheet-cta{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--mono); font-size:.65rem; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none;
  padding:11px 20px; border:1px solid var(--acc); color:var(--acc);
  border-radius:2px; transition:background .22s var(--ease),color .22s var(--ease);
}
.sheet-cta:hover{ background:var(--acc); color:var(--ink); }

/* ── news ────────────────────────────────────────────────── */

.news-list{ display:grid; gap:0; border-top:1px solid var(--line-3); }
.news-item{
  display:grid; grid-template-columns:150px minmax(0,1fr);
  gap:clamp(16px,3vw,40px);
  padding:26px 0; border-bottom:1px solid var(--line-3);
}
.news-item .meta .mono{ display:block; color:var(--gold); }
.news-item .meta .tag{
  display:inline-block; margin-top:9px;
  font-family:var(--mono); font-size:.575rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--tx-dim);
  border:1px solid var(--line-2); padding:3px 8px; border-radius:2px;
}
.news-item h3{ font-size:1.24rem; margin-bottom:9px; }
.news-item p{ margin:0; color:var(--tx-mute); font-size:.92rem; max-width:70ch; }

/* ── media ───────────────────────────────────────────────── */

.media-grid{
  display:grid; gap:2px;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
}
.media-tile{
  position:relative; display:block; width:100%; text-align:left;
  background:var(--bark); overflow:hidden; margin:0;
}
.media-tile .frame{
  aspect-ratio:16/10; overflow:hidden; background:var(--ink-2);
}
.media-tile img,.media-tile video{
  width:100%; height:100%; object-fit:cover;
  transition:transform .8s var(--ease); filter:saturate(.9) brightness(.86);
}
.media-tile:hover img,.media-tile:hover video{ transform:scale(1.05); filter:saturate(1.05) brightness(1); }
.media-tile .cap{ padding:16px 18px 20px; }
.media-tile .cap b{ display:block; font-family:var(--display); font-size:1.02rem; font-weight:450; color:var(--paper); }
.media-tile .cap p{ margin:6px 0 0; font-size:.8rem; color:var(--tx-dim); line-height:1.5; }
.media-tile .kind{
  position:absolute; top:12px; left:12px;
  font-family:var(--mono); font-size:.55rem; letter-spacing:.15em;
  text-transform:uppercase; color:var(--ink); background:var(--gold);
  padding:3px 8px; border-radius:2px;
}
.media-tile .play{
  position:absolute; inset:0 0 auto; aspect-ratio:16/10;
  display:grid; place-items:center; pointer-events:none;
  transition:opacity .3s var(--ease);
}
.media-tile .play span{
  width:54px; height:54px; border-radius:50%;
  background:rgba(4,18,12,.6); border:1px solid var(--gold);
  display:grid; place-items:center; color:var(--gold-lt);
  transition:background .25s var(--ease);
}
.media-tile:hover .play span{ background:var(--gold); color:var(--ink); }

/* ── offers ──────────────────────────────────────────────── */

.offer-grid{
  display:grid; gap:2px;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
}
.offer{
  background:var(--bark); padding:28px 26px 26px;
  display:flex; flex-direction:column; position:relative; overflow:hidden;
}
.offer::before{
  content:''; position:absolute; inset:0 auto 0 0; width:2px; background:var(--gold);
  transform:scaleY(0); transform-origin:top; transition:transform .5s var(--ease);
}
.offer:hover::before{ transform:scaleY(1); }
.offer .win{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.15em;
  text-transform:uppercase; color:var(--gold);
}
.offer h3{ font-size:1.2rem; margin:12px 0 10px; }
.offer p{ margin:0 0 22px; font-size:.875rem; color:var(--tx-mute); }
.offer a{
  margin-top:auto; align-self:flex-start;
  font-family:var(--mono); font-size:.63rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold-lt); text-decoration:none;
  border-bottom:1px solid var(--line); padding-bottom:4px;
  transition:border-color .22s var(--ease),color .22s var(--ease);
}
.offer a:hover{ color:var(--paper); border-bottom-color:var(--gold); }

/* ── quality / assurance strip ───────────────────────────── */

.pillars{
  display:grid; gap:2px;
  grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
}
.pillar{ background:var(--bark); padding:28px 24px; }
.pillar .n{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.18em;
  color:var(--gold); text-transform:uppercase;
}
.pillar h4{ font-size:1.1rem; margin:12px 0 9px; }
.pillar p{ margin:0; font-size:.85rem; color:var(--tx-mute); }

/* ── people ──────────────────────────────────────────────── */

.people{
  display:grid; gap:2px;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
}
.person{ background:var(--bark); overflow:hidden; }
.person .frame{
  aspect-ratio:4/5; overflow:hidden; background:var(--ink-2);
}
.person img{
  width:100%; height:100%; object-fit:cover; object-position:top center;
  filter:grayscale(.28) contrast(1.03);
  transition:filter .5s var(--ease),transform .8s var(--ease);
}
.person:hover img{ filter:none; transform:scale(1.03); }
.person .cap{ padding:20px 22px 24px; }
.person h4{ font-size:1.1rem; margin-bottom:5px; }
.person .role{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.15em;
  text-transform:uppercase; color:var(--gold); margin:0 0 12px;
}
.person p{ margin:0; font-size:.83rem; color:var(--tx-mute); line-height:1.55; }

/* ── contact ─────────────────────────────────────────────── */

.contact{
  display:grid; gap:clamp(28px,5vw,72px);
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  align-items:start;
}
.contact-lines{ display:grid; gap:0; border-top:1px solid var(--line-3); }
.contact-lines a,.contact-lines div{
  display:grid; grid-template-columns:120px minmax(0,1fr); gap:16px;
  padding:15px 0; border-bottom:1px solid var(--line-3);
  text-decoration:none; align-items:baseline;
}
.contact-lines .k{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--tx-dim);
}
.contact-lines .v{ color:var(--paper); font-size:.94rem; }
.contact-lines a:hover .v{ color:var(--gold-lt); }

.form{ display:grid; gap:16px; }
.field label{
  display:block; font-family:var(--mono); font-size:.6rem;
  letter-spacing:.15em; text-transform:uppercase;
  color:var(--tx-dim); margin-bottom:7px;
}
.field input,.field select,.field textarea{
  width:100%; background:rgba(10,33,21,.6);
  border:1px solid var(--line-2); border-radius:2px;
  padding:11px 13px; color:var(--paper); font-size:.92rem;
  transition:border-color .22s var(--ease),background .22s var(--ease);
}
.field textarea{ min-height:112px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:0; border-color:var(--gold); background:rgba(15,46,31,.8);
}
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }

.btn{
  display:inline-flex; align-items:center; gap:10px; justify-content:center;
  font-family:var(--mono); font-size:.67rem; letter-spacing:.15em;
  text-transform:uppercase; padding:13px 26px;
  background:var(--gold); color:var(--ink); border-radius:2px;
  font-weight:500; transition:background .22s var(--ease);
}
.btn:hover{ background:var(--gold-lt); }
.btn.ghost{ background:transparent; border:1px solid var(--gold); color:var(--gold); }
.btn.ghost:hover{ background:var(--gold); color:var(--ink); }

.form-note{ font-size:.76rem; color:var(--tx-dim); margin:0; }
.form-msg{
  font-family:var(--mono); font-size:.66rem; letter-spacing:.1em;
  padding:11px 14px; border-radius:2px; display:none;
}
.form-msg.ok{ display:block; background:rgba(148,174,99,.14); color:#B7CE86; border:1px solid rgba(148,174,99,.34); }
.form-msg.err{ display:block; background:rgba(199,74,80,.13); color:#E39298; border:1px solid rgba(199,74,80,.32); }

/* ── footer ──────────────────────────────────────────────── */

.foot{ padding:clamp(46px,7vh,76px) 0 34px; background:var(--ink-2); }
.foot-top{
  display:grid; gap:clamp(26px,4vw,56px);
  grid-template-columns:minmax(0,1.3fr) repeat(auto-fit,minmax(150px,1fr));
  padding-bottom:34px; border-bottom:1px solid var(--line-3);
}
.foot h5{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.17em;
  text-transform:uppercase; color:var(--gold); margin:0 0 14px; font-weight:400;
}
.foot ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.foot ul a{ text-decoration:none; font-size:.85rem; color:var(--tx-mute); transition:color .2s var(--ease); }
.foot ul a:hover{ color:var(--paper); }
.foot .about p{ margin:0 0 16px; font-size:.85rem; color:var(--tx-mute); max-width:44ch; }
.foot-base{
  display:flex; flex-wrap:wrap; gap:12px 26px;
  justify-content:space-between; padding-top:24px;
}
.foot-base p{ margin:0; font-family:var(--mono); font-size:.61rem; letter-spacing:.11em; color:var(--tx-dim); }
.foot-base a{ color:var(--tx-dim); text-decoration:none; }
.foot-base a:hover{ color:var(--gold); }

/* ── reveal ──────────────────────────────────────────────── */

.rv{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
.rv.in{ opacity:1; transform:none; }

/* ── responsive ──────────────────────────────────────────── */

@media (max-width:1000px){
  .arch{ grid-template-columns:repeat(2,1fr); }
  .brand-intro{ grid-template-columns:1fr; align-items:start; gap:26px; }
  .contact{ grid-template-columns:1fr; }
  .sheet{ grid-template-columns:1fr; }
  .sheet-shot{ min-height:220px; max-height:38vh; }
}

@media (max-width:860px){
  .mast nav{
    position:fixed; inset:var(--nav) 0 auto; flex-direction:column;
    align-items:stretch; gap:0; padding:10px var(--pad) 22px;
    background:rgba(4,18,12,.98); border-bottom:1px solid var(--line);
    transform:translateY(-12px); opacity:0; pointer-events:none;
    transition:transform .3s var(--ease),opacity .3s var(--ease);
  }
  .mast nav.open{ transform:none; opacity:1; pointer-events:auto; }
  .mast nav a{ padding:13px 0; border-bottom:1px solid var(--line-3); }
  .mast .cta{ display:none; }
  .burger{ display:block; }
  .news-item{ grid-template-columns:1fr; gap:10px; }
  .news-item .meta{ display:flex; align-items:center; gap:12px; }
  .news-item .meta .tag{ margin-top:0; }
  .field-row{ grid-template-columns:1fr; }
  .shelf{ grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); }
  .spec-card{ padding:16px 14px 18px; }
  .spec-card h4{ font-size:.95rem; }
}

@media (max-width:520px){
  .arch{ grid-template-columns:1fr; }
  .hero h1{ font-size:clamp(2.1rem,9vw,2.9rem); }
  .brand-stats{ gap:20px; }
  .brand-stats div span{ font-size:1.5rem; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .rv{ opacity:1; transform:none; }
}

@media print{
  .mast,.brand-rail,.toolbar,.sheet-bd,.hero-bg{ display:none !important; }
  body{ background:#fff; color:#000; }
}
