/* ═══════════════════════════════════════════════════════════════════════════
   NAVALO'S HOMEPAGE (owner, 15 Oct 2026: the approved redesign, "Navalo
   Homepage Redesign", desktop 1440 and phone 390).

   Rendered by js/modules/yh-appv2.js: nvh2HTML() on computers and tablets
   (.dkhome.nvh2) and nvm2HTML() on phones (.nvm2-app / .nvm2), and ONLY on
   Navalo: deskHomeHTML() and homeHTML() hand over to them when the deployment
   is neither Stitcha nor Workwear. No other page carries these classes, so
   this sheet changes nothing on Stitcha or Workwear, and nothing outside
   Navalo's homepage.

   ── SCOPE ────────────────────────────────────────────────────────────────────
   Computers and tablets: every rule under #yha2Root .nvh2, inside
   (min-width:561px), the app's own switch (css/desktop-appv2.css). Phones:
   every rule under #yha2Root .nvm2-app, inside (max-width:560px)
   (css/mobile-appv2.css). The ID keeps each rule ahead of the app's resets
   (#yha2Root h1,h2,h3,p{margin:0} and the like).

   ── TYPE ─────────────────────────────────────────────────────────────────────
   Body text is DM Sans, as everywhere. The headings (h1, h2) are Playfair
   Display at 400 As now: the fonts runtime names them in SiteFonts.AS_NOW
   ('navhome'),
   and a heading font chosen in Admin Tools > Copy > Fonts and sizes draws
   them instead (its rules carry !important and an ID). Sizes are the
   canvas's at 1440 and shrink with the window below it.
   ═══════════════════════════════════════════════════════════════════════════ */

@media (min-width:561px){

  #yha2Root .nvh2{
    --nv-bg:#F7F5F0; --nv-ink:#14202E; --nv-navy:#0E2238; --nv-mut:#5A6472; --nv-mut2:#46505E;
    --nv-body:#2C3644; --nv-sand:#EFEBE3; --nv-line:#E6E1D8; --nv-link:#2F5F98; --nv-link-h:#1E4775;
    --nv-serif:'Playfair Display',Georgia,'Times New Roman',serif;
    --nv-pad:clamp(24px,4.45vw,64px);
    background:var(--nv-bg); color:var(--nv-ink); line-height:1.3;
    font-family:'DM Sans','Helvetica Neue',Helvetica,sans-serif;
  }
  #yha2Root .nvh2 a{ color:var(--nv-link); text-decoration:none; }
  #yha2Root .nvh2 a:hover{ color:var(--nv-link-h); }
  #yha2Root .nvh2 :is(a,button):focus-visible{ outline:2px solid var(--nv-link); outline-offset:3px; }
  /* the buttons that are links in the design: no button look of their own */
  #yha2Root .nvh2 :is(.nvh2-nav,.nvh2-menu,.nvh2-foot) button{ background:none; border:0; padding:0; margin:0; font:inherit; color:inherit; cursor:pointer; text-align:left; }
  #yha2Root .nvh2-wrap{ max-width:1440px; margin:0 auto; padding:0 var(--nv-pad); box-sizing:border-box; }

  /* small capitals lines */
  #yha2Root .nvh2-kick{ font-size:12px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--nv-mut); }
  /* the headings */
  #yha2Root .nvh2 :is(h1,h2){ margin:0; font-family:var(--nv-serif); font-weight:400; color:var(--nv-navy); }
  #yha2Root .nvh2 h1{ font-size:clamp(46px,4.6vw,66px); line-height:1.04; letter-spacing:-.01em; max-width:620px; text-wrap:balance; }
  #yha2Root .nvh2 h2{ font-size:clamp(36px,3.2vw,46px); line-height:1.1; }

  /* buttons */
  #yha2Root .nvh2-btn{ display:inline-flex; align-items:center; gap:10px; background:var(--nv-navy); color:#fff; font-family:inherit;
    font-size:15px; font-weight:600; line-height:1.3; padding:15px 24px; border:0; border-radius:4px; cursor:pointer; white-space:nowrap; text-decoration:none; }
  #yha2Root .nvh2 a.nvh2-btn{ color:#fff; }
  #yha2Root .nvh2-btn:hover, #yha2Root .nvh2 a.nvh2-btn:hover{ background:#1A3350; color:#fff; }
  #yha2Root .nvh2-ghost, #yha2Root .nvh2-ghost:hover{ background:rgba(255,255,255,.7); color:var(--nv-navy); border:1px solid var(--nv-navy); padding:14px 24px; }
  #yha2Root .nvh2-ghost:hover{ background:#fff; }
  #yha2Root .nvh2 a.nvh2-white, #yha2Root .nvh2 a.nvh2-white:hover{ background:#fff; color:var(--nv-navy); }
  #yha2Root .nvh2 a.nvh2-white:hover{ background:var(--nv-sand); }

  /* ── header ─────────────────────────────────────────────────────────── */
  #yha2Root .nvh2-top{ position:relative; z-index:20; background:#fff; border-bottom:1px solid var(--nv-line); }
  #yha2Root .nvh2-top-in{ height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
  #yha2Root .nvh2-logo{ display:flex; align-items:center; background:none; border:0; padding:0; cursor:pointer; flex:none; }
  #yha2Root .nvh2-logo img{ height:30px; width:auto; display:block; }
  #yha2Root .nvh2-nav{ display:flex; gap:40px; font-size:14px; font-weight:500; }
  #yha2Root .nvh2-nav :is(a,button), #yha2Root .nvh2-nav a:hover{ color:var(--nv-ink); }
  #yha2Root .nvh2-nav :is(a,button):hover{ text-decoration:underline; text-underline-offset:5px; }
  #yha2Root .nvh2-act{ display:flex; align-items:center; gap:22px; flex:none; }
  #yha2Root .nvh2-topcta{ font-size:14px; padding:12px 20px; }
  #yha2Root .nvh2-bag, #yha2Root .nvh2-bag:hover{ position:relative; display:flex; color:var(--nv-ink); }
  #yha2Root .nvh2-bag-n{ position:absolute; top:-7px; right:-9px; min-width:17px; height:17px; padding:0 4px; border-radius:9px;
    background:var(--nv-navy); color:#fff; font-size:10.5px; font-weight:700; line-height:17px; text-align:center; box-sizing:border-box; }
  #yha2Root .nvh2-menubtn{ display:none; align-items:center; justify-content:center; width:40px; height:40px; margin:0 -8px 0 -10px;
    background:none; border:0; padding:0; color:var(--nv-ink); cursor:pointer; }
  #yha2Root .nvh2-menu{ position:absolute; top:100%; left:0; right:0; display:flex; flex-direction:column; background:#fff;
    border-bottom:1px solid var(--nv-line); padding:6px var(--nv-pad) 14px; box-shadow:0 18px 30px -22px rgba(14,34,56,.45); }
  #yha2Root .nvh2-menu[hidden]{ display:none; }
  #yha2Root .nvh2-menu :is(a,button), #yha2Root .nvh2-menu a:hover{ display:block; width:100%; padding:13px 0; font-size:15px; font-weight:500;
    color:var(--nv-ink); border-bottom:1px solid var(--nv-sand); }

  /* ── hero ───────────────────────────────────────────────────────────── */
  #yha2Root .nvh2-hero{ position:relative; height:640px; overflow:hidden; background:#DCE3E8; }
  /* the media is dkHeroMedia()'s (the video, or the Imagery tab's picture);
     the old hero's dark wash and top shade are not part of this design */
  #yha2Root .nvh2 .nvh2-hero-bg::after{ content:none; }
  #yha2Root .nvh2 .nvh2-hero-bg .dk-hero-topshade{ display:none; }
  #yha2Root .nvh2 .nvh2-hero-bg img{ object-position:72% 40%; }
  #yha2Root .nvh2-hero-fade{ position:absolute; inset:0;
    background:linear-gradient(90deg,rgba(247,245,240,.96) 0%,rgba(247,245,240,.86) 34%,rgba(247,245,240,0) 62%); }
  #yha2Root .nvh2-hero-in{ position:relative; height:100%; display:flex; flex-direction:column; justify-content:center; gap:22px; }
  #yha2Root .nvh2-hero .nvh2-kick{ color:var(--nv-mut2); }
  #yha2Root .nvh2-lede{ margin:0; font-size:18px; line-height:1.55; color:var(--nv-body); max-width:460px; }
  #yha2Root .nvh2-btns{ display:flex; gap:14px; flex-wrap:wrap; margin-top:8px; }

  /* ── the four-point strip: the points share the band equally ─────────── */
  #yha2Root .nvh2-pts{ background:var(--nv-sand); border-bottom:1px solid #E2DCD1; }
  #yha2Root .nvh2-pts-in{ padding-top:30px; padding-bottom:30px; display:grid; gap:32px; grid-template-columns:repeat(4,minmax(0,1fr)); }
  #yha2Root .nvh2-pts-in[data-n="1"]{ grid-template-columns:minmax(0,1fr); }
  #yha2Root .nvh2-pts-in[data-n="2"]{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #yha2Root .nvh2-pts-in[data-n="3"]{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  #yha2Root .nvh2-pts-in[data-n="5"]{ grid-template-columns:repeat(5,minmax(0,1fr)); gap:24px; }
  #yha2Root .nvh2-pts-in[data-n="6"]{ grid-template-columns:repeat(6,minmax(0,1fr)); gap:20px; }
  #yha2Root .nvh2-pt{ display:flex; gap:16px; align-items:center; min-width:0; }
  #yha2Root .nvh2-pt-ic{ flex:none; display:flex; color:var(--nv-navy); }
  #yha2Root .nvh2-pt svg{ width:34px; height:34px; display:block; }
  /* the set's 1.6 stroke is drawn for 24px; at 34px this keeps the design's line */
  #yha2Root .nvh2-pt svg *{ stroke-width:1.15px; }
  #yha2Root .nvh2-pt b{ display:block; font-size:15px; font-weight:600; color:var(--nv-ink); }
  #yha2Root .nvh2-pt div > span{ display:block; font-size:13px; color:var(--nv-mut); margin-top:3px; }

  /* ── section heads (the collection, the edit) ─────────────────────────── */
  #yha2Root .nvh2-sec{ padding:88px 0 84px; }
  #yha2Root .nvh2-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:34px; flex-wrap:wrap; }
  #yha2Root .nvh2-head .nvh2-kick{ margin-bottom:12px; }
  #yha2Root .nvh2-more{ display:flex; gap:8px; align-items:center; font-size:15px; font-weight:600; }

  /* ── the collection ─────────────────────────────────────────────────── */
  #yha2Root .nvh2-cats{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:18px; }
  #yha2Root .nvh2 a.nvh2-cat, #yha2Root .nvh2 a.nvh2-cat:hover{ display:flex; flex-direction:column; gap:14px; color:var(--nv-ink); }
  #yha2Root .nvh2-cat-img{ display:block; aspect-ratio:3/4; background:#E7E2D9; overflow:hidden; }
  #yha2Root .nvh2-cat-img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
  #yha2Root .nvh2-cat:hover .nvh2-cat-img img{ transform:scale(1.03); }
  #yha2Root .nvh2-cat b{ display:flex; justify-content:space-between; gap:8px; font-size:15px; font-weight:600; }

  /* ── the two photo panels ───────────────────────────────────────────── */
  #yha2Root .nvh2-split{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  #yha2Root .nvh2-panel{ position:relative; height:620px; overflow:hidden; background:#1B2B3C; }
  #yha2Root .nvh2-panel-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 35%; }
  #yha2Root .nvh2-panel + .nvh2-panel .nvh2-panel-img{ object-position:50% 40%; }
  #yha2Root .nvh2-panel::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,22,36,0) 40%,rgba(10,22,36,.78) 100%); }
  #yha2Root .nvh2-panel-tx{ position:absolute; z-index:1; left:clamp(24px,3.9vw,56px); right:clamp(24px,3.9vw,56px); bottom:52px;
    display:flex; flex-direction:column; gap:14px; color:#fff; }
  #yha2Root .nvh2-panel-tx .nvh2-kick{ color:#fff; }
  #yha2Root .nvh2 .nvh2-panel h2{ color:#fff; font-size:clamp(32px,2.92vw,42px); line-height:1.12; }
  #yha2Root .nvh2 .nvh2-panel-tx a, #yha2Root .nvh2 .nvh2-panel-tx a:hover{ align-self:flex-start; color:#fff; font-size:15px; font-weight:600;
    text-decoration:underline; text-underline-offset:5px; }

  /* ── the Navalo edit ────────────────────────────────────────────────── */
  #yha2Root .nvh2-sec + .nvh2-sec, #yha2Root .nvh2-split + .nvh2-sec{ padding-bottom:88px; }
  #yha2Root .nvh2-cards{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:20px; }
  #yha2Root .nvh2 a.nvh2-card, #yha2Root .nvh2 a.nvh2-card:hover{ display:flex; flex-direction:column; gap:10px; color:var(--nv-ink); }
  /* the photo sits inside the box's padding at whatever its own shape, never stretching the box */
  #yha2Root .nvh2-card-img{ position:relative; display:block; background:#EEEAE3; aspect-ratio:1/1.08; overflow:hidden; }
  #yha2Root .nvh2-card-img img{ position:absolute; inset:18px; width:calc(100% - 36px); height:calc(100% - 36px); object-fit:contain; display:block; mix-blend-mode:multiply; }
  #yha2Root .nvh2-card-nm{ font-size:15px; font-weight:600; line-height:1.35; }
  #yha2Root .nvh2-card:hover .nvh2-card-nm{ text-decoration:underline; text-underline-offset:4px; }
  #yha2Root .nvh2-card-pr{ font-size:14px; color:var(--nv-mut2); }
  #yha2Root .nvh2-dots{ display:flex; flex-wrap:wrap; gap:7px; }
  #yha2Root .nvh2-dots span{ width:13px; height:13px; border-radius:50%; display:block; box-shadow:inset 0 0 0 1px rgba(20,32,46,.25); }

  /* ── crew stores ────────────────────────────────────────────────────── */
  #yha2Root .nvh2-crew{ background:var(--nv-sand); }
  #yha2Root .nvh2-crew-in{ padding-top:88px; padding-bottom:88px; display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:56px; align-items:center; }
  #yha2Root .nvh2-crew-tx{ display:flex; flex-direction:column; gap:22px; }
  #yha2Root .nvh2 .nvh2-crew h2{ font-size:clamp(40px,3.75vw,54px); line-height:1.06; }
  #yha2Root .nvh2-crew-p{ margin:0; font-size:17px; line-height:1.6; color:var(--nv-body); max-width:460px; }
  #yha2Root .nvh2-ticks{ list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column; gap:14px; font-size:15px; font-weight:500; }
  #yha2Root .nvh2-ticks li{ display:flex; gap:12px; align-items:center; }
  #yha2Root .nvh2-ticks svg{ flex:none; display:block; }
  #yha2Root .nvh2-crew-act{ display:flex; gap:26px; align-items:center; flex-wrap:wrap; margin-top:10px; }
  #yha2Root .nvh2 a.nvh2-how{ display:flex; gap:8px; align-items:center; color:var(--nv-navy); font-size:15px; font-weight:600; }
  #yha2Root .nvh2 a.nvh2-how:hover{ text-decoration:underline; text-underline-offset:5px; }
  #yha2Root .nvh2-crew-img img{ width:100%; height:auto; display:block; }

  /* ── closing band ───────────────────────────────────────────────────── */
  #yha2Root .nvh2-more-band{ position:relative; height:560px; overflow:hidden; background:#0F2133; }
  #yha2Root .nvh2-band-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:60% 35%; }
  #yha2Root .nvh2-band-fade{ position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,18,30,.88) 0%,rgba(8,18,30,.62) 38%,rgba(8,18,30,.1) 72%); }
  #yha2Root .nvh2-band-in{ position:relative; height:100%; display:flex; flex-direction:column; justify-content:center; gap:20px; color:#fff; }
  #yha2Root .nvh2-band-in .nvh2-kick{ color:#fff; }
  #yha2Root .nvh2 .nvh2-more-band h2{ color:#fff; font-size:clamp(42px,4.03vw,58px); line-height:1.05; }
  #yha2Root .nvh2-band-p{ margin:0; font-size:17px; line-height:1.6; max-width:420px; color:#E3E8EE; }
  #yha2Root .nvh2-band-in .nvh2-btn{ align-self:flex-start; margin-top:8px; }

  /* ── footer ─────────────────────────────────────────────────────────── */
  #yha2Root .nvh2-foot{ background:var(--nv-navy); color:#C9D1DB; }
  #yha2Root .nvh2-foot-in{ padding-top:64px; padding-bottom:40px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; font-size:14px; }
  #yha2Root .nvh2-foot-brand{ display:flex; flex-direction:column; gap:16px; }
  #yha2Root .nvh2-foot-brand img{ height:28px; width:auto; align-self:flex-start; }
  #yha2Root .nvh2-foot-brand span{ line-height:1.6; max-width:240px; }
  #yha2Root .nvh2-foot nav{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
  #yha2Root .nvh2-foot nav b{ color:#fff; font-weight:600; letter-spacing:.08em; font-size:12px; text-transform:uppercase; }
  #yha2Root .nvh2 .nvh2-foot nav :is(a,button){ color:#C9D1DB; font-size:14px; }
  #yha2Root .nvh2 .nvh2-foot nav :is(a,button):hover{ color:#fff; }
  #yha2Root .nvh2-copy{ padding-top:22px; padding-bottom:30px; border-top:1px solid rgba(255,255,255,.12); font-size:13px; color:#9AA6B4; }
}

/* the canvas's 1000px step: collection three a row, the edit three a row,
   the strip two a line, the panels, crew stores and the footer stacked or
   two a row, and the menu behind a button */
@media (min-width:561px) and (max-width:1000px){
  /* the words take more of a narrower hero: the wash reaches further */
  #yha2Root .nvh2-hero-fade{ background:linear-gradient(90deg,rgba(247,245,240,.96) 0%,rgba(247,245,240,.88) 52%,rgba(247,245,240,0) 86%); }
  #yha2Root .nvh2-nav{ display:none; }
  #yha2Root .nvh2-menubtn{ display:flex; }
  #yha2Root .nvh2-cats, #yha2Root .nvh2-cards{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  #yha2Root .nvh2-pts-in:is([data-n="2"],[data-n="3"],[data-n="4"],[data-n="5"],[data-n="6"]){ grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 32px; }
  #yha2Root .nvh2-split, #yha2Root .nvh2-crew-in{ grid-template-columns:minmax(0,1fr); }
  #yha2Root .nvh2-foot-in{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (min-width:1001px){
  #yha2Root .nvh2-menu{ display:none; }
}

/* ══ PHONES (Mobile.dc.html) ═══════════════════════════════════════════════ */
@media (max-width:560px){

  #yha2Root .nvm2-app{
    --nv-ink:#14202E; --nv-navy:#0E2238; --nv-mut:#5A6472; --nv-mut2:#46505E; --nv-body:#2C3644; --nv-sand:#EFEBE3;
    --nv-line:#E6E1D8; --nv-link:#2F5F98; --nv-link-h:#1E4775;
    --nv-serif:'Playfair Display',Georgia,'Times New Roman',serif;
    color:var(--nv-ink); font-family:'DM Sans','Helvetica Neue',Helvetica,sans-serif; line-height:1.3;
  }
  #yha2Root .nvm2-app a{ color:var(--nv-link); text-decoration:none; }
  #yha2Root .nvm2-app :is(a,button):focus-visible{ outline:2px solid var(--nv-link); outline-offset:3px; }
  #yha2Root .nvm2-app :is(.nvh2-menu,.nvm2-foot) button{ background:none; border:0; padding:0; margin:0; font:inherit; color:inherit; cursor:pointer; text-align:left; }
  #yha2Root .nvm2{ background:#F7F5F0; }

  /* header: ☰, the logo centred, the bag */
  #yha2Root .nvm2-hd{ position:relative; z-index:62; flex:0 0 auto; display:grid; grid-template-columns:48px minmax(0,1fr) 48px; align-items:center;
    min-height:60px; padding:env(safe-area-inset-top) 8px 0; background:#fff; border-bottom:1px solid var(--nv-line); box-sizing:border-box; }
  #yha2Root .nvm2-hd-b{ width:44px; height:44px; display:flex; align-items:center; justify-content:center; padding:0; border:0; background:transparent; color:var(--nv-ink); }
  #yha2Root .nvm2-logo{ justify-self:center; display:flex; background:none; border:0; padding:0; }
  #yha2Root .nvm2-logo img{ height:24px; width:auto; display:block; }
  #yha2Root .nvm2-hd .nvh2-bag{ position:relative; width:44px; height:44px; display:flex; align-items:center; justify-content:center; color:var(--nv-ink); }
  #yha2Root .nvm2-hd .nvh2-bag-n{ position:absolute; top:5px; right:3px; min-width:16px; height:16px; padding:0 4px; border-radius:8px; background:var(--nv-navy);
    color:#fff; font-size:10px; font-weight:700; line-height:16px; text-align:center; box-sizing:border-box; }
  #yha2Root .nvm2-hd .nvh2-menu{ position:absolute; top:100%; left:0; right:0; display:flex; flex-direction:column; background:#fff;
    border-bottom:1px solid var(--nv-line); padding:4px 20px 12px; box-shadow:0 18px 30px -22px rgba(14,34,56,.45); }
  #yha2Root .nvm2-hd .nvh2-menu[hidden]{ display:none; }
  #yha2Root .nvm2-hd .nvh2-menu :is(a,button){ display:flex; align-items:center; width:100%; min-height:48px; font-size:16px; font-weight:500;
    color:var(--nv-ink); border-bottom:1px solid var(--nv-sand); }

  /* small capitals lines, headings */
  #yha2Root .nvm2-app .nvh2-kick{ font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--nv-mut); }
  #yha2Root .nvm2-app :is(h1,h2){ margin:0; font-family:var(--nv-serif); font-weight:400; color:var(--nv-navy); }
  #yha2Root .nvm2-app h2{ font-size:32px; line-height:1.12; }

  /* buttons, full width */
  #yha2Root .nvm2-btns{ display:flex; flex-direction:column; gap:10px; margin-top:6px; }
  #yha2Root .nvm2-app .nvm2-btn{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:48px; box-sizing:border-box;
    padding:0 16px; border:0; border-radius:4px; font-family:inherit; font-size:15px; font-weight:600; line-height:1.3; text-align:center; cursor:pointer; text-decoration:none; }
  #yha2Root .nvm2-app .nvm2-white{ background:#fff; color:var(--nv-navy); }
  #yha2Root .nvm2-app .nvm2-line{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.85); }
  #yha2Root .nvm2-app .nvm2-navy{ background:var(--nv-navy); color:#fff; }
  #yha2Root .nvm2-app .nvm2-text{ background:none; color:var(--nv-navy); gap:8px; }

  /* hero: the words over the photo */
  #yha2Root .nvm2-hero{ position:relative; height:600px; overflow:hidden; background:#1B2B3C; }
  #yha2Root .nvm2-hero-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 30%; }
  #yha2Root .nvm2-hero-fade{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,22,36,0) 30%,rgba(10,22,36,.86) 78%); }
  #yha2Root .nvm2-hero-tx{ position:absolute; left:20px; right:20px; bottom:24px; display:flex; flex-direction:column; gap:14px; color:#fff; }
  #yha2Root .nvm2-hero-tx .nvh2-kick{ color:#fff; }
  #yha2Root .nvm2-app h1{ color:#fff; font-size:40px; line-height:1.06; text-wrap:balance; }
  #yha2Root .nvm2-hero .nvh2-lede{ margin:0; font-size:15px; line-height:1.55; color:#E3E8EE; }

  /* the four-point strip, two to a line */
  #yha2Root .nvm2-pts{ background:var(--nv-sand); padding:24px 20px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 16px; }
  #yha2Root .nvm2-pts[data-n="1"]{ grid-template-columns:minmax(0,1fr); }
  #yha2Root .nvm2-pts .nvh2-pt{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; min-width:0; }
  #yha2Root .nvm2-pts svg{ width:30px; height:30px; display:block; color:var(--nv-navy); }
  #yha2Root .nvm2-pts svg *{ stroke-width:1.15px; }
  #yha2Root .nvm2-pts b{ font-size:14px; font-weight:600; }
  #yha2Root .nvm2-pts .nvh2-pt > span{ font-size:12.5px; color:var(--nv-mut); margin-top:-4px; }

  /* the collection and the edit: rows you swipe */
  #yha2Root .nvm2-sec{ padding:48px 0 44px; }
  #yha2Root .nvm2-head{ padding:0 20px; margin-bottom:20px; }
  #yha2Root .nvm2-head .nvh2-kick{ margin-bottom:10px; }
  #yha2Root .nvm2-rail{ display:flex; gap:12px; overflow-x:auto; padding:0 20px; scroll-snap-type:x mandatory; scroll-padding:0 20px; scrollbar-width:none; }
  #yha2Root .nvm2-rail::-webkit-scrollbar{ display:none; }
  #yha2Root .nvm2-rail a.nvh2-cat{ flex:0 0 62%; scroll-snap-align:start; display:flex; flex-direction:column; gap:10px; color:var(--nv-ink); }
  #yha2Root .nvm2-rail .nvh2-cat-img{ display:block; aspect-ratio:3/4; background:#E7E2D9; overflow:hidden; }
  #yha2Root .nvm2-rail .nvh2-cat-img img{ width:100%; height:100%; object-fit:cover; display:block; }
  #yha2Root .nvm2-rail .nvh2-cat b{ display:flex; justify-content:space-between; gap:8px; font-size:14px; font-weight:600; }
  #yha2Root .nvm2-rail a.nvh2-card{ flex:0 0 46%; scroll-snap-align:start; display:flex; flex-direction:column; gap:8px; color:var(--nv-ink); }
  #yha2Root .nvm2-rail .nvh2-card-img{ position:relative; display:block; background:#EEEAE3; aspect-ratio:1/1.08; overflow:hidden; }
  #yha2Root .nvm2-rail .nvh2-card-img img{ position:absolute; inset:12px; width:calc(100% - 24px); height:calc(100% - 24px); object-fit:contain; display:block; mix-blend-mode:multiply; }
  #yha2Root .nvm2-rail .nvh2-card-nm{ font-size:14px; font-weight:600; line-height:1.35; }
  #yha2Root .nvm2-rail .nvh2-card-pr{ font-size:13px; color:var(--nv-mut2); }
  #yha2Root .nvm2-rail .nvh2-dots{ display:flex; flex-wrap:wrap; gap:6px; }
  #yha2Root .nvm2-rail .nvh2-dots span{ width:12px; height:12px; border-radius:50%; display:block; box-shadow:inset 0 0 0 1px rgba(20,32,46,.25); }
  #yha2Root .nvm2-foot-link{ padding:0 20px; margin-top:22px; }
  #yha2Root .nvm2-app a.nvh2-more{ display:inline-flex; gap:8px; align-items:center; min-height:44px; font-size:15px; font-weight:600; }

  /* the two photo panels, stacked */
  #yha2Root .nvm2-split{ display:flex; flex-direction:column; }
  #yha2Root .nvm2-split .nvh2-panel{ position:relative; height:440px; overflow:hidden; background:#1B2B3C; }
  #yha2Root .nvm2-split .nvh2-panel-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 35%; }
  #yha2Root .nvm2-split .nvh2-panel + .nvh2-panel .nvh2-panel-img{ object-position:50% 40%; }
  #yha2Root .nvm2-split .nvh2-panel::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,22,36,0) 35%,rgba(10,22,36,.82) 100%); }
  #yha2Root .nvm2-split .nvh2-panel-tx{ position:absolute; z-index:1; left:20px; right:20px; bottom:28px; display:flex; flex-direction:column; gap:10px; color:#fff; }
  #yha2Root .nvm2-split .nvh2-kick{ color:#fff; }
  #yha2Root .nvm2-app .nvm2-split h2{ color:#fff; font-size:30px; line-height:1.12; }
  #yha2Root .nvm2-app .nvm2-split .nvh2-panel-tx a{ display:flex; align-items:center; gap:.3em; align-self:flex-start; min-height:44px; color:#fff; font-size:15px; font-weight:600;
    text-decoration:underline; text-underline-offset:5px; }

  /* crew stores */
  #yha2Root .nvm2-crew{ background:var(--nv-sand); padding:48px 20px 40px; display:flex; flex-direction:column; gap:18px; }
  /* min(…, vw): the canvas's size from 384px up; on a narrower phone each of
     the heading's two lines still fits on one line in the widest fonts at
     the top size step (Fonts and sizes; tests/site-fonts-size-layout-phone-nav-a) */
  #yha2Root .nvm2-app .nvm2-crew h2{ font-size:min(38px,9.9vw); line-height:1.06; }
  #yha2Root .nvm2-crew .nvh2-crew-p{ margin:0; font-size:15px; line-height:1.6; color:var(--nv-body); }
  #yha2Root .nvm2-crew-img{ margin:4px 0; }
  #yha2Root .nvm2-crew-img img{ width:100%; height:auto; display:block; mix-blend-mode:multiply; }
  #yha2Root .nvm2-crew .nvh2-ticks{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; font-size:14.5px; font-weight:500; }
  #yha2Root .nvm2-crew .nvh2-ticks li{ display:flex; gap:12px; align-items:center; }
  #yha2Root .nvm2-crew .nvh2-ticks svg{ flex:none; display:block; }
  #yha2Root .nvm2-crew .nvm2-btns{ gap:6px; margin-top:8px; }

  /* closing band */
  #yha2Root .nvm2-band{ position:relative; height:540px; overflow:hidden; background:#0F2133; }
  #yha2Root .nvm2-band .nvh2-band-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:55% 30%; }
  #yha2Root .nvm2-band-fade{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,18,30,.1) 20%,rgba(8,18,30,.88) 72%); }
  #yha2Root .nvm2-band-tx{ position:absolute; left:20px; right:20px; bottom:28px; display:flex; flex-direction:column; gap:14px; color:#fff; }
  #yha2Root .nvm2-band-tx .nvh2-kick{ color:#fff; }
  #yha2Root .nvm2-app .nvm2-band h2{ color:#fff; font-size:min(40px,10.4vw); line-height:1.05; }
  #yha2Root .nvm2-band .nvh2-band-p{ margin:0; font-size:15px; line-height:1.6; color:#E3E8EE; }

  /* footer */
  #yha2Root .nvm2-foot{ background:var(--nv-navy); color:#C9D1DB; padding:40px 20px 28px; display:flex; flex-direction:column; gap:26px; font-size:14px; }
  #yha2Root .nvm2-foot > img{ height:24px; width:auto; align-self:flex-start; }
  #yha2Root .nvm2-foot-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 16px; }
  #yha2Root .nvm2-foot nav{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
  #yha2Root .nvm2-foot nav b{ color:#fff; font-weight:600; letter-spacing:.08em; font-size:12px; text-transform:uppercase; }
  #yha2Root .nvm2-app .nvm2-foot nav :is(a,button){ color:#C9D1DB; font-size:14px; }
  #yha2Root .nvm2-copy{ border-top:1px solid rgba(255,255,255,.12); padding-top:18px; font-size:13px; color:#9AA6B4; }
}