/* =========================================================================
   Home — Design B · Dark Editorial / fashion campaign
   Scoped under body.home-b, layered on top of main.css
   ========================================================================= */
body.home-b{
  --b-bg:   #0e0c0a;
  --b-bg2:  #161310;
  --b-txt:  #ece6db;
  --b-mut:  #9a9082;
  --b-line: rgba(255,255,255,.12);
  --b-gold: #c79a63;
  --b-disp: "Archivo", var(--sans);
  background:var(--b-bg);
  color:var(--b-txt);
}

/* --- chrome: transparent dark header over hero --- */
body.home-b .site-header{ position:absolute; top:40px; left:0; right:0; background:transparent; border-bottom:1px solid rgba(255,255,255,.08); backdrop-filter:none; }
body.home-b .site-header.is-stuck{ position:fixed; top:0; background:rgba(14,12,10,.92); box-shadow:none; border-bottom-color:rgba(255,255,255,.1); }
body.home-b .brand__name{ color:#fff; }
body.home-b .nav a{ color:#cfc7ba; }
body.home-b .nav a:hover{ color:#fff; }
body.home-b .nav a::after{ background:var(--b-gold); }
body.home-b .header-cta .btn{ background:#fff; color:#111; border-color:#fff; }
body.home-b .header-cta .btn:hover{ background:var(--b-gold); border-color:var(--b-gold); color:#111; }
body.home-b .nav-toggle{ border-color:rgba(255,255,255,.3); }
body.home-b .nav-toggle span,
body.home-b .nav-toggle span::before,
body.home-b .nav-toggle span::after{ background:#fff; }
body.home-b .topbar{ background:transparent; position:absolute; left:0; right:0; z-index:51; border-bottom:1px solid rgba(255,255,255,.08); }

/* --- shared bits --- */
body.home-b .b-kicker{ display:inline-block; font-family:var(--b-disp); font-size:.74rem; font-weight:700; letter-spacing:.32em; text-transform:uppercase; color:var(--b-gold); }
body.home-b .b-h2{ font-family:var(--b-disp); font-weight:800; text-transform:uppercase; line-height:.98; letter-spacing:-.01em; font-size:clamp(2.2rem,5.2vw,4.4rem); margin-top:18px; }
body.home-b .b-head{ margin-bottom:clamp(34px,4vw,60px); }
body.home-b .section{ background:var(--b-bg); }

/* --- HERO --- */
.b-hero{ position:relative; min-height:100vh; display:flex; align-items:flex-end; background:#000; overflow:hidden; }
.b-hero__media{ position:absolute; inset:0; }
.b-hero__media .ph{ width:100%; height:100%; border:0; border-radius:0; background:#141210; animation:kenburns 22s ease-out both; }
.b-hero__media .ph::after{ inset:36px; border-color:rgba(255,255,255,.1); }
.b-hero::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.15) 32%,rgba(0,0,0,.65) 78%,rgba(0,0,0,.9) 100%); }
.b-hero__inner{ position:relative; z-index:2; width:100%; padding-block:clamp(60px,9vw,120px); }
.b-hero .b-kicker{ opacity:0; animation:heroIn .9s var(--ease) .1s forwards; }
.b-hero__title{ font-family:var(--b-disp); font-weight:900; text-transform:uppercase; color:#fff; line-height:.86; letter-spacing:-.02em; font-size:clamp(3.4rem,13vw,12rem); margin:18px 0 0; opacity:0; animation:heroIn 1s var(--ease) .22s forwards; }
.b-hero__title span{ color:transparent; -webkit-text-stroke:1.5px rgba(255,255,255,.85); }
.b-hero__foot{ display:grid; grid-template-columns:1fr auto; gap:40px; align-items:end; margin-top:44px; border-top:1px solid rgba(255,255,255,.18); padding-top:30px; opacity:0; animation:heroIn 1s var(--ease) .42s forwards; }
.b-hero__foot p{ max-width:440px; color:#d7cfc2; font-size:1.02rem; line-height:1.6; }
.b-hero__actions{ display:flex; gap:14px; flex-wrap:wrap; }
.b-hero__actions .btn--ghost{ color:#fff; border-color:rgba(255,255,255,.45); }
.b-hero__actions .btn--ghost:hover{ background:#fff; color:#111; }

/* --- MARQUEE --- */
.b-marquee{ background:var(--b-gold); color:#111; overflow:hidden; border-block:1px solid rgba(0,0,0,.1); }
.b-marquee__track{ display:flex; align-items:center; gap:0; white-space:nowrap; animation:bmarquee 34s linear infinite; }
.b-marquee span{ font-family:var(--b-disp); font-weight:800; text-transform:uppercase; letter-spacing:.06em; font-size:1rem; padding:16px 26px; }
.b-marquee i{ font-style:normal; opacity:.6; }
@keyframes bmarquee{ to{ transform:translateX(-50%); } }

/* --- STATS --- */
.b-stats-sec{ background:var(--b-bg); }
.b-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--b-line); border:1px solid var(--b-line); }
.b-stat{ background:var(--b-bg); padding:clamp(28px,3.4vw,52px) clamp(20px,2vw,38px); }
.b-stat b{ display:block; font-family:var(--b-disp); font-weight:800; font-size:clamp(2.4rem,4.4vw,3.8rem); line-height:1; color:#fff; font-variant-numeric:tabular-nums; }
.b-stat span{ display:block; margin-top:12px; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--b-mut); }

/* --- EDITORIAL SPLIT --- */
.b-editorial{ background:var(--b-bg2); }
.b-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,6vw,90px); align-items:center; }
.b-split__text p{ margin-top:22px; color:#cdc4b6; font-size:1.08rem; max-width:480px; }
.b-list{ margin:30px 0; display:grid; gap:0; }
.b-list li{ display:flex; gap:18px; align-items:center; padding:16px 0; border-top:1px solid var(--b-line); font-size:.98rem; color:#e3dccf; }
.b-list li:last-child{ border-bottom:1px solid var(--b-line); }
.b-list span{ font-family:var(--b-disp); font-weight:800; color:var(--b-gold); font-size:.9rem; }
.b-split__media .ph{ background:#1d1915; }

/* --- GALLERY --- */
.b-gallery-sec{ background:var(--b-bg); }
.b-gallery{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.4vw,20px); }
.b-gcard{ display:block; position:relative; overflow:hidden; }
.b-gcard .ph{ background:#1a1713; transition:transform .7s var(--ease); }
.b-gcard:hover .ph{ transform:scale(1.05); }
.b-gcard__cap{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:16px 2px 0; }
.b-gcard__cap b{ font-family:var(--b-disp); font-weight:700; text-transform:uppercase; letter-spacing:.02em; font-size:.98rem; color:#fff; }
.b-gcard__cap span{ font-size:.74rem; letter-spacing:.1em; color:var(--b-mut); }

/* --- PROCESS --- */
.b-process-sec{ background:var(--b-bg2); }
.b-proc{ display:grid; grid-template-columns:repeat(7,1fr); gap:1px; background:var(--b-line); border:1px solid var(--b-line); }
.b-proc__item{ background:var(--b-bg2); padding:30px 14px; text-align:center; transition:background .3s; }
.b-proc__item:hover{ background:var(--b-bg); }
.b-proc__item b{ display:block; font-family:var(--b-disp); font-weight:800; font-size:1.8rem; color:var(--b-gold); }
.b-proc__item span{ display:block; margin-top:10px; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:#cfc6b8; }

/* --- BRANDS --- */
.b-brands-sec{ background:var(--b-bg); }
.b-brands{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,28px); }
.b-brand .ph{ background:#1a1713; }
.b-brand__cap{ display:flex; justify-content:space-between; align-items:baseline; padding:18px 2px 0; border-top:1px solid var(--b-line); margin-top:16px; }
.b-brand__cap b{ font-family:var(--b-disp); font-weight:800; text-transform:uppercase; letter-spacing:.04em; font-size:1.3rem; color:#fff; }
.b-brand__cap span{ font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--b-gold); }

/* --- INQUIRY (reskin base component) --- */
.b-inquiry-sec{ background:var(--b-bg2); }
body.home-b .inquiry{ background:#121008; border-color:var(--b-line); }
body.home-b .inquiry__aside{ background:#000; }
body.home-b .inquiry__form{ background:#15120d; }
body.home-b .fstep h3{ color:#fff; font-family:var(--b-disp); text-transform:uppercase; }
body.home-b .field label{ color:#b7ad9e; }
body.home-b .field input,
body.home-b .field select,
body.home-b .field textarea{ background:#0e0c08; border-color:var(--b-line); color:#ece6db; }
body.home-b .field input:focus,
body.home-b .field select:focus,
body.home-b .field textarea:focus{ border-color:var(--b-gold); background:#000; }
body.home-b .opt span{ background:#0e0c08; border-color:var(--b-line); color:#cfc6b8; }
body.home-b .opt input:checked + span{ background:var(--b-gold); border-color:var(--b-gold); color:#111; }
body.home-b .dropzone{ background:#0e0c08; border-color:var(--b-line); color:var(--b-mut); }
body.home-b .progress{ background:#2a2419; }
body.home-b .progress__bar{ background:var(--b-gold); }
body.home-b .btn{ background:#fff; color:#111; border-color:#fff; }
body.home-b .btn:hover{ background:var(--b-gold); border-color:var(--b-gold); color:#111; }
body.home-b .btn--ghost{ background:transparent; color:#ece6db; border-color:var(--b-line); }
body.home-b .btn--ghost:hover{ background:#fff; color:#111; border-color:#fff; }
body.home-b .form-note{ color:var(--b-mut); }

/* --- responsive --- */
@media (max-width:960px){
  .b-split{ grid-template-columns:1fr; }
  .b-split__media{ order:-1; }
  .b-stats{ grid-template-columns:repeat(2,1fr); }
  .b-gallery{ grid-template-columns:repeat(2,1fr); }
  .b-proc{ grid-template-columns:repeat(4,1fr); }
  .b-brands{ grid-template-columns:1fr; }
  .b-hero__foot{ grid-template-columns:1fr; gap:24px; }
}
@media (max-width:560px){
  .b-stats{ grid-template-columns:1fr; }
  .b-gallery{ grid-template-columns:1fr 1fr; }
  .b-proc{ grid-template-columns:repeat(2,1fr); }
}