/* Affiliate Choice About page v01.10 */
html{scroll-behavior:smooth;scroll-padding-top:140px}
body.about-page{margin:0;background:#fff;color:#0f2a33;font-family:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
.about-page *{box-sizing:border-box}
.ab-shell{width:min(1200px,calc(100% - 48px));margin-inline:auto}
.ab-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#0a7a8e}
.ab-eyebrow span{width:22px;height:2px;background:#10c0df}
.ab-head{max-width:720px;margin-bottom:36px}
.ab-head h2{margin:0;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(34px,3.8vw,52px);line-height:1.04;letter-spacing:-.03em}
.ab-head p{margin:14px 0 0;font-size:18px;line-height:1.6;color:#52696f}
.ab-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:8px;border:1.5px solid transparent;font:700 15.5px/1 "Schibsted Grotesk",system-ui,sans-serif;text-decoration:none;cursor:pointer;transition:background .18s,border-color .18s,color .18s,transform .18s}
.ab-btn:active{transform:translateY(1px)}
.ab-btn-primary{background:#10c0df;color:#fff;border-color:#10c0df}.ab-btn-primary:hover{background:#0daac6;border-color:#0daac6}
.ab-btn-ghost{background:transparent;color:#0f2a33;border-color:#c6d6d5}.ab-btn-ghost:hover{border-color:#10c0df;color:#0a7a8e}
.ab-btn-light{background:#fff;color:#0f2a33}.ab-btn-light:hover{background:#eef5f4}
.ab-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.is-hidden{display:none!important}
.ab-text-link{display:inline-block;margin-top:18px;color:#0a7a8e;font-weight:700;text-decoration:none}.ab-text-link:hover{text-decoration:underline}

/* Hero */
.ab-hero{position:relative;overflow:hidden;padding:76px 0 70px;background:linear-gradient(135deg,#fff 0%,#f5fbfa 55%,#e7f6f5 100%);border-bottom:1px solid #d7e3e2}
.ab-hero::after{content:"";position:absolute;right:-12vw;bottom:-22vw;width:44vw;height:44vw;border-radius:50%;border:1px solid rgba(16,192,223,.18);box-shadow:0 0 0 60px rgba(16,192,223,.035),0 0 0 120px rgba(16,192,223,.025);pointer-events:none}
.ab-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;align-items:center}
.ab-hero h1{margin:0;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(44px,5.4vw,78px);line-height:.98;letter-spacing:-.04em;text-wrap:balance}
.ab-hero h1 em{font-style:normal;color:#0a7a8e;background:linear-gradient(transparent 68%,rgba(16,192,223,.25) 68%)}
.ab-lede{max-width:600px;margin:24px 0 0;font-family:"Source Serif 4",Georgia,serif;font-size:clamp(19px,1.6vw,22px);line-height:1.55;color:#3e565c}

/* Spinner */
.ab-spinner{padding:26px;border-radius:20px;background:#080a0e;color:#fff;box-shadow:0 30px 60px -30px rgba(8,10,14,.55)}
.ab-spinner-kicker{margin:0 0 16px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#10c0df}
.ab-reel{min-height:210px;padding:24px;border-radius:14px;background:linear-gradient(160deg,#141a22,#0d1117);border:1px solid rgba(255,255,255,.08)}
.ab-reel-label{display:block;font-family:Archivo,sans-serif;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#94afb4}
.ab-reel strong{display:block;margin-top:10px;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(32px,3.2vw,44px);line-height:1.02;letter-spacing:-.03em;min-height:1.05em}
.ab-reel strong.is-rolling{color:#94afb4;filter:blur(.4px)}
.ab-reel strong.is-landed{animation:ab-land .45s cubic-bezier(.2,.9,.3,1.3)}
@keyframes ab-land{0%{transform:translateY(8px);opacity:.3}100%{transform:none;opacity:1}}
.ab-reel p{margin:14px 0 0;font-size:15px;line-height:1.55;color:#c9dadd}
.ab-reel-cat{display:inline-block;margin-top:14px;padding:4px 10px;border-radius:999px;background:rgba(16,192,223,.14);color:#10c0df;font-size:12px;font-weight:700}
.ab-reel-cat:empty{display:none}
.ab-spinner-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.ab-spinner .ab-btn-ghost{color:#fff;border-color:rgba(255,255,255,.25)}.ab-spinner .ab-btn-ghost:hover{border-color:#10c0df;color:#10c0df}

/* Stats */
.ab-stats{padding:40px 0;border-bottom:1px solid #d7e3e2}
.ab-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.ab-stats-grid div{padding-left:18px;border-left:3px solid #10c0df}
.ab-stats strong{display:block;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(36px,3.6vw,52px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.ab-stats span{display:block;margin-top:8px;font-size:14px;color:#52696f}

/* Routes */
.ab-routes{padding:96px 0}
.ab-routes-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.ab-route-list{margin:0;padding:0;list-style:none;border-top:1px solid #d7e3e2;counter-reset:route}
.ab-route-list li{border-bottom:1px solid #d7e3e2;counter-increment:route}
.ab-route-list button{display:flex;align-items:center;gap:18px;width:100%;padding:22px 4px;border:0;background:none;text-align:left;cursor:pointer;font:600 clamp(22px,2.2vw,30px)/1.15 "Source Serif 4",Georgia,serif;letter-spacing:-.02em;color:#0f2a33}
.ab-route-list button::before{content:counter(route,decimal-leading-zero);font:800 13px/1 "Schibsted Grotesk",sans-serif;letter-spacing:.08em;color:#10c0df}
.ab-route-list button span{flex:1}
.ab-route-list i{font-style:normal;font:400 26px/1 Arial,sans-serif;color:#0a7a8e;transition:transform .25s}
.ab-route-list p{max-height:0;overflow:hidden;margin:0;padding:0 4px 0 46px;font-size:17px;line-height:1.6;color:#52696f;transition:max-height .35s ease,padding .35s ease}
.ab-route-list li.is-open p{max-height:120px;padding-bottom:22px}
.ab-route-list li.is-open i{transform:rotate(45deg)}
.ab-route-list li.is-open button,.ab-route-list button:hover{color:#0a7a8e}

/* Money */
.ab-money{padding:96px 0;background:#080a0e;color:#fff}
.ab-head-light p{color:#c9dadd}.ab-head-light .ab-eyebrow{color:#10c0df}
.ab-money-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ab-money-grid article{padding:28px;border-radius:16px;background:#12171f;border:1px solid rgba(255,255,255,.08)}
.ab-money-grid h3{margin:0 0 10px;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:25px;letter-spacing:-.02em}
.ab-money-grid p{margin:0 0 18px;font-size:15.5px;line-height:1.6;color:#c9dadd}
.ab-money-grid a{color:#10c0df;font-weight:700;text-decoration:none}.ab-money-grid a:hover{text-decoration:underline}

/* CTA */
.ab-cta{padding:0 0 96px}
.ab-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:44px 48px;border-radius:22px;background:linear-gradient(135deg,#0a7a8e,#10c0df);color:#fff}
.ab-cta h2{margin:0;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(30px,3vw,42px);letter-spacing:-.03em;line-height:1.05}
.ab-cta p{margin:10px 0 0;max-width:560px;color:rgba(255,255,255,.9);font-size:17px}
.ab-cta .ab-actions{margin-top:0;flex-shrink:0}
.ab-cta .ab-btn-primary{background:#080a0e;border-color:#080a0e}.ab-cta .ab-btn-primary:hover{background:#1b222c;border-color:#1b222c}

/* Reveal on scroll */
.ab-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.ab-reveal.is-in{opacity:1;transform:none}

@media (max-width:1000px){
  .ab-hero-grid,.ab-routes-grid{grid-template-columns:1fr;gap:40px}
    .ab-money-grid{grid-template-columns:1fr}
  .ab-cta-inner{flex-direction:column;align-items:flex-start}
}
@media (max-width:700px){
  .ab-shell{width:calc(100% - 32px)}
  .ab-hero{padding:48px 0 44px}
  .ab-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .ab-routes,.ab-money,.ab-twv{padding:64px 0}
  .ab-cta-inner{padding:32px 24px}
}
@media (prefers-reduced-motion:reduce){
  .ab-reveal{opacity:1;transform:none;transition:none}
  .ab-reel strong.is-landed{animation:none}
  .ab-route-list p{transition:none}
}

/* Story: scroll-driven timeline with a rolling year and a line that fills as you read */
.ab-story{padding:104px 0;background:linear-gradient(180deg,#fff 0%,#f5fbfa 100%);border-top:1px solid #d7e3e2}
.ab-story-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px}
.ab-story-side{align-self:stretch}
.ab-story-sticky{position:sticky;top:calc(var(--acg-header-total-h,100px) + 40px)}
.ab-story-intro h2{margin:0;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(36px,4vw,56px);line-height:1.02;letter-spacing:-.035em}
.ab-story-intro p{margin:14px 0 0;font-size:18px;line-height:1.6;color:#52696f;max-width:420px}
.ab-story-meter{position:relative;margin-top:34px}
.ab-odo{display:flex;height:1em;overflow:hidden;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(84px,10vw,150px);line-height:1;letter-spacing:-.05em;color:#0f2a33;transition:opacity .3s}
.ab-odo .col{display:block;height:1em;overflow:hidden}
.ab-odo .col span{display:block;height:1em;transition:transform .9s cubic-bezier(.2,.75,.15,1)}
.ab-odo .col:last-child{color:#10c0df}
.ab-odo-next{position:absolute;left:0;top:0;height:clamp(84px,10vw,150px);display:flex;align-items:center;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(40px,4.6vw,64px);letter-spacing:-.03em;color:#10c0df;opacity:0;transform:translateY(10px);transition:opacity .35s,transform .35s;pointer-events:none}
.ab-story-meter.is-next .ab-odo{opacity:.08}
.ab-story-meter.is-next .ab-odo-next{opacity:1;transform:none}
.ab-dots{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0;padding:0;list-style:none}
.ab-dots a{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #d7e3e2;border-radius:999px;background:#fff;font-size:13px;font-weight:700;color:#52696f;text-decoration:none;transition:border-color .2s,color .2s,background .2s}
.ab-dots a::before{content:"";width:7px;height:7px;border-radius:50%;background:#c6d6d5;transition:background .2s,box-shadow .2s}
.ab-dots a:hover{border-color:#10c0df;color:#0f2a33}
.ab-dots a.is-past::before{background:#10c0df}
.ab-dots a.is-active{background:#0f2a33;border-color:#0f2a33;color:#fff}
.ab-dots a.is-active::before{background:#10c0df;box-shadow:0 0 0 4px rgba(16,192,223,.25)}
.ab-milestones{position:relative;margin:0;padding:0 0 0 46px;list-style:none}
.ab-line{position:absolute;left:11px;top:10px;bottom:10px;width:3px;border-radius:3px;background:#e2ecea}
.ab-line i{position:absolute;left:0;top:0;width:100%;height:0;border-radius:3px;background:linear-gradient(180deg,#10c0df,#0a7a8e)}
.ab-ms{position:relative;padding-bottom:38px}
.ab-ms:last-child{padding-bottom:0}
.ab-ms-node{position:absolute;left:-46px;top:26px;width:25px;height:25px;border-radius:50%;background:#fff;border:3px solid #c6d6d5;transition:border-color .35s,background .35s,box-shadow .35s;z-index:1}
.ab-ms.is-past .ab-ms-node{border-color:#10c0df;background:#10c0df}
.ab-ms.is-active .ab-ms-node{border-color:#10c0df;background:#fff;box-shadow:0 0 0 6px rgba(16,192,223,.18);animation:ab-pulse 1.8s ease-out infinite}
@keyframes ab-pulse{0%{box-shadow:0 0 0 0 rgba(16,192,223,.45)}100%{box-shadow:0 0 0 14px rgba(16,192,223,0)}}
.ab-ms-card{padding:28px 30px;border-radius:18px;background:#fff;border:1px solid #d7e3e2;opacity:.55;transform:translateX(10px);transition:opacity .45s,transform .45s,border-color .35s,box-shadow .35s}
.ab-ms.is-past .ab-ms-card{opacity:.85;transform:none}
.ab-ms.is-active .ab-ms-card{opacity:1;transform:none;border-color:#10c0df;box-shadow:0 26px 50px -34px rgba(10,122,142,.55)}
.ab-ms-top{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ab-ms-year{font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:30px;letter-spacing:-.03em;color:#10c0df;line-height:1}
.ab-ms-tag{padding:4px 10px;border-radius:999px;background:#eef5f4;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#0a7a8e}
.ab-ms-card h3{margin:0 0 10px;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(24px,2.2vw,30px);letter-spacing:-.02em;line-height:1.12}
.ab-ms-card p{margin:0;font-size:16.5px;line-height:1.65;color:#3e565c}

/* Who is behind it: TWV Media panel in TWV's own colours */
.ab-twv{padding:96px 0}
.twv-panel{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center;padding:52px;border-radius:24px;background:#F6F4F1;color:#14161A;font-family:Archivo,system-ui,sans-serif;border:1px solid #e6e1da}
.twv-panel::before{content:"";position:absolute;right:-120px;top:-120px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(209,26,42,.10),rgba(209,26,42,0) 70%);pointer-events:none}
.twv-mark{display:inline-flex;align-items:center;gap:13px;text-decoration:none;color:#14161A;margin-bottom:26px}
.twv-box{overflow:hidden;display:block}
.twv-a{display:block;font-size:2.1rem;font-weight:700;letter-spacing:-.035em;line-height:1}
.twv-b{display:block;font-size:1.38rem;font-weight:400;letter-spacing:.22em;line-height:1}
.twv-rule{width:2.5px;height:31px;background:#D11A2A;flex:none}
/* Hidden start state only once the script is ready, so the mark always shows without JavaScript. */
.twv-mark.is-ready .twv-a{transform:translateX(102%)}
.twv-mark.is-ready .twv-b{transform:translateX(-102%)}
.twv-mark.is-ready .twv-rule{transform:scaleY(0)}
.twv-mark.is-on .twv-rule{animation:twv-rule .26s ease-out forwards}
.twv-mark.is-on .twv-a{animation:twv-left .5s cubic-bezier(.22,1,.36,1) .15s forwards}
.twv-mark.is-on .twv-b{animation:twv-right .5s cubic-bezier(.22,1,.36,1) .15s forwards}
@keyframes twv-rule{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes twv-left{from{transform:translateX(102%);letter-spacing:-.06em}to{transform:translateX(0);letter-spacing:-.035em}}
@keyframes twv-right{from{transform:translateX(-102%);letter-spacing:.02em}to{transform:translateX(0);letter-spacing:.22em}}
.twv-kicker{margin:0 0 12px;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#D11A2A}
.twv-copy h2{margin:0;font-size:clamp(30px,3.1vw,44px);font-weight:700;letter-spacing:-.035em;line-height:1.05}
.twv-copy>p{margin:16px 0 0;font-size:17.5px;line-height:1.65;color:#3A3C41;max-width:560px}
.twv-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:28px}
.twv-btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 22px;border-radius:4px;background:#D11A2A;color:#fff;font-weight:600;font-size:15.5px;text-decoration:none;transition:background .15s,transform .15s}
.twv-btn:hover{background:#b01523;transform:translateY(-1px)}
.twv-link{color:#14161A;font-weight:600;font-size:15px;text-decoration:underline;text-decoration-color:#D11A2A;text-decoration-thickness:2px;text-underline-offset:5px}
.twv-link:hover{color:#D11A2A}
.twv-services{position:relative;margin:0;padding:0;list-style:none;border-top:1px solid #ddd6cd}
.twv-services a{display:grid;grid-template-columns:34px 1fr auto;align-items:center;column-gap:12px;padding:18px 4px;border-bottom:1px solid #ddd6cd;color:#14161A;text-decoration:none}
.twv-n{grid-row:span 2;font-size:12px;font-weight:600;letter-spacing:.08em;color:#9A9BA0}
.twv-services strong{font-size:19px;font-weight:700;letter-spacing:-.02em}
.twv-services small{grid-column:2;font-size:14px;color:#6A6C71}
.twv-services i{grid-row:1/span 2;grid-column:3;font-style:normal;font-size:18px;color:#D11A2A;transform:translate(-6px,6px);opacity:0;transition:transform .25s,opacity .25s}
.twv-services a:hover strong{color:#D11A2A}
.twv-services a:hover i,.twv-services a:focus-visible i{transform:none;opacity:1}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media (max-width:1000px){
  .ab-story-grid{grid-template-columns:1fr;gap:28px}
  .twv-panel{grid-template-columns:1fr;padding:36px 28px}
}
@media (max-width:900px){
  .ab-story-grid{display:block}
  .ab-story-side,.ab-story-sticky{display:contents}
  .ab-story-intro{margin-bottom:22px}
  .ab-story-meter{position:sticky;top:var(--acg-header-total-h,100px);z-index:5;margin:0 0 24px;padding:12px 0;background:rgba(245,251,250,.94);backdrop-filter:blur(8px);display:flex;align-items:center;gap:16px;border-bottom:1px solid #d7e3e2}
  .ab-odo{font-size:44px}
  .ab-odo-next{height:44px;font-size:24px}
  .ab-dots{margin:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .ab-dots::-webkit-scrollbar{display:none}
  .ab-dots a{padding:6px 10px;white-space:nowrap}
}
@media (max-width:700px){
  .ab-story{padding:64px 0}
  .ab-milestones{padding-left:36px}
  .ab-line{left:8px}
  .ab-ms-node{left:-36px;width:20px;height:20px}
  .ab-ms-card{padding:22px 20px}
}
@media (prefers-reduced-motion:reduce){
  .ab-odo .col span,.ab-ms-card,.ab-ms-node{transition:none}
  .ab-ms.is-active .ab-ms-node{animation:none}
  .twv-mark.is-ready .twv-a,.twv-mark.is-ready .twv-b,.twv-mark.is-ready .twv-rule{transform:none}
  .twv-mark.is-on .twv-rule,.twv-mark.is-on .twv-a,.twv-mark.is-on .twv-b{animation:none}
}
