/*
Theme Name: SNG Vielfys
Theme URI: https://sngvielfys.com/
Author: Kode Infotech
Author URI: https://kodeinfotech.com/
Description: Custom theme for SNG Vielfys, the strategic partnership of Vielfys Packaging Solutions (Greece) and Shree Naina Glass Inc. (India).
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: sngvielfys
*/

/* Commissioner, self hosted (Greek, Latin and Latin extended) */
@font-face{font-family:"Commissioner";font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/commissioner-greek.woff2) format("woff2");unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/commissioner-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:"Commissioner";font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/commissioner-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}

:root{
  --blue:#0064A6;
  --blue-ink:#004B7D;
  --blue-tint:#E4EEF6;
  --red:#C33538;
  --ink:#1F2428;
  --graphite:#1B2024;
  --slate:#566066;
  --muted:#879096;
  --mist:#EEF2F4;
  --line:#D7DEE2;
  --line-dark:rgba(255,255,255,.14);
  --on-dark:#C3CBD0;
  --sng:#3E4095;
  --sng-tint:#E9E9F5;
  --f-display:"Commissioner",system-ui,sans-serif;
  --f-body:"Commissioner",system-ui,sans-serif;
  --flare:"FLAR" 100,"VOLM" 0;
  --wrap:1240px;
  --gutter:clamp(16px,4vw,40px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --sec:clamp(72px,10vw,128px);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:var(--f-body);font-size:17px;line-height:1.6;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* type */
.display{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;letter-spacing:-.012em;line-height:1.05}
.h1{font-size:clamp(2.4rem,4.3vw,3.9rem)}
.h2{font-size:clamp(2rem,3.4vw,3rem);line-height:1.08}
.accent{color:var(--blue)}
.eyebrow{display:inline-flex;align-items:center;gap:.7em;font-family:var(--f-body);font-weight:600;font-size:.95rem;line-height:1.4;letter-spacing:.005em;color:var(--blue)}
.eyebrow::before{content:"";width:8px;height:8px;background:var(--red);transform:rotate(-6deg);flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;white-space:nowrap;padding:0 26px;font-family:var(--f-body);font-weight:600;font-size:1rem;letter-spacing:.005em;border-radius:2px;background-repeat:no-repeat;background-position:left center;background-size:0% 100%;transition:background-size .4s var(--ease),color .3s,border-color .3s}
.btn:hover,.btn:focus-visible{background-size:100% 100%}
.btn:active{transform:translateY(1px)}
/* blue fills with the brand red; white fills red; outline on dark fills white */
.btn--blue{background-color:var(--blue);background-image:linear-gradient(var(--red),var(--red));color:#fff}
.btn--white{background-color:#fff;background-image:linear-gradient(var(--red),var(--red));color:var(--blue-ink)}
.btn--white:hover,.btn--white:focus-visible{color:#fff}
.btn--line{border:1px solid rgba(255,255,255,.45);background-image:linear-gradient(#fff,#fff);color:#fff}
.btn--line:hover,.btn--line:focus-visible{border-color:#fff;color:var(--graphite)}
.link-arrow{display:inline-flex;align-items:center;gap:10px;padding:4px 0;border-bottom:1px solid currentColor;font-family:var(--f-body);font-weight:600;font-size:1rem;color:var(--blue);transition:color .25s}
.link-arrow:hover{color:var(--red)}
.link-arrow::after{content:"→";letter-spacing:0;transition:transform .25s var(--ease)}
.link-arrow:hover::after{transform:translateX(5px)}

/* top strip */
.strip{background:var(--graphite);color:var(--on-dark);font-size:.8rem}
.strip__in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:40px}
.strip__tag{font-family:var(--f-body);font-weight:500;font-size:.82rem;letter-spacing:.02em;color:#9AA4AA}
.strip__event{display:inline-flex;align-items:center;gap:10px;color:#fff;font-weight:500;white-space:nowrap}
.strip__event:hover{text-decoration:underline;text-underline-offset:3px}
.strip__event b{font-weight:600}
.strip__event .sep::before{content:"";display:inline-block;width:1px;height:12px;margin:0 12px;vertical-align:-1px;background:currentColor;opacity:.35}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--red);animation:pulse 2s infinite;flex:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(195,53,56,.6)}70%{box-shadow:0 0 0 9px rgba(195,53,56,0)}100%{box-shadow:0 0 0 0 rgba(195,53,56,0)}}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
.hdr.is-stuck{border-bottom-color:var(--line);box-shadow:0 10px 30px -24px rgba(20,30,40,.5)}
.hdr__in{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;column-gap:clamp(14px,2.4vw,40px);height:92px;transition:height .3s var(--ease)}
.hdr.is-stuck .hdr__in{height:74px}
.hdr__logo{grid-column:2;grid-row:1;justify-self:center}
.hdr__logo img{height:42px;width:auto;transition:height .3s var(--ease)}
.hdr.is-stuck .hdr__logo img{height:36px}
.nav--left{grid-column:1;grid-row:1;justify-self:start;margin-left:-14px}
.nav--right{grid-column:3;grid-row:1;justify-self:end}
.nav__list{display:flex;align-items:center;gap:2px}
.nav__link{position:relative;display:inline-flex;white-space:nowrap;align-items:center;gap:6px;padding:12px 14px;font-family:var(--f-body);font-weight:500;font-size:1rem;color:var(--ink);transition:color .2s}
.nav__link::before{content:"";position:absolute;left:50%;bottom:0;width:6px;height:6px;margin-left:-3px;background:var(--red);transform:rotate(-6deg) scale(0);transition:transform .25s var(--ease)}
.nav__link:hover,.nav__link.is-current,.nav__link[aria-expanded="true"]{color:var(--blue)}
.nav__link:hover::before,.nav__link.is-current::before,.nav__link[aria-expanded="true"]::before{transform:rotate(-6deg) scale(1)}
.nav__chev{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .25s var(--ease)}
.nav__link[aria-expanded="true"] .nav__chev{transform:rotate(180deg)}
.hdr__cta{height:44px;margin-left:14px;padding:0 24px}
.hdr__menu{display:none;grid-column:3;grid-row:1;justify-self:end;align-items:center;gap:12px;padding:10px 0;font-family:var(--f-body);font-weight:600;font-size:1rem}
.hdr__bars{display:grid;gap:6px;width:24px}
.hdr__bars i{display:block;height:2px;background:var(--ink)}
.hdr__menu:hover{color:var(--blue)}
.hdr__bars i:last-child{width:16px;justify-self:end;background:var(--red)}

/* mega panel */
.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 40px 50px -40px rgba(20,30,40,.45);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .22s,transform .22s var(--ease),visibility 0s .22s}
.mega.is-open{opacity:1;visibility:visible;transform:none;transition:opacity .22s,transform .3s var(--ease)}
.mega__in{display:grid;grid-template-columns:1.05fr repeat(3,minmax(0,1fr));gap:28px;padding-top:34px;padding-bottom:40px}
.mega__intro p{color:var(--slate);font-size:.95rem;margin:14px 0 20px;max-width:22em}
.mega__intro h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.35rem;line-height:1.15;margin-top:14px}
.mega__img{aspect-ratio:4/3;background:var(--mist);overflow:hidden}
.mega__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.mega__img--fit img{object-fit:contain;padding:12px}
.mega__card:hover .mega__img img{transform:scale(1.05)}
.mega__name{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.02rem}
.mega__name::after{content:"→";color:var(--blue);transition:transform .25s var(--ease)}
.mega__card:hover .mega__name::after{transform:translateX(4px)}
.mega__meta{display:block;margin-top:4px;color:var(--slate);font-size:.92rem}

/* mobile nav */
.mnav{position:fixed;inset:0;z-index:80;background:#fff;display:flex;flex-direction:column;overflow-y:auto;padding:0 var(--gutter) 28px;visibility:hidden;transform:translateY(-100%);transition:transform .45s var(--ease),visibility 0s .45s}
.mnav.is-open{visibility:visible;transform:none;transition:transform .45s var(--ease)}
.mnav__top{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;height:72px;border-bottom:1px solid var(--line)}
.mnav__top img{grid-column:2;height:30px;width:auto}
.mnav__close{grid-column:3;justify-self:end;display:inline-flex;align-items:center;gap:10px;font-family:var(--f-body);font-weight:600;font-size:1rem;padding:10px 0}
.mnav__close svg{width:18px;height:18px;stroke:var(--ink);stroke-width:2;fill:none}
.mnav__list{padding:18px 0}
.mnav__list > li{border-bottom:1px solid var(--line)}
.mnav__list > li > a{display:block;padding:16px 0;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.6rem;line-height:1.1}
.mnav__label{display:block;padding:16px 0 6px;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.6rem;line-height:1.1}
.mnav__sub{display:grid;gap:2px;padding:0 0 16px 2px}
.mnav__sub a{display:flex;justify-content:space-between;padding:8px 0;color:var(--slate)}
.mnav__sub a::after{content:"→";color:var(--blue)}
.mnav__foot{margin-top:auto;display:grid;gap:14px;padding-top:12px}
.mnav__foot .strip__event{color:var(--ink)}

/* hero */
.hero{position:relative;padding:clamp(36px,6vw,76px) 0 clamp(56px,7vw,96px);overflow:hidden}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,.92fr);gap:clamp(24px,4vw,64px);align-items:center}
.hero__title{margin:0 0 26px}
.hero__title .ln{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.hero__title .ln > span{display:block}
.hero__lead{max-width:33em;font-size:1.08rem;color:var(--slate)}
.hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px;margin-top:34px}
.hero__art{position:relative;width:100%;max-width:590px;aspect-ratio:1/1;justify-self:end}
.plane{position:absolute}
.plane--blue{left:17%;top:18%;width:77%;height:70%;background:var(--blue);transform:rotate(-3deg)}
.plane--red{left:0;top:47%;width:40%;height:40%;background:var(--red);transform:rotate(5deg)}
.hero__glass{--lift:clamp(16px,2.6vw,38px);position:absolute;left:17%;bottom:4%;width:79%;aspect-ratio:937/932}
.amp{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:auto;max-width:none;filter:drop-shadow(0 20px 20px rgba(0,35,70,.26));animation:ampWave 3.2s ease-in-out infinite;animation-delay:calc((var(--i) - 7) * .8s);will-change:transform}
@keyframes ampWave{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(calc(var(--lift) * -1)) rotate(var(--r,1deg))}}
.diamond{width:22px;height:22px;flex:none;fill:none;stroke:var(--slate);stroke-width:1.4}
.diamond path{stroke-dasharray:60;stroke-dashoffset:0}

/* hero load sequence (only when motion is welcome) */
@media (prefers-reduced-motion:no-preference){
  .js .hero__title .ln > span{transform:translateY(106%)}
  .js .hero__lead,.js .hero__actions{opacity:0;transform:translateY(14px)}
  .js .plane--blue{opacity:0;transform:rotate(-10deg) scale(.92)}
  .js .plane--red{opacity:0;transform:translate(-40px,30px) rotate(16deg)}
  .js .hero__glass{opacity:0;transform:translateY(34px)}

  .is-loaded .hero__title .ln > span{transform:none;transition:transform 1s var(--ease)}
  .is-loaded .hero__title .ln:nth-child(2) > span{transition-delay:.09s}
  .is-loaded .hero__title .ln:nth-child(3) > span{transition-delay:.18s}
  .is-loaded .hero__lead{opacity:1;transform:none;transition:opacity .8s .35s,transform .8s .35s var(--ease)}
  .is-loaded .hero__actions{opacity:1;transform:none;transition:opacity .8s .45s,transform .8s .45s var(--ease)}
  .is-loaded .plane--blue{opacity:1;transform:rotate(-3deg);transition:opacity .6s .1s,transform 1.3s .1s var(--ease)}
  .is-loaded .plane--red{opacity:1;transform:rotate(5deg);transition:opacity .6s .35s,transform 1.2s .35s var(--ease)}
  .is-loaded .hero__glass{opacity:1;transform:none;transition:opacity .9s .55s,transform 1.2s .55s var(--ease)}

  .js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .8s,transform .9s var(--ease)}
  .js [data-reveal].is-in{opacity:1;transform:none}
  .js [data-reveal="2"]{transition-delay:.1s}
  .js [data-reveal="3"]{transition-delay:.2s}
  .js .duo__axis .diamond path{stroke-dashoffset:60;transition:stroke-dashoffset 1.1s .4s ease}
  .js .duo__axis.is-in .diamond path{stroke-dashoffset:0}
  .js .duo__axis .duo__rule{transform:scaleY(0);transition:transform 1s var(--ease)}
  .js .duo__axis.is-in .duo__rule{transform:none}
}

/* section head */
.sec-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:22px 64px;align-items:end;margin-bottom:clamp(40px,5vw,64px)}
.sec-head .eyebrow{grid-column:1/-1}
.sec-head__lead{color:var(--slate);max-width:31em}

/* CPHI */
.cphi{background:var(--graphite);color:#fff;padding:var(--sec) 0;overflow:hidden}
.cphi__grid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr);gap:clamp(40px,6vw,88px);align-items:center}
.cphi__media{position:relative}
.cphi__video{position:relative;z-index:1;display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;background:#0d1114;box-shadow:0 40px 60px -40px rgba(0,0,0,.8)}
.cphi__sound{position:absolute;z-index:2;right:14px;bottom:14px;display:grid;place-items:center;width:42px;height:42px;border-radius:2px;background:rgba(12,16,20,.72);color:#fff;transition:background-color .2s,transform .2s}
.cphi__sound:hover{background:var(--blue);transform:scale(1.06)}
.cphi__sound svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cphi__sound .ico-on,.cphi__sound[aria-pressed="true"] .ico-off{display:none}
.cphi__sound[aria-pressed="true"] .ico-on{display:block}
.cphi .eyebrow{color:#8FC0E8}
.cphi .eyebrow::before{animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.25}}
.cphi h2{margin:18px 0;font-size:clamp(1.9rem,2.9vw,2.6rem);text-wrap:balance}
.cphi__text{color:var(--on-dark);max-width:34em}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:32px 0;border-top:1px solid var(--line-dark)}
.facts div{padding:16px 18px 16px 0;border-bottom:1px solid var(--line-dark)}
.facts div:nth-child(even){padding-left:20px;border-left:1px solid var(--line-dark)}
.facts dt{font-family:var(--f-body);font-size:.88rem;font-weight:500;color:#9AA4AA}
.facts dd{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.2rem;margin-top:2px;white-space:nowrap}
.cphi__foot{display:flex;flex-wrap:wrap;align-items:center;gap:22px 36px}
.count{display:flex;align-items:baseline;gap:12px}
.count__num{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:700;font-size:clamp(3rem,5vw,4.2rem);line-height:.9;font-variant-numeric:tabular-nums}
.count__label{font-family:var(--f-body);font-size:1rem;line-height:1.35;color:var(--on-dark);max-width:10em}
.cphi__btns{display:flex;flex-wrap:wrap;gap:12px}

/* about */
.about{padding:var(--sec) 0;background:#fff}
.about__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.about h2{margin:18px 0 24px}
.about__statement{font-size:clamp(1.1rem,1.5vw,1.28rem);line-height:1.55;color:var(--ink);max-width:31em}
.ledger{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:34px 0 32px;border-top:1px solid var(--line)}
.ledger div{padding:16px 20px 16px 0;border-bottom:1px solid var(--line)}
.ledger div:nth-child(even){padding-left:20px;border-left:1px solid var(--line)}
.ledger dt{font-family:var(--f-body);font-size:.88rem;font-weight:500;color:var(--muted)}
.ledger dd{font-weight:500;margin-top:2px;line-height:1.4}
.about__fig img{width:100%;height:auto}

/* partnership */
.partner{background:var(--mist);padding:var(--sec) 0}
.duo{display:grid;grid-template-columns:minmax(0,1fr) 84px minmax(0,1fr);align-items:stretch}
.duo__card{display:flex;flex-direction:column;gap:22px;background:#fff;padding:clamp(28px,3.4vw,46px);border-top:3px solid var(--blue)}
.duo__card--sng{border-top-color:var(--sng)}
.duo__logo{height:74px;width:auto;align-self:flex-start}
.duo__card--sng .duo__logo{height:58px;margin:8px 0}
.duo__list{display:grid;gap:12px;padding-top:24px;border-top:1px solid var(--line)}
.duo__list li{position:relative;padding-left:24px;line-height:1.5}
.duo__list li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;background:var(--blue);transform:rotate(-6deg)}
.duo__card--sng .duo__list li::before{background:var(--sng)}
.duo__axis{display:flex;flex-direction:column;align-items:center;gap:14px}
.duo__rule{flex:1;width:1px;background:#BFC9CE}
.duo__rule:first-child{transform-origin:top}
.duo__rule:last-child{transform-origin:bottom}
.duo__axis .diamond{width:30px;height:30px;stroke:var(--ink)}
.pillars-head{margin:clamp(56px,7vw,88px) 0 0}
.pillars{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:22px;border-top:1px solid #BFC9CE}
.pillars li{padding:24px 22px 0 0}
.pillars li + li{padding-left:22px;border-left:1px solid var(--line)}
.pillars__icon{width:30px;height:30px;margin-bottom:14px;fill:none;stroke:var(--blue);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.pillars h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1rem;line-height:1.25}
.pillars p{font-size:.92rem;color:var(--slate);margin-top:8px;line-height:1.5}

/* numbers */
.stats{background:var(--graphite);color:#fff;padding:var(--sec) 0}
.stats .eyebrow{color:#8FC0E8}
.stats .sec-head__lead{color:var(--on-dark)}
.stats__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line-dark)}
.stat{padding:clamp(24px,3vw,38px) clamp(16px,2.4vw,32px) clamp(24px,3vw,38px) 0;border-bottom:1px solid var(--line-dark)}
.stat:not(:nth-child(3n+1)){padding-left:clamp(16px,2.4vw,32px);border-left:1px solid var(--line-dark)}
.stat__num{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:clamp(2.8rem,5.2vw,4.6rem);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stat__num b{font-weight:600;color:var(--red)}
.stat__label{margin-top:14px;font-weight:600;font-size:1.08rem}
.stat__note{margin-top:4px;font-size:.95rem;color:#9AA4AA}

/* trusted by */
.trusted{background:var(--mist);padding:var(--sec) 0 calc(var(--sec) - 12px);overflow:hidden}
.sec-head--center{grid-template-columns:1fr;justify-items:center;text-align:center}
.sec-head--center .sec-head__lead{max-width:40em}
.logos{overflow:hidden;padding:12px 0 20px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logos__track{display:flex;gap:18px;width:max-content;padding-right:18px;animation:certMove 48s linear infinite}
.logos:hover .logos__track{animation-play-state:paused}
.logos__item{flex:none;display:grid;place-items:center;width:210px;height:110px;padding:18px 26px;background:#fff;border:1px solid var(--line);transition:border-color .3s,transform .35s var(--ease),box-shadow .35s var(--ease)}
.logos__item:hover{border-color:var(--blue);transform:translateY(-4px);box-shadow:0 20px 30px -24px rgba(0,30,60,.55)}
.logos__item img{width:auto;height:auto;max-width:150px;max-height:58px;object-fit:contain}
.logos__note{margin-top:22px;padding:0 var(--gutter);text-align:center;font-size:.95rem;color:var(--slate)}

/* products */
.range-sec{padding:var(--sec) 0;background:#fff}
.range{display:grid;grid-template-columns:minmax(230px,.34fr) minmax(0,1fr);gap:clamp(28px,4.5vw,64px);align-items:start}
.range__tabs{position:sticky;top:100px;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.range__tab{position:relative;display:grid;gap:4px;padding:22px 8px 22px 30px;text-align:left;border-bottom:1px solid var(--line);color:var(--muted);transition:color .25s}
.range__tab::before{content:"";position:absolute;left:2px;top:33px;width:11px;height:11px;background:var(--red);transform:rotate(-6deg) scale(0);transition:transform .3s var(--ease)}
.range__tab:hover{color:var(--ink)}
.range__tab[aria-selected="true"]{color:var(--ink)}
.range__tab[aria-selected="true"]::before{transform:rotate(-6deg) scale(1)}
.range__name{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:clamp(1.55rem,2.5vw,2.15rem);line-height:1.1}
.range__meta{color:var(--slate);font-size:.95rem}
.range__tab[aria-selected="false"] .range__meta{color:var(--muted)}
.range__panel{display:none}
.range__panel.is-active{display:block;animation:panelIn .55s var(--ease)}
@keyframes panelIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.range__fig{position:relative;aspect-ratio:3/2;background:var(--mist);overflow:hidden}
.range__fig img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.range__fig--fit img{object-fit:contain;padding:22px 0}
.range__body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,3vw,40px);padding-top:30px}
.spec div{display:grid;grid-template-columns:104px 1fr;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.spec div:first-child{border-top:1px solid var(--line)}
.spec dt{font-family:var(--f-body);font-size:.9rem;font-weight:500;color:var(--muted);padding-top:1px}
.spec dd{font-size:.97rem;line-height:1.5}
.range__side{display:flex;flex-direction:column;gap:22px}
.range__side-label{font-family:var(--f-body);font-size:.95rem;font-weight:600;color:var(--ink);margin-bottom:12px}
.forms{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.forms li{display:grid;justify-items:center;gap:8px;font-family:var(--f-body);font-size:.85rem;font-weight:500;text-align:center;color:var(--slate)}
.forms .tile{width:100%;aspect-ratio:3/5;border:1px solid var(--line);display:grid;place-items:center;transition:border-color .2s,background-color .2s}
.forms li:hover .tile{border-color:var(--blue);background:var(--blue-tint)}
.forms svg{width:62%;height:auto;fill:none;stroke:var(--ink);stroke-width:1.3;stroke-linecap:round}
.forms svg .axis{stroke:var(--blue);stroke-dasharray:2.5 2.5;stroke-width:1}
.types{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px}
.types li{position:relative;padding-left:18px;font-size:.97rem;line-height:1.4}
.types li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;background:var(--blue);transform:rotate(-6deg)}
.range__note{font-size:.92rem;color:var(--slate)}

/* quality */
.quality{background:var(--graphite);color:#fff;padding:var(--sec) 0}
.quality__grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(40px,7vw,96px);align-items:center}
.quality__fig{position:relative}
.quality__fig img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.quality__fig figcaption{position:absolute;left:0;bottom:0;background:var(--blue);color:#fff;padding:12px 18px;font-size:.92rem;font-weight:500}
.quality .eyebrow{color:#8FC0E8}
.quality h2{margin:18px 0 18px}
.quality__lead{color:var(--on-dark);max-width:32em}
.steps{counter-reset:step;margin-top:36px;border-top:1px solid var(--line-dark)}
.steps li{display:grid;grid-template-columns:56px 1fr;column-gap:14px;padding:22px 0;border-bottom:1px solid var(--line-dark)}
.steps li::before{counter-increment:step;content:counter(step,decimal-leading-zero);grid-row:1 / span 2;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.35rem;line-height:1.2;color:#7FB2DD}
.steps h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.14rem}
.steps p{color:var(--on-dark);font-size:.96rem;margin-top:4px}

/* certifications */
.certs{position:relative;background:var(--blue);color:#fff;padding:var(--sec) 0 calc(var(--sec) - 16px);overflow:hidden}
.certs .eyebrow{color:#fff}
.certs .sec-head{margin-bottom:0}
.certs .sec-head__lead{color:rgba(255,255,255,.84)}
.ticker{margin:clamp(30px,4vw,52px) 0 clamp(18px,2.4vw,28px);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker__track{display:flex;align-items:center;gap:40px;width:max-content;padding-right:40px;animation:tickerMove 90s linear infinite}
.ticker__item{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:700;font-size:clamp(2.4rem,6vw,5.4rem);line-height:1.1;white-space:nowrap;color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.42)}
.ticker__sep{flex:none;width:16px;height:16px;border:1.5px solid rgba(255,255,255,.42);transform:rotate(45deg)}
@keyframes tickerMove{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.cert-marquee{overflow:hidden;padding:14px 0 30px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.cert-track{display:flex;gap:20px;width:max-content;padding-right:20px;animation:certMove 56s linear infinite}
.cert-marquee:hover .cert-track,.cert-marquee:focus-within .cert-track{animation-play-state:paused}
@keyframes certMove{to{transform:translateX(-50%)}}
.cert{flex:none;display:flex;flex-direction:column;width:272px;padding:24px 24px 20px;background:#fff;color:var(--ink);box-shadow:0 24px 40px -26px rgba(0,18,40,.8);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.cert:hover{transform:translateY(-6px);box-shadow:0 34px 50px -26px rgba(0,18,40,.9)}
.cert__logo{display:flex;align-items:center;height:60px;margin-bottom:18px}
.cert__logo img{max-width:130px;max-height:56px;width:auto;height:auto;object-fit:contain}
.cert__logo--text{display:grid;place-items:center;width:60px;border:1.5px solid var(--ink);font-family:var(--f-display);font-variation-settings:var(--flare);font-size:.8rem;font-weight:600;line-height:1.2;text-align:center}
.cert__name{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.2rem;line-height:1.2}
.cert__scope{min-height:4.4em;margin-top:6px;font-size:.92rem;line-height:1.45;color:var(--slate)}
.cert__held{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:.92rem;color:var(--slate)}
.cert__held b{font-weight:600;color:var(--blue)}
.cert__held b.is-sng{color:var(--sng)}

/* contact */
.contact{background:var(--mist);padding:var(--sec) 0}
.offices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.office{display:flex;flex-direction:column;gap:20px;background:#fff;padding:clamp(28px,3.4vw,46px);border-top:3px solid var(--blue)}
.office--in{border-top-color:var(--sng)}
.office__head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.office__country{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:clamp(1.7rem,2.8vw,2.3rem);line-height:1}
.office__co{display:block;margin-top:8px;color:var(--slate);font-size:1rem;font-weight:500}
.office__logo{height:40px;width:auto}
.office--in .office__logo{height:28px;margin-top:6px}
.office__addr{font-style:normal;color:var(--slate);line-height:1.55}
.office__addr strong{display:block;color:var(--ink);font-weight:600;font-size:.9rem}
.office__addr + .office__addr{margin-top:-6px}
.office__person{padding-top:20px;border-top:1px solid var(--line)}
.office__person strong{display:block;font-weight:600}
.office__person span{font-size:.9rem;color:var(--slate)}
.office__links{display:grid;gap:10px}
.office__links a{display:inline-flex;align-items:center;gap:12px;width:fit-content;border-bottom:1px solid transparent;transition:border-color .2s,color .2s}
.office__links a:hover{color:var(--blue);border-bottom-color:currentColor}
.office__links svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--blue);stroke-width:1.6}
.office--in .office__links svg{stroke:var(--sng)}
.cta-bar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px 40px;flex-wrap:wrap;margin-top:24px;padding:36px clamp(24px,4vw,48px);background:var(--blue);color:#fff;overflow:hidden}
.cta-bar::after{content:"";position:absolute;right:-28px;bottom:-40px;width:120px;height:120px;background:var(--red);transform:rotate(8deg);opacity:.9}
.cta-bar h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.2}
.cta-bar p{color:#D5E6F2;margin-top:6px}
.cta-bar .btn{position:relative;z-index:1;margin-right:clamp(0px,6vw,90px)}

/* footer */
.ftr{background:var(--graphite);color:#A5AFB5;padding:clamp(56px,7vw,80px) 0 28px;font-size:.92rem}
.ftr__top{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:40px;padding-bottom:48px;border-bottom:1px solid var(--line-dark)}
.ftr__logo{height:34px;width:auto}
.ftr__brand p{margin-top:22px;max-width:25em;line-height:1.6}
.ftr h4{margin-bottom:16px;font-family:var(--f-body);font-weight:600;font-size:1rem;color:#fff}
.ftr ul{display:grid;gap:10px}
.ftr a{transition:color .2s}
.ftr a:hover{color:#fff}
.ftr address{font-style:normal;line-height:1.6}
.ftr address + address{margin-top:14px}
.ftr address b{display:block;color:#fff;font-weight:500}
.ftr__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding-top:24px;font-size:.82rem}

/* responsive */
@media (max-width:1200px){
  .hdr .hdr__logo img{height:36px}
  .hdr.is-stuck .hdr__logo img{height:34px}
  .nav__link{padding:12px 10px;font-size:.96rem}
  .nav--left{margin-left:-10px}
  .hdr__cta{margin-left:8px;padding:0 20px}
}
@media (max-width:1060px){
  .nav{display:none}
  .hdr__menu{display:inline-flex}
  .hdr__in{height:72px}
  .hdr .hdr__logo img,.hdr.is-stuck .hdr__logo img{height:34px}
  .mega{display:none}
  .pillars{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pillars li:nth-child(4){padding-left:0;border-left:0}
  .pillars li{padding-bottom:22px}
  .ftr__top{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .hero__grid,.cphi__grid,.about__grid,.quality__grid{grid-template-columns:1fr}
  .hero__art{justify-self:center;max-width:480px;margin-bottom:24px}
  .sec-head{grid-template-columns:1fr}
  .cphi__media{max-width:560px;margin:0 auto 40px}
  .range{grid-template-columns:1fr}
  .range__tabs{position:static;flex-direction:row;overflow-x:auto;border-top:0;border-bottom:1px solid var(--line);scrollbar-width:none}
  .range__tab{flex:1 0 auto;padding:14px 22px 14px 26px;border-bottom:0}
  .range__tab::before{top:24px}
  .range__tab[aria-selected="true"]{box-shadow:inset 0 -3px 0 var(--blue)}
  .range__name{font-size:1.3rem}
  .quality__fig img{aspect-ratio:4/3}
  .about__fig{order:-1}
}
@media (max-width:760px){
  body{font-size:16px}
  .strip__tag{display:none}
  .strip__in{justify-content:center}
  .duo{grid-template-columns:1fr}
  .duo__axis{flex-direction:row;height:64px}
  .duo__rule{height:1px;width:auto;flex:1}
  .duo__rule:first-child{transform-origin:left}
  .duo__rule:last-child{transform-origin:right}
  .pillars{grid-template-columns:1fr 1fr}
  .stats__grid{grid-template-columns:1fr 1fr}
  .stat:not(:nth-child(3n+1)){padding-left:0;border-left:0}
  .stat:nth-child(even){padding-left:18px;border-left:1px solid var(--line-dark)}
  .logos__item{width:170px;height:92px;padding:14px 20px}
  .logos__item img{max-width:124px;max-height:48px}
  .pillars li:nth-child(n){padding-left:0;border-left:0;padding-right:16px}
  .pillars li:nth-child(even){padding-left:16px;border-left:1px solid var(--line)}
  .range__body{grid-template-columns:1fr}
  .offices{grid-template-columns:1fr}
  .cert{width:240px;padding:20px 20px 18px}
  .ftr__top{grid-template-columns:1fr}
}
@media (max-width:480px){
  .ledger{grid-template-columns:1fr}
  .ledger div:nth-child(even){padding-left:0;border-left:0}
  .forms{gap:5px}
  .hdr .hdr__logo img,.hdr.is-stuck .hdr__logo img{height:26px}
  .strip{font-size:.78rem}
  .strip .strip__event .sep:last-child{display:none}
  .hdr__in{column-gap:8px}
  .mnav__top img{height:26px}
  .hdr__menu-label,.mnav__close-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .ticker{display:none}
  .cert-marquee{padding:28px var(--gutter) 10px;-webkit-mask-image:none;mask-image:none}
  .cert-track{width:auto;flex-wrap:wrap;justify-content:center;padding-right:0}
  .cert-track [aria-hidden="true"]{display:none}
  .logos{-webkit-mask-image:none;mask-image:none}
  .logos__track{width:auto;flex-wrap:wrap;justify-content:center;padding:0 var(--gutter)}
  .logos__track [aria-hidden="true"]{display:none}
}

/* WordPress admin bar (only for logged in users) */
.admin-bar .hdr{top:32px}
@media (max-width:782px){.admin-bar .hdr{top:46px}}
@media (max-width:600px){.admin-bar .hdr{top:0}}

/* inner pages */
.page-hero{background:var(--mist);padding:clamp(48px,7vw,96px) 0 clamp(40px,5vw,64px)}
.page-hero .h1{margin-top:16px}
.entry{padding:clamp(48px,7vw,96px) 0 var(--sec)}
.entry__in{max-width:780px}
.entry__in > * + *{margin-top:1.1em}
.entry__in h2,.entry__in h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;line-height:1.15;margin-top:1.8em}
.entry__in h2{font-size:clamp(1.6rem,2.4vw,2.1rem)}
.entry__in h3{font-size:1.3rem}
.entry__in ul{list-style:disc;padding-left:1.3em}
.entry__in ol{list-style:decimal;padding-left:1.3em}
.entry__in a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.entry__in a:hover{color:var(--red)}
.entry__in img{height:auto}
.post-list{display:grid;gap:28px}
.post-list h2{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.5rem}
.post-list h2 a:hover{color:var(--blue)}

/* ================= About page ================= */
@keyframes riseIn{from{opacity:0;transform:translateY(22px)}}

/* hero: both partners as year cards on the brand planes */
.ahero__eyebrow{margin-bottom:22px}
.ahero__art{container-type:inline-size}
.ycard{position:absolute;z-index:1;display:flex;flex-direction:column;align-items:flex-start;width:52%;padding:clamp(14px,4.2cqi,26px) clamp(16px,4.8cqi,30px);background:#fff;border-top:3px solid var(--blue);box-shadow:0 30px 50px -30px rgba(0,30,60,.55);animation:ycardFloat 6s ease-in-out infinite}
.ycard--sng{left:3%;top:7%;border-top-color:var(--sng)}
.ycard--vf{right:0;bottom:6%;animation-delay:-3s}
.ycard__logo{width:auto;height:clamp(20px,6.6cqi,38px);margin-bottom:clamp(8px,2.8cqi,16px)}
.ycard--sng .ycard__logo{height:clamp(18px,5.8cqi,33px)}
.ycard__since{font-size:clamp(.7rem,2.6cqi,.95rem);font-weight:500;color:var(--slate)}
.ycard__year{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:700;font-size:clamp(2.2rem,13cqi,4.6rem);line-height:.95;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--blue)}
.ycard--sng .ycard__year{color:var(--sng)}
.ycard__place{margin-top:clamp(4px,1.4cqi,8px);font-size:clamp(.72rem,2.7cqi,1rem);font-weight:600;color:var(--ink)}
.ahero__art .plane--red{left:4%;top:55%;width:33%;height:33%}
.ahero__diamond{position:absolute;z-index:2;left:50%;top:50.5%;width:clamp(24px,6.4cqi,36px);height:clamp(24px,6.4cqi,36px);transform:translate(-50%,-50%);stroke:#fff;stroke-width:1.5}
@keyframes ycardFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* story timeline */
.story{background:var(--graphite);color:#fff;padding:var(--sec) 0;overflow:hidden}
.story .eyebrow{color:#8FC0E8}
.story .sec-head__lead{color:var(--on-dark)}
.tl{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:clamp(16px,2.4vw,36px);padding-top:46px}
.tl::before{content:"";position:absolute;left:0;right:0;top:12px;height:1px;background:rgba(255,255,255,.3);transform-origin:left}
.tl__item{position:relative}
.tl__item::before{content:"";position:absolute;left:0;top:-40px;width:13px;height:13px;border:1.5px solid #8FC0E8;background:var(--graphite);transform:rotate(45deg)}
.tl__item--next::before{border-color:var(--red);background:var(--red);animation:pulse 2s infinite}
.tl__year{display:block;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:clamp(2.2rem,3.4vw,3.1rem);line-height:1;letter-spacing:-.02em}
.tl__item h3{margin-top:16px;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.12rem;line-height:1.25}
.tl__item p{margin-top:6px;font-size:.95rem;line-height:1.5;color:var(--on-dark)}

/* the two companies */
.about--sng{padding-bottom:0}
.about--sng + .about{padding-top:clamp(48px,6vw,80px)}
.about__fig{position:relative}
.about--sng .about__fig img{aspect-ratio:3/2;object-fit:cover}
.about__fig figcaption{position:absolute;left:0;bottom:0;background:var(--sng);color:#fff;padding:12px 18px;font-size:.92rem;font-weight:500}
.bridge{display:flex;align-items:center;gap:16px;max-width:560px;margin:clamp(56px,7vw,88px) auto 0}
.bridge__rule{flex:1;height:1px;background:#BFC9CE}
.bridge__rule--l{transform-origin:right}
.bridge__rule--r{transform-origin:left}
.bridge .diamond{width:30px;height:30px;stroke:var(--ink)}
.bridge__label{font-weight:600;font-size:.95rem;color:var(--slate)}

/* values */
.values{position:relative;background:var(--blue);color:#fff;padding:var(--sec) 0;overflow:hidden}
.values::after{content:"";position:absolute;right:-150px;top:-150px;width:440px;height:440px;border:1.5px solid rgba(255,255,255,.14);transform:rotate(45deg);pointer-events:none}
.values .wrap{position:relative;z-index:1}
.values .eyebrow{color:#fff}
.values .sec-head__lead{color:rgba(255,255,255,.84)}
.values__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.value{position:relative;padding:30px 26px 32px;border:1px solid rgba(255,255,255,.3);transition:background-color .35s,border-color .35s,transform .35s var(--ease)}
.value::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.value:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.55);transform:translateY(-5px)}
.value:hover::before{transform:scaleX(1)}
.value__icon{width:34px;height:34px;margin-bottom:24px;fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.value h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.3rem;line-height:1.2}
.value p{margin-top:10px;font-size:.97rem;line-height:1.55;color:rgba(255,255,255,.85)}

/* what we offer */
.offer{padding:var(--sec) 0;background:#fff}
.offer__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.offer__card{display:block}
.offer__img{display:block;aspect-ratio:4/3;background:var(--mist);overflow:hidden}
.offer__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.offer__img--fit img{object-fit:contain;padding:16px}
.offer__card:hover .offer__img img{transform:scale(1.05)}
.offer__name{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.45rem;line-height:1.15;transition:color .25s}
.offer__name::after{content:"→";color:var(--blue);transition:transform .25s var(--ease)}
.offer__card:hover .offer__name{color:var(--blue)}
.offer__card:hover .offer__name::after{transform:translateX(5px)}
.offer__meta{display:block;margin-top:4px;color:var(--slate)}
.caps{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:28px clamp(32px,5vw,72px);margin-top:clamp(56px,7vw,88px);padding-top:36px;border-top:1px solid var(--line)}
.caps__intro{font-size:clamp(1.08rem,1.5vw,1.22rem);font-weight:500;line-height:1.5;color:var(--ink)}
.caps__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.caps__icon{width:30px;height:30px;margin-bottom:14px;fill:none;stroke:var(--blue);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.caps__list h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.05rem;line-height:1.25}
.caps__list p{margin-top:6px;font-size:.93rem;line-height:1.5;color:var(--slate)}

/* combined strength */
.reach{background:var(--mist);padding:var(--sec) 0}
.reach__grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:clamp(32px,5vw,64px);align-items:center}
.reach__map{background:#fff;padding:clamp(12px,2vw,28px);box-shadow:0 30px 60px -48px rgba(0,30,60,.5)}
.reach__mapbox{position:relative;display:block}
.reach__mapbox img{width:100%;height:auto}
.pin{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;pointer-events:none}
.pin::before,.pin::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--blue);animation:pinPulse 2.6s ease-out infinite}
.pin::after{animation-delay:1.3s}
.pin--vf{left:52.5%;top:43%}
.pin--sng{left:67.5%;top:49.3%}
.pin--sng::before,.pin--sng::after{border-color:var(--sng)}
@keyframes pinPulse{0%{transform:scale(.5);opacity:.9}100%{transform:scale(3.6);opacity:0}}
.reach__points{border-top:1px solid #BFC9CE}
.reach__points li{position:relative;padding:22px 0 22px 26px;border-bottom:1px solid #BFC9CE}
.reach__points li::before{content:"";position:absolute;left:2px;top:31px;width:8px;height:8px;background:var(--red);transform:rotate(-6deg)}
.reach__points h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.12rem;line-height:1.25}
.reach__points p{margin-top:6px;font-size:.95rem;line-height:1.5;color:var(--slate)}
.reach .cta-bar{margin-top:clamp(48px,6vw,72px)}
.cta-bar__copy{flex:1 1 300px;max-width:34em}
.cta-bar__btns{position:relative;z-index:1;flex:none;display:flex;flex-wrap:wrap;gap:12px;margin-right:clamp(0px,6vw,90px)}
.cta-bar__btns .btn{margin-right:0}

/* about page motion (only when motion is welcome) */
@media (prefers-reduced-motion:no-preference){
  .js .ahero__eyebrow{opacity:0;transform:translateY(10px)}
  .is-loaded .ahero__eyebrow{opacity:1;transform:none;transition:opacity .7s,transform .8s var(--ease)}
  .js .ycard{opacity:0;translate:0 28px}
  .is-loaded .ycard{opacity:1;translate:0 0;transition:opacity .8s .7s,translate 1.1s .7s var(--ease)}
  .is-loaded .ycard--vf{transition-delay:.9s}
  .js .ahero__diamond path{stroke-dashoffset:60}
  .is-loaded .ahero__diamond path{stroke-dashoffset:0;transition:stroke-dashoffset 1.2s 1.2s ease}

  .js .tl[data-reveal],.js .bridge[data-reveal],.js .values__grid[data-reveal],.js .offer__grid[data-reveal],.js .caps[data-reveal],.js .about__fig[data-reveal]{opacity:1;transform:none}

  .js .tl::before{transform:scaleX(0);transition:transform 1.8s var(--ease)}
  .js .tl.is-in::before{transform:none}
  .js .tl:not(.is-in) .tl__item{opacity:0}
  .js .tl.is-in .tl__item{animation:riseIn .8s var(--ease) backwards}
  .js .tl.is-in .tl__item:nth-child(2){animation-delay:.25s}
  .js .tl.is-in .tl__item:nth-child(3){animation-delay:.5s}
  .js .tl.is-in .tl__item:nth-child(4){animation-delay:.75s}
  .js .tl.is-in .tl__item:nth-child(5){animation-delay:1s}

  .js .about__fig[data-reveal] img{clip-path:inset(0 100% 0 0);transition:clip-path 1.3s var(--ease)}
  .js .about__copy + .about__fig[data-reveal] img{clip-path:inset(0 0 0 100%)}
  .js .about__fig.is-in img,.js .about__copy + .about__fig.is-in img{clip-path:inset(0 0 0 0)}
  .js .about__fig[data-reveal] figcaption{opacity:0;transform:translateY(8px);transition:opacity .6s 1s,transform .6s 1s var(--ease)}
  .js .about__fig.is-in figcaption{opacity:1;transform:none}

  .js .bridge .bridge__rule{transform:scaleX(0);transition:transform 1.1s .35s var(--ease)}
  .js .bridge.is-in .bridge__rule{transform:none}
  .js .bridge .diamond path{stroke-dashoffset:60;transition:stroke-dashoffset 1.1s ease}
  .js .bridge.is-in .diamond path{stroke-dashoffset:0}
  .js .bridge .bridge__label{opacity:0;transition:opacity .6s 1s}
  .js .bridge.is-in .bridge__label{opacity:1}

  .js .values__grid:not(.is-in) .value,.js .offer__grid:not(.is-in) .offer__card,.js .caps:not(.is-in) .caps__intro,.js .caps:not(.is-in) .caps__list li{opacity:0}
  .js .values__grid.is-in .value,.js .offer__grid.is-in .offer__card,.js .caps.is-in .caps__intro,.js .caps.is-in .caps__list li{animation:riseIn .8s var(--ease) backwards}
  .js .values__grid.is-in .value:nth-child(2),.js .offer__grid.is-in .offer__card:nth-child(2),.js .caps.is-in .caps__list li:nth-child(1){animation-delay:.12s}
  .js .values__grid.is-in .value:nth-child(3),.js .offer__grid.is-in .offer__card:nth-child(3),.js .caps.is-in .caps__list li:nth-child(2){animation-delay:.24s}
  .js .values__grid.is-in .value:nth-child(4),.js .caps.is-in .caps__list li:nth-child(3){animation-delay:.36s}
}

/* about page responsive */
@media (max-width:1060px){
  .values__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .caps{grid-template-columns:1fr}
}
@media (max-width:900px){
  .tl{grid-template-columns:1fr;row-gap:30px;padding:0 0 0 36px}
  .tl::before{left:6px;right:auto;top:8px;bottom:8px;width:1px;height:auto;transform-origin:top}
  .tl__item::before{left:-36px;top:12px}
  .reach__grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:no-preference) and (max-width:900px){
  .js .tl::before{transform:scaleY(0)}
}
@media (max-width:760px){
  .offer__grid{grid-template-columns:1fr;gap:18px}
  .offer__card{display:grid;grid-template-columns:42% minmax(0,1fr);column-gap:18px;align-items:center}
  .offer__img{grid-row:1 / span 2}
  .offer__name{margin-top:0;align-self:end;font-size:1.25rem}
  .offer__meta{align-self:start;font-size:.92rem}
  .caps__list{grid-template-columns:1fr}
  .cta-bar__btns{flex:1 1 100%;margin-right:0}
  .cta-bar__btns .btn{flex:1 1 auto}
  .reach .cta-bar::after{width:64px;height:64px;right:-24px;bottom:-30px}
}
@media (max-width:560px){
  .values__grid{grid-template-columns:1fr}
}

/* ================= Partnership page ================= */

/* hero: the two partners as panels meeting at the diamond */
.phero__art{container-type:inline-size}
.ppanel{position:absolute;display:flex;flex-direction:column;justify-content:space-between;width:49%;height:62%;padding:clamp(18px,5.4cqi,34px);color:#fff;box-shadow:0 40px 60px -40px rgba(0,25,55,.65);animation:panelFloat 7s ease-in-out infinite}
.ppanel--sng{left:1%;top:9%;background:var(--sng);rotate:-4deg}
.ppanel--vf{right:1%;top:27%;background:var(--blue);rotate:4deg;animation-delay:-3.5s}
.ppanel__logo{width:auto;height:clamp(20px,6.6cqi,40px);align-self:flex-start}
.ppanel--vf .ppanel__logo{height:clamp(24px,8cqi,48px)}
.ppanel__name{display:block;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:clamp(1rem,4.4cqi,1.7rem);line-height:1.1}
.ppanel__meta{display:block;margin-top:6px;font-size:clamp(.76rem,2.8cqi,1rem);color:rgba(255,255,255,.82)}
.pjoin{position:absolute;z-index:2;left:50%;top:54%;width:clamp(40px,11cqi,64px);height:clamp(40px,11cqi,64px);background:#fff;transform:translate(-50%,-50%) rotate(45deg);box-shadow:0 18px 30px -14px rgba(0,25,55,.6)}
.pjoin::after{content:"";position:absolute;inset:31%;background:var(--red)}
@keyframes panelFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* what each partner brings */
.brings{background:var(--mist);padding:var(--sec) 0}
.sum{display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr) 64px minmax(0,1fr);align-items:stretch}
.sum__op{display:grid;place-items:center}
.sum__op span{display:grid;place-items:center;width:40px;height:40px;border:1.5px solid var(--ink);background:var(--mist);transform:rotate(45deg)}
.sum__op b{transform:rotate(-45deg);font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.35rem;line-height:1}
.bcard{display:flex;flex-direction:column;gap:18px;background:#fff;padding:clamp(26px,2.8vw,38px);border-top:3px solid var(--blue);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.bcard:hover{transform:translateY(-6px);box-shadow:0 30px 50px -36px rgba(0,30,60,.55)}
.bcard--sng{border-top-color:var(--sng)}
.bcard__logo{height:46px;width:auto;align-self:flex-start}
.bcard--sng .bcard__logo{height:38px;margin:4px 0}
.bcard h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.28rem;line-height:1.2}
.bcard__list{display:grid;gap:12px;padding-top:20px;border-top:1px solid var(--line)}
.bcard__list li{position:relative;padding-left:22px;font-size:.96rem;line-height:1.45}
.bcard__list li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;background:var(--blue);transform:rotate(-6deg)}
.bcard--sng .bcard__list li::before{background:var(--sng)}
.bcard--sum{background:var(--blue);color:#fff;border-top-color:var(--red)}
.bcard--sum .bcard__logo{height:26px;margin:10px 0}
.bcard--sum .bcard__list{border-top-color:rgba(255,255,255,.28)}
.bcard--sum .bcard__list li::before{background:#fff}

/* what it means for you */
.gains{padding:var(--sec) 0;background:#fff}
.gains__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.gain{position:relative;padding:34px 30px 38px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background-color .35s}
.gain::before{content:"";position:absolute;left:0;right:0;top:-1px;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.gain:hover{background:var(--mist)}
.gain:hover::before{transform:scaleX(1)}
.gain__icon{width:34px;height:34px;margin-bottom:22px;fill:none;stroke:var(--blue);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--ease)}
.gain:hover .gain__icon{transform:translateY(-3px) rotate(-6deg)}
.gain h3{font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.22rem;line-height:1.2}
.gain p{margin-top:10px;font-size:.97rem;line-height:1.55;color:var(--slate)}

/* how we work with you */
.process{background:var(--graphite);color:#fff;padding:var(--sec) 0;overflow:hidden}
.process .eyebrow{color:#8FC0E8}
.process .sec-head__lead{color:var(--on-dark)}
.flow{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.flow::before{content:"";position:absolute;left:0;right:0;top:.62em;height:1px;font-size:clamp(3.4rem,5.4vw,4.8rem);background:rgba(255,255,255,.25);transform-origin:left}
.flow li{position:relative}
.flow__num{position:relative;display:inline-block;padding-right:16px;background:var(--graphite);font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:700;font-size:clamp(3.4rem,5.4vw,4.8rem);line-height:1.1;letter-spacing:-.01em;color:transparent;-webkit-text-stroke:1.3px rgba(255,255,255,.6);transition:color .4s}
.flow li:hover .flow__num{color:#fff}
.flow h3{margin-top:18px;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.2rem;line-height:1.25}
.flow p{margin-top:8px;font-size:.97rem;line-height:1.55;color:var(--on-dark)}
@keyframes numGlow{0%,100%{color:transparent}45%{color:#fff}}

/* statement */
.pquote{position:relative;background:var(--blue);color:#fff;padding:clamp(72px,9vw,124px) 0;overflow:hidden;text-align:center}
.pquote::before,.pquote::after{content:"";position:absolute;width:320px;height:320px;border:1.5px solid rgba(255,255,255,.14);transform:rotate(45deg);pointer-events:none}
.pquote::before{left:-180px;top:-130px}
.pquote::after{right:-180px;bottom:-130px}
.pquote .diamond{margin:0 auto 28px;width:34px;height:34px;stroke:#fff}
.pquote__text{max-width:24em;margin:0 auto;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:clamp(1.7rem,3.3vw,2.8rem);line-height:1.2}
.pquote__text .ln{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.pquote__text .ln > span{display:block}
.pquote__accent{color:#BFDDF5}

/* together at CPHI Milan */
.together{padding:var(--sec) 0;background:#fff}
.together__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr);gap:clamp(32px,5vw,72px);align-items:center}
.together__fig img{width:100%;height:auto}
.together__copy h2{margin:18px 0}
.together__text{max-width:32em;color:var(--slate)}
.together__facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:28px 0 32px;border-top:1px solid var(--line)}
.together__facts div{padding:14px 14px 14px 0;border-bottom:1px solid var(--line)}
.together__facts div + div{padding-left:16px;border-left:1px solid var(--line)}
.together__facts dt{font-size:.88rem;font-weight:500;color:var(--muted)}
.together__facts dd{margin-top:2px;font-family:var(--f-display);font-variation-settings:var(--flare);font-weight:600;font-size:1.08rem;white-space:nowrap}
.together__btns{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px}

/* partnership motion (only when motion is welcome) */
@media (prefers-reduced-motion:no-preference){
  .js .ppanel--sng{opacity:0;translate:-70px 0}
  .js .ppanel--vf{opacity:0;translate:70px 0}
  .is-loaded .ppanel{opacity:1;translate:0 0;transition:opacity .8s .3s,translate 1.2s .3s var(--ease)}
  .js .pjoin{scale:0}
  .is-loaded .pjoin{scale:1;transition:scale .7s 1.25s cubic-bezier(.3,1.6,.5,1)}

  .js .sum[data-reveal],.js .gains__grid[data-reveal],.js .flow[data-reveal],.js .pquote[data-reveal],.js .wipe[data-reveal]{opacity:1;transform:none}
  .js .sum:not(.is-in) > *{opacity:0}
  .js .sum.is-in > *{animation:riseIn .8s var(--ease) backwards}
  .js .sum.is-in > :nth-child(2){animation-delay:.25s}
  .js .sum.is-in > :nth-child(3){animation-delay:.4s}
  .js .sum.is-in > :nth-child(4){animation-delay:.65s}
  .js .sum.is-in > :nth-child(5){animation-delay:.8s}

  .js .gains__grid:not(.is-in) .gain{opacity:0}
  .js .gains__grid.is-in .gain{animation:riseIn .8s var(--ease) backwards}
  .js .gains__grid.is-in .gain:nth-child(2){animation-delay:.1s}
  .js .gains__grid.is-in .gain:nth-child(3){animation-delay:.2s}
  .js .gains__grid.is-in .gain:nth-child(4){animation-delay:.3s}
  .js .gains__grid.is-in .gain:nth-child(5){animation-delay:.4s}
  .js .gains__grid.is-in .gain:nth-child(6){animation-delay:.5s}

  .js .flow::before{transform:scaleX(0);transition:transform 1.8s var(--ease)}
  .js .flow.is-in::before{transform:none}
  .js .flow:not(.is-in) li{opacity:0}
  .js .flow.is-in li{animation:riseIn .8s var(--ease) backwards}
  .js .flow.is-in .flow__num{animation:numGlow 1.4s ease}
  .js .flow.is-in li:nth-child(2),.js .flow.is-in li:nth-child(2) .flow__num{animation-delay:.3s}
  .js .flow.is-in li:nth-child(3),.js .flow.is-in li:nth-child(3) .flow__num{animation-delay:.6s}
  .js .flow.is-in li:nth-child(4),.js .flow.is-in li:nth-child(4) .flow__num{animation-delay:.9s}

  .js .pquote .ln > span{transform:translateY(106%)}
  .js .pquote.is-in .ln > span{transform:none;transition:transform 1s var(--ease)}
  .js .pquote.is-in .ln:nth-child(2) > span{transition-delay:.12s}
  .js .pquote.is-in .ln:nth-child(3) > span{transition-delay:.24s}
  .js .pquote .diamond path{stroke-dashoffset:60;transition:stroke-dashoffset 1.2s ease}
  .js .pquote.is-in .diamond path{stroke-dashoffset:0}

  .js .wipe[data-reveal] img{clip-path:inset(0 100% 0 0);transition:clip-path 1.3s var(--ease)}
  .js .wipe.is-in img{clip-path:inset(0 0 0 0)}
}

/* partnership responsive */
@media (max-width:1060px){
  .sum{grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr)}
  .sum > .sum__op:nth-child(4){grid-column:1 / -1;height:72px}
  .sum > .bcard--sum{grid-column:1 / -1}
}
@media (max-width:900px){
  .gains__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .flow{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}
  .flow::before{display:none}
  .together__grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .sum{grid-template-columns:1fr}
  .sum__op{height:64px}
  .gains__grid,.flow{grid-template-columns:1fr}
  .together__facts{grid-template-columns:1fr}
  .together__facts div + div{padding-left:0;border-left:0}
}