/* ══════════════════════════════════════════════════════════════════════════
   AWANA 2026 — Shared Styles
   Fonts, Nav, Footer, Base Utilities, Container, Ultrawide
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Section 0: Self-hosted Inter Font ── */
@font-face{font-family:'Inter';font-style:normal;font-weight:300;font-display:swap;src:url(./fonts/inter-300-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:300;font-display:swap;src:url(./fonts/inter-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(./fonts/inter-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(./fonts/inter-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(./fonts/inter-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(./fonts/inter-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(./fonts/inter-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(./fonts/inter-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(./fonts/inter-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(./fonts/inter-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url(./fonts/inter-800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url(./fonts/inter-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:900;font-display:swap;src:url(./fonts/inter-900-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:900;font-display:swap;src:url(./fonts/inter-900-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ── Section 1: Base Variables & Utilities ── */
:root{--n:#0e1e42;--n2:#162550;--s:#6bd2f3;--o:#f18100;--dark:#080f22;--w:#fff;--gray:#f5f2ec;--lgray:#f9f7f4;}
.sw{display:inline-block;overflow:hidden;vertical-align:bottom;}
.swi{display:inline-block;will-change:transform;}
@keyframes orb-float{0%,100%{transform:translate(0,0) scale(1);}33%{transform:translate(30px,-40px) scale(1.07);}66%{transform:translate(-20px,20px) scale(.95);}}
.orb{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none;animation:orb-float 12s ease-in-out infinite;}
@keyframes pulse-dot{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.5);opacity:.6;}}
.rv,.rv-l,.rv-r,.rv-s{will-change:transform,opacity;}
#prog{background:linear-gradient(90deg,var(--s),var(--o)) !important;}
.magnet{will-change:transform;}
.js-loaded [data-aw26]{opacity:0;transform:translateY(32px);}
.skip-link{position:absolute;top:-100%;left:16px;z-index:9999;background:var(--o);color:#fff;padding:8px 16px;font-size:14px;font-weight:700;text-decoration:none;clip-path:polygon(4px 0%,100% 0%,calc(100% - 4px) 100%,0% 100%)}.skip-link:focus{top:8px}

/* ── Section 2: Global Image Reset ── */
img{max-width:100%;height:auto}
html{scroll-padding-top:80px;cursor:auto;}
body{cursor:auto;}
a,button,[role="button"],[onclick]{cursor:pointer;}
#cr{display:none!important;}

/* ── Section 3: Nav (desktop) ── */
.aw-nav{position:sticky;top:0;z-index:1000;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:rgba(14,30,66,.98);backdrop-filter:blur(20px);border-bottom:1px solid rgba(107,210,243,.08);transition:box-shadow .3s;}
.aw-nav.scrolled{box-shadow:0 4px 40px rgba(0,0,0,.4);}
.aw-nav-logo{display:flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0;}
.aw-nav-logo img{height:28px;width:auto;object-fit:contain;display:block;}
.aw-nav-logo-wm{font-size:18px;font-weight:900;color:#fff;letter-spacing:-.04em;display:none;}
.aw-nav-links{display:flex;align-items:center;gap:4px;list-style:none;height:64px;}
.aw-nav-item{position:relative;height:100%;display:flex;align-items:center;}
.aw-nav-link{display:flex;align-items:center;gap:6px;padding:0 10px;height:100%;color:rgba(255,255,255,.6);text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;transition:color .2s;border:none;background:none;cursor:pointer;white-space:nowrap;position:relative;font-family:inherit;}
.aw-nav-link::after{content:'';position:absolute;bottom:0;left:10px;right:10px;height:2px;background:#6bd2f3;transform:scaleX(0);transform-origin:left;transition:transform .25s;}
.aw-nav-item:hover .aw-nav-link,.aw-nav-link.active{color:#fff;}
.aw-nav-item:hover .aw-nav-link::after,.aw-nav-link.active::after{transform:scaleX(1);}
.aw-nav-chevron{width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;transition:transform .25s;flex-shrink:0;}
.aw-nav-item:hover .aw-nav-chevron{transform:rotate(180deg);}
.aw-dropdown{position:absolute;top:calc(100% + 1px);left:0;background:rgba(14,30,66,.98);border:1px solid rgba(107,210,243,.1);border-top:2px solid #6bd2f3;min-width:240px;padding:8px 0;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s;backdrop-filter:blur(24px);z-index:100;}
.aw-nav-item:hover .aw-dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.aw-dropdown-item{display:flex;align-items:center;gap:12px;padding:11px 20px;color:rgba(255,255,255,.55);text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.02em;transition:color .2s,background .2s;white-space:nowrap;}
.aw-dropdown-item:hover{color:#fff;background:rgba(107,210,243,.06);}
.aw-dropdown-item-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(107,210,243,.08);border:1px solid rgba(107,210,243,.12);clip-path:polygon(7px 0%,100% 0%,calc(100% - 7px) 100%,0% 100%);flex-shrink:0;}
.aw-dropdown-item:hover .aw-dropdown-item-icon{background:rgba(107,210,243,.15);}
.aw-dropdown-divider{height:1px;background:rgba(255,255,255,.05);margin:6px 0;}
.aw-new-badge{font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:#f18100;color:#fff;padding:2px 7px;clip-path:polygon(4px 0%,100% 0%,calc(100% - 4px) 100%,0% 100%);margin-left:auto;flex-shrink:0;}
.aw-nav-cta{background:#f18100;color:#fff;border:none;padding:8px 20px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);position:relative;overflow:hidden;transition:background .2s;text-decoration:none;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;flex-shrink:0;margin-left:12px;font-family:inherit;}
.aw-nav-cta:hover{background:#d97000;}
.aw-nav-cta::before{content:'';position:absolute;inset:0;background:rgba(255,255,255,.15);transform:translateX(-110%) skewX(-18deg);transition:transform .4s;}
.aw-nav-cta:hover::before{transform:translateX(110%) skewX(-18deg);}
.aw-hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;cursor:pointer;padding:8px;border:none;background:none;width:40px;height:40px;flex-shrink:0;}
.aw-hamburger span{display:block;width:22px;height:2px;background:rgba(255,255,255,.8);border-radius:1px;transition:transform .3s,opacity .3s;}

/* ── Section 4: Nav (mobile @media max-width:960px) ── */
@media(max-width:960px){
  .aw-nav{height:60px;padding:0 20px;}
  .aw-nav-logo img{height:22px;}
  .aw-nav-links,.aw-nav-cta{display:none;}
  .aw-hamburger{display:flex;}
  .aw-nav.open .aw-nav-links{
    display:flex;
    flex-direction:column;
    position:fixed;
    top:60px;
    left:0;
    right:0;
    bottom:0;
    height:calc(100vh - 60px);
    overflow-y:auto;
    background:#0a1530;
    padding:8px 0 32px;
    gap:0;
    z-index:9998;
    list-style:none;
    -webkit-overflow-scrolling:touch;
  }
  .aw-nav.open .aw-nav-item{
    height:auto;
    width:100%;
    display:block;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .aw-nav.open .aw-nav-item > a.aw-nav-link{
    height:auto;
    padding:16px 20px;
    font-size:15px;
    width:100%;
    display:flex;
    align-items:center;
    color:rgba(255,255,255,.8);
  }
  .aw-nav.open .aw-nav-item > button.aw-nav-link{
    height:auto;
    padding:16px 20px;
    font-size:15px;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:rgba(255,255,255,.8);
    background:none;
    border:none;
  }
  .aw-nav.open .aw-nav-link::after{display:none;}
  .aw-nav.open .aw-nav-link:hover,
  .aw-nav.open .aw-nav-link:active{color:#6bd2f3;background:rgba(107,210,243,.04);}
  .aw-nav.open .aw-dropdown{
    display:none;
    position:static;
    opacity:1;
    visibility:visible;
    transform:none;
    background:rgba(255,255,255,.03);
    border:none;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
    padding:4px 0 8px;
    min-width:auto;
    width:100%;
    max-height:none;
  }
  .aw-nav.open .aw-nav-item.mob-open .aw-dropdown{display:block;}
  .aw-nav.open .aw-nav-item.mob-open > button.aw-nav-link{color:#6bd2f3;}
  .aw-nav.open .aw-nav-item.mob-open .aw-nav-chevron{transform:rotate(180deg);}
  .aw-dropdown-item{white-space:normal;}
  .aw-nav.open .aw-dropdown-item{padding:12px 32px;font-size:14px;min-height:auto;}
  .aw-nav.open .aw-nav-cta{
    display:flex;
    margin:16px 20px 0;
    clip-path:none;
    justify-content:center;
    align-items:center;
    width:calc(100% - 40px);
    padding:14px 12px;
    font-size:12px;
    letter-spacing:.04em;
    white-space:normal;
    word-break:normal;
    text-align:center;
    line-height:1.25;
    gap:6px;
  }
  .aw-nav.open .aw-nav-cta svg{
    display:none;
  }
  .aw-nav.open .aw-hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .aw-nav.open .aw-hamburger span:nth-child(2){opacity:0;}
  .aw-nav.open .aw-hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}

/* ── Section 5: Footer ── */
.aw-footer{background:#0e1e42;padding:0!important;border-top:none!important;}
.aw-footer-trust{background:rgba(107,210,243,.04);border-top:1px solid rgba(107,210,243,.08);border-bottom:1px solid rgba(107,210,243,.08);padding:16px 24px;display:flex;align-items:center;justify-content:center;gap:12px;}
.aw-trust-label{font-size:12px;font-weight:700;color:rgba(255,255,255,.50);letter-spacing:.04em;}
.aw-trust-stars{display:flex;gap:3px;}
.aw-trust-star{color:#00b67a;font-size:16px;line-height:1;}
.aw-trust-score{font-size:13px;font-weight:800;color:#fff;}
.aw-trust-link{font-size:12px;color:rgba(255,255,255,.45);text-decoration:none;transition:color .2s;}
.aw-trust-link:hover{color:#6bd2f3;}
.aw-footer-top{padding:64px 24px 56px;display:grid;grid-template-columns:1.3fr 1.4fr 1fr 1fr 1fr;gap:36px 32px;align-items:start;}
.aw-footer-nl-h{font-size:13px;font-weight:800;letter-spacing:.02em;color:#fff;margin-bottom:14px;line-height:1.35;}
.aw-footer-logo{margin-bottom:16px;}
.aw-footer-logo img{height:32px;object-fit:contain;display:block;}
.aw-footer-logo-wm{font-size:20px;font-weight:900;color:#fff;letter-spacing:-.04em;display:none;}
.aw-footer-tagline{font-size:14px;color:rgba(255,255,255,.45);line-height:1.65;max-width:220px;margin-bottom:24px;}
.aw-footer-socials{display:flex;gap:10px;}
.aw-footer-social{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);text-decoration:none;transition:background .2s,border-color .2s;}
.aw-footer-social:hover{background:rgba(107,210,243,.1);border-color:rgba(107,210,243,.25);}
.aw-footer-social svg{width:16px;height:16px;fill:rgba(255,255,255,.45);transition:fill .2s;}
.aw-footer-social:hover svg{fill:#6bd2f3;}
.aw-footer-col-h{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.42);margin-bottom:20px;}
.aw-footer-links{list-style:none;display:flex;flex-direction:column;gap:12px;padding:0;margin:0;}
.aw-footer-links a{font-size:14px;color:rgba(255,255,255,.58);text-decoration:none;transition:color .2s;display:flex;align-items:center;gap:8px;}
.aw-footer-links a:hover{color:#6bd2f3;}
.aw-footer-links a .aw-new{font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:#f18100;color:#fff;padding:2px 6px;clip-path:polygon(3px 0%,100% 0%,calc(100% - 3px) 100%,0% 100%);}
.aw-footer-newsletter{grid-column:span 6;border-top:1px solid rgba(255,255,255,.05);padding-top:40px;display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.aw-footer-nl-text h4{font-size:18px;font-weight:800;color:#fff;letter-spacing:-.02em;margin-bottom:6px;}
.aw-footer-nl-text p{font-size:14px;color:rgba(255,255,255,.50);max-width:380px;}
.aw-footer-nl-form{display:flex;gap:0;flex-shrink:0;}
.aw-footer-nl-inp{width:260px;padding:12px 16px;font-size:14px;font-family:inherit;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-right:none;color:#fff;outline:none;transition:border-color .2s;}
.aw-footer-nl-inp::placeholder{color:rgba(255,255,255,.35);}
.aw-footer-nl-inp:focus{border-color:#6bd2f3;}
.aw-footer-nl-btn{background:#f18100;color:#fff;border:none;padding:12px 20px;font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:background .2s;white-space:nowrap;font-family:inherit;}
.aw-footer-nl-btn:hover{background:#d97000;}
.aw-footer-bottom{padding:20px 24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.aw-footer-copy{font-size:12px;color:rgba(255,255,255,.32);}
.aw-footer-legal{display:flex;gap:20px;}
.aw-footer-legal a{font-size:12px;color:rgba(255,255,255,.38);text-decoration:none;transition:color .2s;}
.aw-footer-legal a:hover{color:#6bd2f3;}
.aw-footer-badges{display:flex;gap:8px;}
.aw-footer-badge{font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.32);border:1px solid rgba(255,255,255,.12);padding:4px 11px;}
@media(max-width:960px){
  .aw-footer-top{grid-template-columns:1fr 1fr;gap:32px;}
  .aw-footer-brand{grid-column:span 2;}
  .aw-footer-nl{grid-column:span 2;}
  .aw-footer-bottom{flex-direction:column;text-align:center;}
  .aw-footer-legal{flex-wrap:wrap;justify-content:center;}
}
@media(max-width:600px){
  .aw-footer-top{grid-template-columns:1fr;}
  .aw-footer-brand{grid-column:span 1;}
  .aw-footer-nl{grid-column:span 1;}
  .aw-footer-badges{flex-wrap:wrap;justify-content:center;}
}

/* ── Section 6: Container + Ultrawide ── */
.aw-container{max-width:1440px;margin-left:auto;margin-right:auto;width:100%;}
@media(min-width:1800px){
  .aw-nav{padding:0 calc(50% - 720px);}
  .aw-container{max-width:1440px;}
  .aw-footer-top,.aw-footer-bottom,.aw-footer-trust{max-width:1440px;margin-left:auto;margin-right:auto;}
}
@media(min-width:2400px){
  .aw-nav{padding:0 calc(50% - 720px);}
  .aw-container{max-width:1440px;}
  .aw-footer-top,.aw-footer-bottom,.aw-footer-trust{max-width:1440px;}
}

/* ══════════════════════════════════════════════════════════════════════════
   SECTION 7: Awana 2026 — Typography & Spacing Design System
   Manual de UI — estandarización global de tipografía y espaciado
   ══════════════════════════════════════════════════════════════════════════

   ESCALA TIPOGRÁFICA
   ─────────────────
   H1 Hero      : clamp(44px, 5.5vw, 72px) · weight 900 · lh 1.14
   H2 Sección   : clamp(30px, 3.8vw, 52px) · weight 800 · lh 1.22
   H3 Tarjeta   : clamp(18px, 2vw, 24px)   · weight 800 · lh 1.30
   Subtítulo    : clamp(16px, 1.4vw, 19px) · weight 400 · lh 1.72
   Cuerpo       : 16px                      · weight 400 · lh 1.72
   Label        : 13px · weight 700 · ls .06em · UPPERCASE
   Eyebrow      : 11px · weight 800 · ls .12em · UPPERCASE

   CONTRASTE MÍNIMO
   ────────────────
   Texto principal  fondo oscuro : rgba(255,255,255,0.90)
   Texto secundario fondo oscuro : rgba(255,255,255,0.62)
   Texto principal  fondo claro  : rgba(14,30,66,0.90)
   Texto secundario fondo claro  : rgba(14,30,66,0.62)

   ESPACIADO DE SECCIONES
   ──────────────────────
   Sección estándar : 96px 5%
   Sección compacta : 72px 5%
   Hero             : 100px 5% 120px
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 7A: Design Tokens ── */
:root{
  --aw-fs-hero:clamp(44px,5.5vw,72px);
  --aw-fs-h2:clamp(30px,3.8vw,52px);
  --aw-fs-h3:clamp(18px,2vw,24px);
  --aw-fs-h4:clamp(15px,1.4vw,18px);
  --aw-fs-sub:clamp(16px,1.4vw,19px);
  --aw-fs-body:16px;
  --aw-fs-label:13px;
  --aw-fs-eye:11px;
  /* Line-heights — breathing room to prevent line overlap */
  --aw-lh-hero:1.14;
  --aw-lh-h2:1.22;
  --aw-lh-h3:1.30;
  --aw-lh-body:1.72;
  --aw-sec-pad:96px 5%;
  --aw-sec-pad-sm:72px 5%;
}

/* ── 7B: Hero H1 — enforced across all pages ── */
.hero h1,.page-hero h1,.hero-h,.hero-title,.hero-headline,.ph-h1{
  font-size:var(--aw-fs-hero)!important;
  line-height:var(--aw-lh-hero)!important;
  font-weight:900!important;
  letter-spacing:-.04em!important;
}

/* ── 7C: Section Headings H2 ── */
.sec-h,.sh,.section-h,.feat-h,.service-h,.host-h,
.cta-h,.rep-h,.pod-h,.case-h,.countries-h,.svc-h,
.comp-h,.lm-h,.impact-h,.cta-final-h,.ai-dev-h{
  font-size:var(--aw-fs-h2)!important;
  line-height:var(--aw-lh-h2)!important;
  font-weight:800!important;
  letter-spacing:-.03em!important;
}

/* ── 7D: Card / Sub-section Headings H3 ── */
.card-h,.cap-t,.step-t,.val-t,.fc-name,.jcard-title{
  font-size:var(--aw-fs-h3)!important;
  line-height:var(--aw-lh-h3)!important;
  font-weight:800!important;
  letter-spacing:-.02em!important;
}

/* ── 7E: Subtitle & Body text ── */
.sp{font-size:var(--aw-fs-sub)!important;line-height:var(--aw-lh-body)!important;font-weight:300!important;}
.sec-p{font-size:var(--aw-fs-body)!important;line-height:var(--aw-lh-body)!important;}
.hero-sub,.hero-p,.hero-desc{font-size:var(--aw-fs-sub)!important;line-height:var(--aw-lh-body)!important;}

/* ── 7F: Mark / highlight boxes — prevent line overlap ── */
h1 mark,h2 mark,h3 mark,h4 mark,
h1 .hl,h2 .hl,h3 .hl,h4 .hl{
  padding:3px 10px!important;
  -webkit-box-decoration-break:clone!important;
  box-decoration-break:clone!important;
}
h1:has(mark),h2:has(mark),h3:has(mark),
h1:has(.hl),h2:has(.hl),h3:has(.hl){line-height:1.30!important;}

/* ── 7G: Nav link contrast ── */
.aw-nav-link{color:rgba(255,255,255,.65);}
.aw-dropdown-item{color:rgba(255,255,255,.65);}

/* ── 7H: Responsive typography scaling ── */
@media(max-width:768px){
  :root{
    --aw-fs-hero:clamp(26px,6.5vw,40px);
    --aw-fs-h2:clamp(24px,6vw,38px);
    --aw-fs-h3:clamp(16px,4.5vw,22px);
    --aw-fs-sub:clamp(15px,3.5vw,18px);
    --aw-lh-hero:1.12;
    --aw-lh-h2:1.24;
  }
}
@media(max-width:480px){
  :root{
    --aw-fs-hero:clamp(22px,5.5vw,32px);
    --aw-fs-h2:clamp(22px,7vw,32px);
    --aw-lh-hero:1.12;
    --aw-lh-h2:1.26;
  }
}
/* Ultrawide 4K */
@media(min-width:2400px){
  :root{
    --aw-fs-h2:clamp(38px,3.2vw,62px);
    --aw-fs-hero:clamp(52px,4.8vw,88px);
  }
}

/* ── Section 8: Client Logo Strip ──
   Light cream background + mix-blend-mode:multiply eliminates white/light
   backgrounds from any image format (JPEG, PNG, WebP) without Photoshop.
   White pixels multiply with cream → cream (invisible); dark logo marks stay.
   Fixed 160×56px slot gives equal visual weight to all logos.
   ── */
.clients-sec{background:var(--c)!important;}
.clients-label{color:rgba(14,30,66,.55)!important;}
.clients-track-wrap::before{background:linear-gradient(90deg,var(--c),transparent)!important;}
.clients-track-wrap::after{background:linear-gradient(-90deg,var(--c),transparent)!important;}
.client-logo-wrap{
  height:64px!important;
  padding:0 32px!important;
  flex-shrink:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:transparent!important;
  border:none!important;
}
.client-logo-wrap img{
  width:auto!important;
  height:auto!important;
  max-height:36px!important;
  max-width:140px!important;
  object-fit:contain!important;
  background:transparent!important;
  mix-blend-mode:multiply!important;
  filter:grayscale(1) opacity(.55)!important;
  transition:filter .25s ease,mix-blend-mode .25s ease!important;
  display:block!important;
}
.client-logo-wrap:hover img{
  filter:grayscale(0) opacity(1)!important;
  mix-blend-mode:normal!important;
}

/* ── Section 9: .clo logo strip (inner pages) — same fix as client-logo-wrap ── */
.clients{background:var(--gray,#f5f2ec)!important;}
.cl-wrap::before{background:linear-gradient(90deg,var(--gray,#f5f2ec),transparent)!important;}
.cl-wrap::after{background:linear-gradient(-90deg,var(--gray,#f5f2ec),transparent)!important;}
/* Client logo strip — uniform gray silhouettes for visual consistency.
   Treats every logo as a silhouette (brightness:0 + opacity) so source
   colors, white backgrounds, and varying aspect ratios all normalize to
   the same neutral gray.

   Three cases handled separately because aspect ratios + internal
   padding vary across source files:
   1) Wide rectangular logos (Reddit, MC1, Particle, Moon, Coperniq,
      Marqii) → base height 36px, max-width 170px.
   2) Truly square logos (Thrive AI Health) → height 58px to match
      optical weight of wide logos.
   3) Wide logos saved on a square 200x200 canvas with built-in vertical
      padding (Pilotly, Convesio, Spotify, Zammo) → height 90px so the
      actual artwork inside the padded canvas optically matches ~36px. */
.clo{
  height:120px!important;
  padding:0 32px!important;
  flex-shrink:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:transparent!important;
  border:none!important;
}
.clo img{
  width:auto!important;
  height:36px!important;             /* base height for wide rectangular logos */
  max-height:36px!important;
  max-width:170px!important;
  object-fit:contain!important;
  background:transparent!important;
  filter:brightness(0) opacity(.55)!important;  /* solid gray silhouette */
  mix-blend-mode:normal!important;   /* override any inherited blend mode */
  transition:filter .25s ease,transform .25s ease!important;
}
/* Truly square artwork — render at 58px (no internal padding to compensate for) */
.clo img[src*="thrive-ai-health"]{
  height:58px!important;
  max-height:58px!important;
  max-width:none!important;
}
/* Wide logos saved on square canvas with internal vertical padding —
   render at 90px so the artwork inside the canvas reaches ~36px tall. */
.clo img[src*="pilotly"],
.clo img[src*="spotify"]{
  height:90px!important;
  max-height:90px!important;
  max-width:none!important;
}
/* Spotify's source canvas has less internal padding than Pilotly's, so 90px
   makes its silhouette out-weigh neighboring logos (e.g. Coperniq). Render
   smaller to even out optical weight across the strip. */
.clo img[src*="spotify"]{
  height:78px!important;
  max-height:78px!important;
}
/* Zammo + Convesio have even more internal padding — bump higher */
.clo img[src*="zammo"],
.clo img[src*="convesio"]{
  height:110px!important;
  max-height:110px!important;
  max-width:none!important;
}
.clo:hover img{
  filter:brightness(0) opacity(.9)!important;
  transform:scale(1.05)!important;
}

/* ── Section 10: Photo object-position — prevent face/people crop ──
   Default for all cover-fit photos used across pages: focus on the upper
   portion where faces live. `center 22%` ensures eyes/face stay visible
   across portrait + landscape sources without showing too much headroom. */
.hero-card img,
.team-header-img img,
.impact-img img,
.mis-right img,
.stack-img img,
.bento-photo,
.cap-card-img,
.svc-img,
.svc-cover,
.problem-img img,
.img-cell img,
.what-img img,
.feat-img img,
.bcard-img img,
.feat-avatar img,
.tb-post-img img,
.tb-img img,
.mic img,
.model-img img,
.pb img,
.pb-c img,
.ps img,
.wp img,
.who-cell img,
.expert-photo,
.founder-photo,
.tm-img img,
.rcard-img img,
.roles-intro-img img,
.hero-right img,
.hero-col3 img,
.hpc-img img,
.tcard-img,
.hpc-img,
.split-media img{
  object-position:center 22%!important;
}

/* Decorative full-bleed background photos can stay centered */
.hero-bg img{object-position:center center!important;}

/* Catch-all: any awana-team-photo-XX.jpg gets face-safe positioning
   regardless of its container. Works on desktop + mobile breakpoints. */
img[src*="awana-team-photo-"]{
  object-fit:cover !important;
  object-position:center 22% !important;
}

/* Additional content-image containers not in the Section 10 list above */
.cap-card img,
.founder-photo-wrap img,
.tcard img,
.tcard-img img,
.hero-img img,
.nl-img img,
.svc-img-wrap img,
.img-c img,
.accel-form img,
.bcta-form img,
.who-photos img,
.photoband img,
.photo-split img{
  object-fit:cover !important;
  object-position:center 22% !important;
}

/* Mobile: tighten the face-safe crop a bit (narrower viewports often show
   wider portrait crops; 18% keeps the face higher in the frame) */
@media(max-width:768px){
  img[src*="awana-team-photo-"],
  .pb img,.ps img,.wp img,.hrmg img,.hero-right img,.hero-col3 img,
  .rcard-img img,.bcard-img img,.hero-card img,.who-cell img{
    object-position:center 18% !important;
  }
}

/* ── Section 11: Logo strip animation & label (shared) ── */
@keyframes clA{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.cl-t{display:flex;align-items:center;width:max-content;animation:clA 34s linear infinite!important;}
.cl-lbl{font-size:11px!important;font-weight:800!important;letter-spacing:.14em!important;text-transform:uppercase!important;color:rgba(14,30,66,.55)!important;margin-bottom:24px!important;padding:0 5%!important;}
.clients{padding:52px 0!important;overflow:hidden!important;text-align:center!important;position:relative!important;}
.cl-wrap{overflow:hidden!important;position:relative!important;}
.cl-wrap::before,.cl-wrap::after{content:""!important;position:absolute!important;top:0!important;bottom:0!important;width:100px!important;z-index:2!important;pointer-events:none!important;}
.cl-wrap::before{left:0!important;background:linear-gradient(90deg,var(--gray,#f5f2ec),transparent)!important;}
.cl-wrap::after{right:0!important;background:linear-gradient(-90deg,var(--gray,#f5f2ec),transparent)!important;}

/* ══════════════════════════════════════════════════════════════════════════
   SECTION 12: Layout Alignment — single source of truth (all pages)
   ──────────────────────────────────────────────────────────────────────────
   Every section centers its content in .aw-container (max-width 1440, centered).
   Its left/right inner edge therefore sits at:  max(5%, calc(50% - 720px)).
   We expose that as --aw-gutter and align the hero content (left) and the
   floating job-card panel (right) to the SAME edge, at every screen width.

   Authoritative (!important) so it overrides the legacy per-page inline copies
   that drifted across 26 pages — fix here propagates everywhere, mirroring the
   Section 7 typography-enforcement pattern. Enforced ≥961px only; below that the
   hero is full-bleed / stacked and pages manage their own mobile layout.
   ══════════════════════════════════════════════════════════════════════════ */
:root{ --aw-gutter:max(5%, calc(50% - 720px)); }

@media(min-width:961px){
  /* Hero copy: left edge flush with the container, never viewport-centered */
  .hero-inner{
    margin-left:var(--aw-gutter)!important;
    margin-right:0!important;
    padding-left:0!important;
  }
  /* Floating proof panel: right edge flush with the container, not the viewport */
  .hero-panel{ right:var(--aw-gutter)!important; }
}

/* Decorative elements anchored to the content column, not the viewport edge.
   .human-word bleeds 30px past the container's right edge (its containing block
   is the full-bleed .human section, so we offset from the gutter). */
.problem::before{ left:var(--aw-gutter)!important; }
.human-word{ right:calc(var(--aw-gutter) - 30px)!important; left:auto!important; }
@media(max-width:900px){ .human-word{ display:none!important; } }

/* ══════════════════════════════════════════════════════════════════════════
   SECTION 14: Reusable inline-cta strip — alternates call/form variants
   ────────────────────────────────────────────────────────────────────────── */
.inline-cta{padding:36px 5%!important;text-align:center!important;position:relative!important;overflow:hidden!important;background:#0e1e42!important;}
.inline-cta::before{content:''!important;position:absolute!important;top:0!important;left:50%!important;transform:translateX(-50%)!important;width:120px!important;height:2px!important;opacity:.55!important;}
.inline-cta.cta-call{border-top:1px solid rgba(107,210,243,.10)!important;border-bottom:1px solid rgba(107,210,243,.10)!important;}
.inline-cta.cta-call::before{background:linear-gradient(90deg,transparent,#6bd2f3,transparent)!important;}
.inline-cta.cta-call .inline-cta-eyebrow{color:#6bd2f3!important;}
.inline-cta.cta-call .inline-cta-eyebrow::before{background:#6bd2f3!important;}
.inline-cta.cta-call .inline-cta-btn{background:#6bd2f3!important;color:#0e1e42!important;}
.inline-cta.cta-call .inline-cta-btn:hover{background:#55c4e8!important;}
.inline-cta.cta-form{border-top:1px solid rgba(241,129,0,.10)!important;border-bottom:1px solid rgba(241,129,0,.10)!important;}
.inline-cta.cta-form::before{background:linear-gradient(90deg,transparent,#f18100,transparent)!important;}
.inline-cta.cta-form .inline-cta-eyebrow{color:#f18100!important;}
.inline-cta.cta-form .inline-cta-eyebrow::before{background:#f18100!important;}
.inline-cta.cta-form .inline-cta-btn{background:#f18100!important;color:#fff!important;}
.inline-cta.cta-form .inline-cta-btn:hover{background:#e07500!important;}
.inline-cta-eyebrow{font-size:11px!important;font-weight:800!important;letter-spacing:.14em!important;text-transform:uppercase!important;margin-bottom:10px!important;display:inline-flex!important;align-items:center!important;gap:10px!important;line-height:1!important;}
.inline-cta-eyebrow::before{content:''!important;width:18px!important;height:1.5px!important;}
.inline-cta-h{font-size:clamp(20px,2.6vw,26px)!important;font-weight:900!important;color:#fff!important;letter-spacing:-.02em!important;line-height:1.2!important;margin:0 auto 18px!important;max-width:540px!important;}
.inline-cta-btn{display:inline-flex!important;align-items:center!important;gap:10px!important;border:none!important;padding:12px 26px!important;font-size:13px!important;font-weight:800!important;letter-spacing:.06em!important;text-transform:uppercase!important;text-decoration:none!important;clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%)!important;transition:background .2s,transform .15s!important;cursor:pointer!important;}
.inline-cta-btn:hover{transform:translateY(-1px)!important;}
.inline-cta-note{font-size:11px!important;color:rgba(255,255,255,.45)!important;margin:10px 0 0!important;letter-spacing:.02em!important;}