:root{--page-title-display:none;}/* Start custom CSS *//* WO v2.2 §1A — Access: 3 columns down to 821px, single column at <=820px */
@media (max-width: 820px) {
  #access .e-grid-base { grid-template-columns: 1fr; grid-template-rows: auto; }
}
/* WO v2.2 §1B — Trust: 4 columns >=900px, 2 columns 520-899px, 1 column <520px */
@media (max-width: 899px) {
  #trust .e-grid-base { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; }
}
@media (max-width: 519px) {
  #trust .e-grid-base { grid-template-columns: 1fr; }
}
/* Mobile mockups (Sept 2026): photo backgrounds that the atomic background control cannot size */
@media (max-width: 767px) {
  /* Gold, slightly heavier line icons (icono.svg has a hard-coded black stroke) */
  section#access svg, section#access svg * { stroke: #8a6a3a; stroke-width: 1.5; }
  /* e-svg rewrites the root fill to currentColor; these are line icons */
  section#access svg, section#access svg *, section#trust svg, section#trust svg * { fill: none; }
  /* The V3 footer (template 15) ships a global "svg { opacity: .2 }" that fades these icons until cutover */
  section#access svg, section#trust svg { opacity: 1; }
  /* Hero, as in the mockup: copy on the dark top, the bottle and reports below it. The photo
     (941x1672) is 120% wide and anchored to the bottom, so the bottle starts under the CTA */
  section#top {
    min-height: 1180px;
    justify-content: flex-start;
    padding-top: 150px;
    background-color: #15110e;
    background-image: linear-gradient(180deg, #15110e 0%, rgba(21,17,14,0.92) 30%, rgba(21,17,14,0.7) 44%, rgba(21,17,14,0.15) 60%, rgba(21,17,14,0) 72%), url(https://thehenko.com/wp-content/uploads/2026/10/henko-hero-mobile.png);
    background-size: 100% 100%, 120% auto;
    background-position: 0 0, 60% 100%;
    background-repeat: no-repeat;
  }
  section#representation {
    background-color: #15110e;
    background-image: linear-gradient(180deg, rgba(18,15,12,0.7) 0%, rgba(18,15,12,0.5) 50%, rgba(18,15,12,0) 72%), url(https://thehenko.com/wp-content/uploads/2026/10/mobile.png);
    background-size: 100% 100%, 100% auto;
    background-position: center top, center bottom;
    background-repeat: no-repeat;
  }
  /* Gradient sized to the photo (941x1672 → 177.7vw tall) so it fades into the ground where the copy starts */
  section#beyond {
    background-color: #1b1713;
    background-image: linear-gradient(180deg, rgba(27,23,19,0) 62%, rgba(27,23,19,0.85) 86%, #1b1713 100%), url(https://thehenko.com/wp-content/uploads/2026/10/henko-beyond-mobile.png);
    background-size: 100% 177.7vw, 100% auto;
    background-position: center top, center top;
    background-repeat: no-repeat;
  }
}/* End custom CSS */