/* ==========================================================================
   Pharmazon — About · "People and proof"
   The faces behind the pharmacy, a seal that turns, numbers that count up,
   a prescription's journey and a ledger anyone can verify.
   ========================================================================== */

/* ======================================================================
   HERO
   ====================================================================== */
.ab-hero{position:relative;min-height:100svh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(30px,5vw,96px);padding:clamp(120px,15vh,150px) var(--sv-e) clamp(50px,7vh,80px);overflow:hidden}
.ab-kicker{display:inline-flex;align-items:center;gap:12px;font:600 12px/1 var(--pz-ui);letter-spacing:.2em;text-transform:uppercase;color:var(--pb-teal);margin-bottom:clamp(22px,3vh,32px)}
.ab-kicker::before{content:"";width:28px;height:1px;background:currentColor}
.ab-h1{font-family:var(--pz-ui);font-weight:500;font-size:clamp(50px,6.4vw,112px);line-height:.98;letter-spacing:-.055em;color:var(--pb-text);margin-bottom:clamp(22px,3vh,30px)}
.ab-h1 .ln{display:block;overflow:hidden;padding:0 .12em .26em 0;margin-bottom:-.26em}
.ab-h1 .ln > span{display:block}
.ab-h1 em{font-family:var(--pz-body);font-style:italic;font-weight:400;letter-spacing:-.03em;color:var(--pb-teal)}
.ab-lede{font-family:var(--pz-body);font-size:clamp(17px,1.35vw,21px);line-height:1.6;color:var(--pb-soft);max-width:44ch;margin-bottom:clamp(26px,4vh,38px)}
.ab-cta{display:flex;align-items:center;flex-wrap:wrap;gap:16px 28px}
.ab-cta .sv-btn{height:56px;padding:0 26px;font-size:16px}

.ab-hero__faces{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(12px,1.4vw,20px);width:min(100%,560px);justify-self:center}
.ab-face{display:block;overflow:hidden;aspect-ratio:4/5;border-radius:999px 999px 26px 26px;background:#E7ECEA;box-shadow:0 30px 60px -40px rgba(2,61,84,.5)}
.ab-face:nth-child(2),.ab-face:nth-child(4){transform:translateY(clamp(30px,5vw,70px))}
.ab-face img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;transition:transform 1.2s var(--pz-expo)}
.ab-face:hover img{transform:scale(1.06)}
.ab-seal{position:absolute;left:50%;top:50%;width:clamp(130px,12vw,170px);height:auto;transform:translate(-50%,-30%);z-index:2;overflow:visible}
.ab-seal > circle{fill:#F6F4EF;stroke:rgba(2,61,84,.15)}
.ab-seal text{font:600 10.5px var(--pz-ui);letter-spacing:.19em;fill:var(--pb-petrol)}
.ab-seal textPath{animation:none}
.ab-seal > text{transform-origin:100px 100px;animation:ab-spin 30s linear infinite}
.ab-seal__b{font:italic 400 42px var(--pz-body) !important;letter-spacing:-.02em !important;fill:var(--pb-teal) !important}
.ab-seal__s{font:600 9px var(--pz-ui) !important;letter-spacing:.16em !important;text-transform:uppercase;fill:var(--pb-soft) !important}
@keyframes ab-spin{to{transform:rotate(360deg)}}

/* ======================================================================
   STATEMENT
   ====================================================================== */
.ab-say{padding:clamp(100px,11vw,180px) var(--sv-e) clamp(70px,7vw,110px);text-align:center}
.ab-say__t{max-width:22ch;margin:0 auto;font-family:var(--pz-ui);font-weight:500;font-size:clamp(34px,4.4vw,72px);line-height:1.06;letter-spacing:-.05em;color:var(--pb-text);text-wrap:balance}
.ab-say__t em{font-family:var(--pz-body);font-style:italic;font-weight:400;letter-spacing:-.025em;color:var(--pb-teal);margin-left:.12em}
.ab-say__s{max-width:52ch;margin:clamp(26px,3vw,40px) auto 0;font-family:var(--pz-body);font-size:clamp(17px,1.3vw,20px);line-height:1.6;color:var(--pb-soft)}

/* ======================================================================
   NUMBERS
   ====================================================================== */
.ab-stats{padding:clamp(60px,7vw,110px) var(--sv-e);background:var(--pb-petrol);color:#EAF1EE;position:relative;overflow:hidden;isolation:isolate}
.ab-stats::before{content:"";position:absolute;left:30%;top:-60%;width:60vw;height:60vw;border-radius:50%;background:radial-gradient(circle,rgba(1,150,138,.4),rgba(2,61,84,0) 60%);z-index:-1}
.ab-stats ul{display:grid;grid-template-columns:repeat(4,1fr)}
.ab-stats li{display:flex;flex-direction:column;gap:10px;padding:0 clamp(16px,2.4vw,36px)}
.ab-stats li + li{border-left:1px solid rgba(234,241,238,.18)}
.ab-stats li:first-child{padding-left:0}
.ab-stats b{display:flex;align-items:baseline;gap:6px;font-family:var(--pz-ui);font-weight:500;font-size:clamp(44px,5vw,84px);line-height:1;letter-spacing:-.05em;color:#F2EFE6;font-variant-numeric:tabular-nums}
.ab-stats b small{font-family:var(--pz-body);font-style:italic;font-weight:400;font-size:.42em;letter-spacing:-.01em;color:#C3DE9A}
.ab-stats li > span{font:500 14.5px/1.4 var(--pz-ui);color:rgba(234,241,238,.72)}

/* ======================================================================
   SHARED photographs
   ====================================================================== */
.ab-story__img,.ab-jour__img{position:relative;margin:0;overflow:hidden;border-radius:999px 999px 28px 28px}
.ab-story__img img,.ab-jour__img img{width:100%;height:100%;object-fit:cover}

/* ======================================================================
   OUR STORY
   ====================================================================== */
.ab-story{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:clamp(36px,6vw,120px);padding:clamp(90px,9vw,150px) var(--sv-e)}
.ab-story__img{aspect-ratio:4/5;max-height:80vh}
.ab-story .sv-h2{max-width:13ch}
.ab-story .sv-lede{margin:22px 0 clamp(28px,3vw,40px)}
.ab-list{border-top:1.5px solid var(--pb-text)}
.ab-list li{display:grid;grid-template-columns:56px 1fr;padding:20px 0;border-bottom:1px solid var(--pb-line)}
.ab-n{font-family:var(--pz-body);font-style:italic;font-size:22px;color:var(--pb-teal)}
.ab-list h3{font:500 clamp(20px,1.7vw,25px)/1.2 var(--pz-ui);letter-spacing:-.03em;color:var(--pb-text);margin-bottom:4px}
.ab-why{margin-top:28px}
.ab-list p{font-family:var(--pz-body);font-size:16.5px;line-height:1.5;color:var(--pb-soft)}

/* ======================================================================
   AWARD
   ====================================================================== */
.ab-award{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:clamp(36px,6vw,110px);padding:clamp(90px,9vw,150px) var(--sv-e);background:#E2EECB;position:relative;overflow:hidden}
.ab-award__mark{position:relative;width:min(100%,420px);aspect-ratio:1;justify-self:center;display:grid;place-items:center}
.ab-laurel{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ab-laurel ellipse{fill:var(--pb-teal);opacity:0}
.ab-laurel__r ellipse{fill:#5E8A3A}
.ab-award.is-in .ab-laurel ellipse{animation:ab-leaf .9s var(--pz-expo) forwards;animation-delay:calc(var(--k) * 70ms)}
@keyframes ab-leaf{from{opacity:0}to{opacity:.9}}
.ab-award__mark p{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.ab-award__mark small{font:600 12px/1 var(--pz-ui);letter-spacing:.24em;text-transform:uppercase;color:var(--pb-petrol)}
.ab-award__mark b{font-family:var(--pz-body);font-style:italic;font-weight:400;font-size:clamp(64px,7vw,110px);line-height:1;letter-spacing:-.03em;color:var(--pb-petrol)}
.ab-award .sv-tag{color:var(--pb-petrol)}
.ab-award__t{font-family:var(--pz-ui);font-weight:500;font-size:clamp(38px,4.6vw,76px);line-height:1.02;letter-spacing:-.05em;color:var(--pb-petrol);max-width:13ch;margin-bottom:22px}
.ab-award__t em{font-family:var(--pz-body);font-style:italic;font-weight:400;letter-spacing:-.025em;color:var(--pb-teal);margin-left:.1em}
.ab-award__l{font-family:var(--pz-body);font-size:clamp(17px,1.3vw,20px);line-height:1.6;color:#36515C;max-width:46ch;margin-bottom:28px}
.ab-award__q{padding-left:22px;border-left:2px solid var(--pb-teal);font-family:var(--pz-body);font-style:italic;font-size:clamp(20px,1.7vw,26px);line-height:1.4;color:var(--pb-petrol);max-width:34ch}
.ab-award__q cite{display:block;margin-top:12px;font:500 13.5px/1 var(--pz-ui);font-style:normal;color:#36515C}

/* ======================================================================
   A PRESCRIPTION'S JOURNEY
   ====================================================================== */
.ab-jour{padding:clamp(90px,9vw,150px) var(--sv-e)}
.ab-jour__head{display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:clamp(30px,5vw,90px);margin-bottom:clamp(50px,5vw,80px)}
.ab-jour .sv-h2{max-width:13ch}
.ab-jour__img{aspect-ratio:5/4;max-height:420px}
.ab-js{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(14px,1.6vw,26px)}
.ab-js__line{position:absolute;left:22px;right:22px;top:22px;height:1.5px;background:rgba(2,61,84,.12)}
.ab-js__line i{display:block;height:100%;background:var(--pb-teal);transform:scaleX(var(--p,0));transform-origin:left}
.ab-j{position:relative;opacity:.35;transition:opacity .6s}
.ab-j.is-on{opacity:1}
.ab-j__n{position:relative;display:grid;place-items:center;width:44px;height:44px;margin-bottom:20px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(2,61,84,.2);font-family:var(--pz-body);font-style:italic;font-size:19px;color:var(--pb-text);transition:background-color .5s, color .5s, box-shadow .5s}
.ab-j.is-on .ab-j__n{background:var(--pb-teal);color:#fff;box-shadow:0 0 0 6px rgba(1,150,138,.14)}
.ab-j h3{font:500 clamp(19px,1.5vw,22px)/1.2 var(--pz-ui);letter-spacing:-.03em;color:var(--pb-text);margin-bottom:6px}
.ab-j p{font-family:var(--pz-body);font-size:15.5px;line-height:1.5;color:var(--pb-soft)}
.ab-note{margin-top:clamp(30px,3vw,44px);font:500 14.5px/1.5 var(--pz-ui);color:var(--pb-teal)}

/* ======================================================================
   TEAM
   ====================================================================== */
.ab-team{padding:clamp(90px,9vw,150px) var(--sv-e)}
.ab-team .sv-head--row .sv-h2{max-width:13ch}
.ab-team .sv-lede{max-width:40ch}
.ab-ms{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,32px)}
.ab-m figure{margin:0 0 20px;overflow:hidden;aspect-ratio:4/5;border-radius:999px 999px 26px 26px;background:#E7ECEA}
.ab-m img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;filter:grayscale(.25);transition:transform 1.2s var(--pz-expo), filter .8s}
.ab-m:hover img{transform:scale(1.05);filter:none}
.ab-m h3{font:500 clamp(20px,1.7vw,25px)/1.2 var(--pz-ui);letter-spacing:-.03em;color:var(--pb-text)}
.ab-m__r{margin:4px 0 10px;font:500 13.5px/1.4 var(--pz-ui);color:var(--pb-teal)}
.ab-m__d{font-family:var(--pz-body);font-size:15.5px;line-height:1.5;color:var(--pb-soft)}

/* ======================================================================
   VERIFY: the ledger
   ====================================================================== */
.ab-verify{display:grid;grid-template-columns:.8fr 1.2fr;align-items:start;gap:clamp(36px,6vw,110px);padding:clamp(90px,9vw,150px) var(--sv-e)}
.ab-verify .sv-h2{max-width:12ch;margin-bottom:22px}
.ab-ledger{width:100%;border-collapse:collapse;border-top:1.5px solid var(--pb-text)}
.ab-ledger tr{position:relative;border-bottom:1px solid var(--pb-line);transition:background-color .4s}
.ab-ledger tr:hover{background:#F3F6F2}
.ab-ledger th{width:34%;padding:20px 16px 20px 0;text-align:left;vertical-align:top;font:600 11.5px/1.5 var(--pz-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--pb-teal)}
.ab-ledger td{padding:16px 0;vertical-align:top}
.ab-ledger td b{display:block;font-family:var(--pz-body);font-style:italic;font-weight:400;font-size:clamp(20px,1.7vw,25px);line-height:1.25;letter-spacing:-.01em;color:var(--pb-text);font-variant-numeric:tabular-nums}
.ab-ledger td small{display:block;margin-top:4px;font:400 14px/1.4 var(--pz-ui);color:var(--pb-soft)}
.ab-ledger td:last-child{text-align:right;padding-left:16px;white-space:nowrap}
.ab-ledger a{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:99px;font:500 13.5px/1 var(--pz-ui);color:var(--pb-text);box-shadow:inset 0 0 0 1px rgba(2,61,84,.2);transition:background-color .4s, color .4s, box-shadow .4s}
.ab-ledger a:hover{background:var(--pb-petrol);color:#F2EFE6;box-shadow:none}
.ab-ledger a svg{width:12px;height:12px}

/* ======================================================================
   PATIENTS AND CLINICS
   ====================================================================== */
.ab-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);padding:clamp(90px,9vw,150px) var(--sv-e)}
.ab-two__c{padding-top:28px;border-top:1.5px solid var(--pb-text)}
.ab-two h3{font-family:var(--pz-ui);font-weight:500;font-size:clamp(30px,3vw,46px);line-height:1.05;letter-spacing:-.045em;color:var(--pb-text);margin-bottom:24px}
.ab-two h3 em{font-family:var(--pz-body);font-style:italic;font-weight:400;letter-spacing:-.02em;color:var(--pb-teal)}
.ab-two ul{display:grid;gap:12px;margin-bottom:28px}
.ab-two li{display:flex;align-items:center;gap:12px;font:500 16px/1.4 var(--pz-ui);color:var(--pb-text)}
.ab-two li svg{flex:none;width:22px;height:22px;padding:4px;border-radius:50%;background:#E1F1EC;color:var(--pb-teal)}

/* ======================================================================
   VOICES
   ====================================================================== */
.ab-voices{padding:clamp(90px,9vw,150px) var(--sv-e)}
.ab-vs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,56px)}
.ab-v{margin:0;padding-top:26px;border-top:1.5px solid var(--pb-text)}
.ab-v blockquote{font-family:var(--pz-body);font-style:italic;font-size:clamp(19px,1.5vw,23px);line-height:1.45;color:var(--pb-text);margin-bottom:18px}
.ab-v blockquote::before{content:"“";display:block;font-size:56px;line-height:.6;color:var(--pb-teal);margin-bottom:14px}
.ab-v figcaption{font:400 14px/1 var(--pz-ui);color:var(--pb-soft)}
.ab-v figcaption b{font-weight:600;color:var(--pb-text)}
.a-voices__score{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font:400 14px/1 var(--pz-ui);color:var(--pb-soft)}
.a-voices__score svg{width:18px;height:18px}
.a-voices__score b{font-weight:600;color:var(--pb-text)}
.a-voices__score span{width:1px;height:16px;background:rgba(2,61,84,.2);margin:0 8px}

/* ======================================================================
   RESPONSIVE
   ====================================================================== */
@media (max-width:1100px){
  .ab-hero{grid-template-columns:1fr;min-height:0}
  .ab-hero__faces{order:-1;width:min(88%,460px);margin-bottom:60px}
  .ab-story,.ab-award,.ab-verify,.ab-jour__head{grid-template-columns:1fr}
  .ab-story__img{aspect-ratio:16/14;max-height:none;border-radius:240px 240px 28px 28px}
  .ab-stats ul{grid-template-columns:1fr 1fr;row-gap:36px}
  .ab-stats li:nth-child(3){border-left:0;padding-left:0}
  .ab-js{grid-template-columns:1fr 1fr 1fr;row-gap:36px}
  .ab-js__line{display:none}
  .ab-ms{grid-template-columns:1fr 1fr}
  .ab-vs{grid-template-columns:1fr}
  .ab-award__mark{width:min(70%,320px)}
}
@media (max-width:640px){
  .ab-h1{font-size:clamp(44px,12.4vw,60px)}
  .ab-cta{flex-direction:column;align-items:flex-start}
  .ab-stats ul{grid-template-columns:1fr}
  .ab-stats li{padding:0 0 26px;border-left:0 !important;border-bottom:1px solid rgba(234,241,238,.18)}
  .ab-js{grid-template-columns:1fr 1fr}
  .ab-ms{gap:14px}
  .ab-two{grid-template-columns:1fr}
  .ab-ledger th{display:block;width:auto;padding:16px 0 0}
  .ab-ledger tr{display:grid;grid-template-columns:1fr auto;align-items:end}
  .ab-ledger th{grid-column:1 / -1}
  .ab-ledger td{padding:6px 0 16px}
}
@media (prefers-reduced-motion:reduce){
  .ab-seal > text{animation:none}
  .ab-laurel ellipse{opacity:.9 !important;animation:none !important}
  .ab-j{opacity:1}
}