/* HUMHUM V3: approved 2026-10-25 landscape composition.
   Single authoritative override for TOKEN and JOIN THE CLUB.
   The earlier sections and approved raster assets are not modified. */
@media (min-width:1151px) {
  #token.token-fidelity {
    min-height: 555px;
    padding: 0;
    background: linear-gradient(110deg,#fff9ec 0%,#fff6e5 52%,#f7edd7 100%);
    isolation: isolate;
  }
  #token.token-fidelity::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: url('assets/token-cozy-v3.png');
    background-size: min(70vw,1010px) auto;
    background-position: right -4px top 0;
    background-repeat: no-repeat;
    opacity: 1;
  }
  #token .token-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-template-rows: auto 1fr auto;
    align-content: stretch;
    min-height: 555px;
    max-width: 1452px;
    padding: 52px clamp(30px,4.2vw,60px) 28px;
    position: relative;
    z-index: 1;
  }
  #token .token-copy {
    align-self: start;
    max-width: 550px;
    padding: 0;
    z-index: 2;
  }
  #token .eyebrow {margin-bottom: 12px}
  #token h2 {font-size: 70px;margin-bottom: 8px}
  #token h3 {font-size: 24px;margin-bottom: 18px}
  #token .token-description {font-size: 21px;margin-bottom: 22px}
  #token .token-actions .btn {min-height: 61px;padding: 13px 20px;font-size: 17px}
  #token .token-status {margin: 7px 0 0;font-size: 11px}
  #token .token-visual {
    grid-column: 1;
    grid-row: 3;
    align-self: end;
    transform: none;
    padding: 0;
    margin: 0;
    width: 100%;
    position: relative;
    z-index: 3;
  }
  #token .token-benefits {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 9px;
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
  }
  #token .token-benefits>.token-benefit,
  #token .token-benefits>.token-benefit:nth-child(odd),
  #token .token-benefits>.token-benefit:nth-child(-n+2) {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 11px;
    min-height: 82px;
    border: 1px solid #e9e1d4;
    border-radius: 13px;
    background: rgba(255,252,246,.96);
    box-shadow: 0 6px 14px #4235210e;
  }
  #token .token-benefit-icon {width: 48px;height: 48px;flex: 0 0 48px}
  #token .token-benefit-icon .material-symbols {font-size: 32px}
  #token .token-benefit-copy {gap: 3px}
  #token .token-benefit-copy b {font: 750 15px/1.2 Inter,system-ui,sans-serif;white-space: nowrap;letter-spacing:-.025em;-webkit-text-stroke:0}
  #token .token-benefit-copy small {font: 450 11px/1.25 Inter,system-ui,sans-serif;letter-spacing:-.03em;white-space:normal}
  #community.community-fidelity {
    min-height: 390px;
    padding: 0;
    background: #fff9ef;
    isolation: isolate;
  }
  #community.community-fidelity::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('assets/community-station-v3.png') right center / min(70vw,1020px) auto no-repeat;
    opacity: 1;
    z-index: 0;
  }
  #community.community-fidelity::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg,#fff9ef 0%,#fff9ef 25%,#fff9efeb 36%,#fff9efaa 46%,transparent 64%);
    pointer-events: none;
  }
  #community .split {
    max-width: 1452px;
    min-height: 390px;
    display: block;
    padding: 42px clamp(30px,4.2vw,60px) 32px;
    position: relative;
    z-index: 2;
  }
  #community .split>div:first-child {width: 720px;max-width: 720px;position:relative;z-index:2}
  #community .eyebrow {margin-bottom: 10px}
  #community h2 {font-size: 46px;margin-bottom: 10px}
  #community .community-subtitle {font-size: 24px;margin-bottom: 20px}
  #community .btn {
    display: inline-flex;
    vertical-align: top;
    width: 268px;
    min-width: 0;
    min-height: 70px;
    padding: 12px 18px;
    margin: 0 14px 0 0;
    gap: 14px;
    border-radius: 12px;
    font-size: 20px;
  }
  #community .btn.ghost {width: 268px;min-width: 0;margin-right: 0}
  #community .btn small {font-size: 15px}
  #community .social-mark {font-size: 31px}
  #community .btn .telegram-brand-icon {width: 33px;height: 33px}
}
@media (min-width:701px) and (max-width:1150px) {
  #token .token-benefit-copy small {white-space: normal}
  #community .btn {display:inline-flex;vertical-align:top;margin-bottom:8px}
}
@media (max-width:700px) {
  #token.token-fidelity {background:#fff6e9}
  #community.community-fidelity {background:#fff9ef}
}
/* TOKEN artwork must fill the full section height, not sit as a small top inset. */
@media(min-width:1151px){
#token.token-fidelity::before{background-size:min(78vw,1135px) 100%;background-position:right top}
}
@media(min-width:1151px){#token.token-fidelity::before{background-size:min(72vw,1045px) 470px;background-position:right top -38px}}