/* immersions: client page styles, scoped under main.ugx by tools/import_ug_client.mjs. */

  /* page-only pieces */
  .ugx .route{display:flex;gap:40px;align-items:center;white-space:nowrap;font-size:15px;font-weight:500;color:var(--cream-72);padding-block:18px}
  .ugx .route span{display:inline-flex;gap:12px;align-items:baseline}
  .ugx .route b{font-weight:700;font-size:22px;letter-spacing:-.03em;color:var(--cream)}
  .ugx .ucb{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,56px);align-items:stretch}
  .ugx .ucb .ledger > li{grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);align-items:baseline}
  .ugx .ucb .ledger .num{font-size:clamp(34px,3.4vw,48px)}
  .ugx .visits{border-top:1px solid var(--rule)}
  .ugx .visits li{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:22px 0 22px 20px;border-bottom:1px solid var(--rule);cursor:pointer;position:relative;outline-offset:-2px}
  .ugx .visits li::before{content:"";position:absolute;left:0;top:28px;width:8px;height:8px;border-radius:50%;background:var(--rule);transition:background .2s ease}
  .ugx .visits li.is-on::before{background:var(--red)}
  .ugx .visits h3{font-size:clamp(22px,2.2vw,30px);font-weight:600;letter-spacing:-.02em}
  .ugx .visits p{font-size:15.5px;color:var(--cream-72);max-width:46ch}
  .ugx .stage{position:relative;border-radius:var(--r-photo);overflow:hidden;aspect-ratio:4/3;background:var(--maroon-deep);align-self:start;width:100%;max-width:100%}
  .ugx .stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
  .ugx .stage img.is-on{opacity:1}
  .ugx .bb{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,56px);align-items:center}
  .ugx .bb__photos{display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:1fr 1fr;gap:18px;height:clamp(380px,42vw,560px)}
  .ugx .bb__photos .ph:first-child{grid-row:span 2}
  .ugx .bb__photos .ph img{position:absolute;inset:0}
  @media (max-width:860px){.ugx .ucb,.ugx .bb{grid-template-columns:1fr}}
  /* v2: compact Berkeley card, success story, quick-scan campuses and hubs, apply */
  .ugx .bcard{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);border-radius:var(--r-photo);overflow:hidden;background:radial-gradient(90% 120% at 100% 0%,rgba(186,59,65,.3),transparent 60%),var(--maroon-deep)}
  .ugx .bcard__ph{margin:0;position:relative;min-height:280px}
  .ugx .bcard__ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 60%}
  .ugx .bcard__txt{padding:clamp(20px,3vw,40px);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
  .ugx .bcard__txt .lede{font-size:clamp(18px,1.46vw,21px);line-height:1.5;max-width:56ch}
  .ugx .bcard__stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;width:100%;margin-top:6px}
  .ugx .bcard__stats li{border-top:2px solid var(--red);padding-top:12px;display:flex;flex-direction:column;gap:8px}
  .ugx .bcard__stats .num{font-size:clamp(42px,5vw,80px);line-height:1}
  .ugx .bcard__stats .num small{font-size:.3em}
  .ugx .bcard__hq{font-size:clamp(42px,5vw,80px);line-height:1;font-weight:700;letter-spacing:-.05em;color:var(--cream)}
  .ugx .bcard__stats p{font-size:clamp(15px,1.2vw,17.3px);line-height:1.35;color:var(--cream-72)}
  .ugx .bcard__real{font-size:clamp(16px,1.2vw,17.3px);line-height:1.5;color:var(--cream-72);padding-top:4px}
  .ugx .bcard__real b{color:var(--cream)}
  .ugx .feat{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:stretch;border-radius:var(--r-photo);overflow:hidden;background:radial-gradient(90% 120% at 0% 0%,rgba(186,59,65,.38),transparent 60%),var(--maroon-deep)}
  .ugx .feat__ph{margin:0;position:relative;min-height:320px}
  .ugx .feat__ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
  .ugx .feat__txt{padding:clamp(22px,3.4vw,48px);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
  .ugx .pill{height:30px;font-size:14px;padding:0 14px}
  .ugx .feat__logos{height:40px;width:auto;border-radius:10px;display:block}
  .ugx .feat__num{font-size:clamp(56px,7vw,104px);line-height:1;font-weight:700;letter-spacing:-.05em;color:var(--cream);display:flex;align-items:baseline;gap:.18em;flex-wrap:wrap}
  .ugx .feat__num .num{font-size:1em;line-height:1}
  .ugx .feat__num small{font-size:.3em;font-weight:600;letter-spacing:-.02em}
  .ugx .feat__h{font-size:clamp(22px,2.2vw,30px);font-weight:300;letter-spacing:-.025em;line-height:1.15}
  .ugx .feat__h em{font-style:normal;font-weight:600;color:var(--cream)}
  .ugx .feat__p{font-size:17px;line-height:1.55;color:var(--cream-72);max-width:58ch}
  .ugx #gallery .head{margin-bottom:20px}
  .ugx .unis-sec{padding-block:clamp(36px,4.5vw,56px)!important}
  .ugx .unis-sec .head{margin-bottom:20px}
  .ugx .unis-sec .uni{padding:8px 8px 14px;border-radius:22px}
  .ugx .unis-sec .uni__ph{aspect-ratio:16/10;border-radius:16px}
  .ugx .unis-sec .uni__yr{margin:12px 8px 2px;font-size:15px}
  .ugx .unis-sec .uni__nm{margin:0 8px;font-size:clamp(16px,1.3vw,19px)}
  .ugx .glob-sec{padding-block:clamp(36px,4.5vw,56px)!important}
  .ugx .glob-sec .head{margin-bottom:20px;grid-template-columns:1fr}
  /* .glob-sec / .unis-sec headings wrap: the client's longer copy (2026-10-16) doesn't fit one line */
  .ugx .globs .dest{aspect-ratio:auto!important;min-height:0;gap:18px;padding:20px 22px}
  .ugx .globs .dest{justify-content:flex-start}
  .ugx .globs .dest h3{font-size:clamp(28px,2.8vw,38px)}
  .ugx .globs .dest p{font-size:16px;margin-top:8px}
  .ugx .globs .dest .coord{font-size:15px}
  .ugx .apply-sec{padding-block:clamp(28px,4vw,48px)!important}
  .ugx .apply-wrap{display:flex;justify-content:center}
  .ugx .apply-wrap .btn{height:60px;min-width:280px;justify-content:space-between;font-size:16px}
  .ugx .bb__copy{display:flex;flex-direction:column;gap:14px}
  .ugx .bb__num{font-size:clamp(84px,9.5vw,140px);line-height:.9}
  .ugx .bb__copy .ledger > li{padding:14px 0}
  .ugx .bb__photos{height:clamp(340px,38vw,500px)}
  @media (min-width:861px){.ugx .bb__photos{order:-1}}
  .ugx .bbs{padding-block:clamp(36px,4.5vw,64px)!important}
  .ugx .bbs .bb{align-items:center}
  .ugx .bb__copy{gap:16px}
  .ugx .bb__copy .h-l{font-size:clamp(30px,3.4vw,48px)}
  .ugx .bbs__founders{margin-top:clamp(28px,3.5vw,48px);padding-top:clamp(24px,3vw,40px);border-top:1px solid var(--rule)}
  .ugx .bbs__founders .bbf-head{margin-top:0;margin-bottom:22px}
  .ugx .bbs .bbf__name{font-size:20px}
  .ugx .bbs .bbf__co{font-size:16px}
  @media (max-width:860px){
    .ugx .bcard,.ugx .feat{grid-template-columns:1fr}
    .ugx .bcard__ph{min-height:0;aspect-ratio:16/10}
    .ugx .feat__ph{order:-1;min-height:0;aspect-ratio:4/3.4}
    .ugx .feat__txt{padding:20px}
    .ugx .bb__copy{order:1}
    .ugx .bb__photos{order:2;height:auto;display:grid;grid-template-columns:none;grid-template-rows:none;grid-auto-flow:column;grid-auto-columns:78%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(-1*var(--gutter,16px));padding-inline:var(--gutter,16px);scroll-padding-inline:var(--gutter,16px)}
    .ugx .bb__photos::-webkit-scrollbar{display:none}
    .ugx .bb__photos .ph{aspect-ratio:4/3;grid-row:auto!important;scroll-snap-align:start}
  }
  @media (max-width:560px){
    .ugx .bcard__stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}
    .ugx .bcard__stats .num,.ugx .bcard__hq{font-size:44px}
    .ugx .bb__num{font-size:88px}
    .ugx .unis-sec .unis{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-flow:row!important;overflow:visible!important;margin-inline:0!important;padding-inline:0!important;gap:10px}
    .ugx .unis-sec .uni__ph{aspect-ratio:4/3}
    .ugx .globs .dest{padding:16px 18px}
    .ugx .apply-wrap .btn{width:100%}
  }
  /* v12: dimensions taken from the live UG page CSS. Root font-size: 14px (1000-1399), 16px (1400+), 17px (1600+), 19px (1900+), 23px (2000+).
     Container (--max-container-grid): 1280px (to 1440), 1400px (1441+), 1500px (1600+), 1650px (1900+), 1700px (2000+).
     html zoom = root font-size / 16; --max = container / zoom, so the content box matches the live page. */
  @media (min-width:1000px) and (max-width:1399px){main.ugx{zoom:.875}.ugx{--max:1463px;--gutter:44px}}
  @media (min-width:1400px){.ugx{--max:1280px;--gutter:0px}}
  @media (min-width:1441px){.ugx{--max:1400px}}
  @media (min-width:1600px){main.ugx{zoom:1.0625}.ugx{--max:1412px}}
  @media (min-width:1900px){main.ugx{zoom:1.1875}.ugx{--max:1389px}}
  @media (min-width:2000px){main.ugx{zoom:1.4375}.ugx{--max:1183px}}
  @media (min-width:901px){.ugx .ug-tabs{padding-top:8px}}
  /* v7 */
  .ugx .bgal{position:relative;overflow:hidden;background:var(--maroon-deep);min-height:300px}
  .ugx .bgal__s{position:absolute;inset:0;opacity:0;transition:opacity .9s ease}
  .ugx .bgal__s.is-on{opacity:1}
  .ugx .bgal__s img{position:absolute;inset:0;width:100%;height:100%}
  .ugx .bgal__bg{object-fit:cover;filter:blur(22px) brightness(.55) saturate(1.1);transform:scale(1.15)}
  .ugx .bgal .bgal__fg{object-fit:contain;object-position:center}
  .ugx .bgal .bgal__bg{object-position:center}
  .ugx .bgal__dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:8px;z-index:2}
  .ugx .bgal__dots button{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:rgba(251,244,215,.5);cursor:pointer;transition:background .3s,width .3s}
  .ugx .bgal__dots button[aria-current="true"]{background:var(--cream);width:24px;border-radius:6px}
  .ugx .bgal__dots button::after{content:"";position:absolute;width:30px;height:30px;transform:translate(-50%,-50%);left:50%;top:50%}
  .ugx .bgal__dots button{position:relative}
  /* trek tags sit under the photo so they never cover faces */
  .ugx .tcard{aspect-ratio:auto;overflow:visible;background:none;border-radius:0}
  .ugx .tcard img{width:100%;height:auto;aspect-ratio:449/298;object-fit:cover;border-radius:var(--r-photo);display:block}
  .ugx .tcard figcaption{position:static;width:auto;min-width:0;height:auto;min-height:0;border-radius:999px;display:inline-flex;padding:8px 16px;margin-top:12px;font-size:16px;line-height:1.2}
  /* brown bags title */
  .ugx .bbt{display:flex;align-items:center;gap:14px}
  .ugx .bbt__bag{width:clamp(52px,5vw,72px);height:auto;overflow:visible;flex:none}
  .ugx .bbt__handle{fill:none;stroke:#b98a2a;stroke-width:3;stroke-linecap:round}
  .ugx .bbt__body{fill:var(--mustard)}.ugx .bbt__fold{fill:#b98a2a}.ugx .bbt__crease{stroke:rgba(30,2,2,.35);stroke-width:2;fill:none}
  .ugx .bbt__dot{fill:var(--green);stroke:var(--maroon-deep);stroke-width:3}
  .ugx .bbt__tick{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:30;stroke-dashoffset:0}
  .ugx .bbt__t{font-size:clamp(28px,3vw,42px);font-weight:700;letter-spacing:-.035em;color:var(--cream);position:relative;padding-bottom:6px}
  .ugx .bbt__t::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;border-radius:2px;background:var(--red);transform-origin:left;transform:scaleX(1)}
  .ugx .bbt.anim .bbt__bag{transform:translateY(-26px) rotate(-8deg);opacity:0}
  .ugx .bbt.anim .bbt__dot{transform:scale(0);transform-origin:54px 52px}
  .ugx .bbt.anim .bbt__tick{stroke-dashoffset:30}
  .ugx .bbt.anim .bbt__t::after{transform:scaleX(0)}
  .ugx .bbt.anim.on .bbt__bag{transform:none;opacity:1;transition:transform .7s cubic-bezier(.3,1.5,.5,1),opacity .3s}
  .ugx .bbt.anim.on .bbt__dot{transform:scale(1);transition:transform .45s cubic-bezier(.3,1.6,.5,1) .55s}
  .ugx .bbt.anim.on .bbt__tick{stroke-dashoffset:0;transition:stroke-dashoffset .4s ease 1s}
  .ugx .bbt.anim.on .bbt__t::after{transform:scaleX(1);transition:transform .7s ease .3s}
  .ugx .bbs__founders{padding-top:clamp(24px,3vw,36px)}
  /* India */
  .ugx #india .head .h-l{font-size:clamp(32px,4.4vw,64px);line-height:1.05}
  .ugx #india .head{margin-bottom:clamp(24px,3vw,40px)}
  .ugx .visits li{grid-template-columns:minmax(0,1fr) auto;column-gap:20px;align-items:center;padding-block:18px}
  .ugx .visits li > h3,.ugx .visits li > p{grid-column:1}
  .ugx .visits h3{font-size:clamp(26px,2.6vw,36px)}
  .ugx .visits p{font-size:clamp(17px,1.35vw,19.5px);line-height:1.5;max-width:44ch;color:var(--cream-72)}
  .ugx .visits__logo{grid-column:2;grid-row:1 / span 2;display:grid;place-items:center;width:clamp(96px,9vw,140px);height:clamp(56px,5vw,76px);padding:8px 12px;background:#fff;border-radius:16px}
  .ugx .visits__logo{overflow:hidden}
  .ugx .visits__logo img{width:100%;height:100%;object-fit:contain}
  .ugx .visits__logo--icon{background:none;padding:0;width:auto;aspect-ratio:1}
  .ugx .visits__logo--icon img{border-radius:16px;width:100%;height:100%}
  .ugx .visits li::before{top:34px}
  @media (prefers-reduced-motion:reduce){.ugx .bgal__s{transition:none}.ugx .bbt.anim .bbt__bag,.ugx .bbt.anim .bbt__dot,.ugx .bbt.anim .bbt__tick,.ugx .bbt.anim .bbt__t::after{transition:none!important}}
  @media (max-width:860px){.ugx .globs .dest{grid-column:1 / -1!important}}

  /* v8: scroll-interactive layer. Final states are the default; motion only when html.js and no reduced-motion */
  .ugx .scrollbar{position:fixed;left:0;top:0;right:0;height:3px;z-index:60;pointer-events:none}
  .ugx .scrollbar i{display:block;height:100%;width:100%;background:var(--red);transform-origin:0 50%;transform:scaleX(var(--pg,0))}
  /* story: cream pop band */
  .ugx .story-sec{padding-block:clamp(40px,5vw,72px)}
  .ugx .story-sec .feat{background:none;border-radius:0;overflow:visible;align-items:center;gap:clamp(24px,4vw,64px)}
  .ugx .story-sec .feat__txt{padding:0}
  .ugx .feat__kick{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--red)}
  .ugx .story-sec .feat__num{color:var(--ink)}
  .ugx .story-sec .feat__num .num{color:var(--red)}
  .ugx .story-sec .feat__h{color:var(--ink)}
  .ugx .story-sec .feat__h em{color:var(--red)}
  .ugx .story-sec .feat__p{color:var(--ink-70)}
  .ugx .story-sec .feat__ph{border-radius:var(--r-photo);overflow:hidden;min-height:0;aspect-ratio:4/4.6;box-shadow:0 30px 60px -28px rgba(60,8,16,.55);transform:rotate(calc((1 - var(--p,1)) * 3deg)) translateY(calc((1 - var(--p,1)) * 24px))}
  .ugx .story-sec .feat__ph img{transform:scale(calc(1.14 - var(--p,1) * .1))}
  /* brown bag ruler: 200 ticks that fill with scroll */
  .ugx .ruler{position:relative;height:30px;width:100%;max-width:640px;margin:-4px 0 6px}
  .ugx .ruler,.ugx .ruler i{background-image:linear-gradient(90deg,currentColor 0 45%,transparent 45%);background-size:.5% 100%}
  .ugx .ruler{color:rgba(250,240,225,.22);}
  .ugx .ruler i{position:absolute;inset:0;color:var(--red);clip-path:inset(0 calc((1 - min(1,var(--p,1) * 1.6)) * 100%) 0 0)}
  /* four campuses timeline */
  .ugx .unis{position:relative}
  .ugx .unis__line{position:absolute;left:4%;right:4%;top:-14px;height:2px;background:var(--rule);display:none}
  .ugx .unis__line::after{content:"";position:absolute;inset:0;background:var(--red);transform-origin:0 50%;transform:scaleX(var(--p,1))}
  @media (min-width:861px){.ugx .unis__line{display:block}}
  /* pop reveals */
  html.js.mo .ugx .pop{opacity:0;transform:translateY(22px) scale(.96);transition:opacity .55s ease,transform .6s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
  html.js.mo .ugx .pop.in{opacity:1;transform:none}
  /* phones: india photo stays pinned while the slideshow plays */
  @media (max-width:860px){
    .ugx #india .stage{order:-1;position:sticky;top:76px;z-index:5;margin-bottom:14px;aspect-ratio:16/10}
    .ugx .story-sec .feat__ph{aspect-ratio:4/3.6;order:-1}
  }
  /* brown bag number pop */
  .ugx #brown-bags .bb__num{font-size:clamp(88px,13vw,200px);color:var(--cream);line-height:.9}
  .ugx #brown-bags .bb__num small{color:var(--red)}
  @media (prefers-reduced-motion:reduce){.ugx .story-sec .feat__ph,.ugx .story-sec .feat__ph img{transform:none}.ugx .scrollbar{display:none}}

  /* v9 */
  .ugx .story-sec{padding-block:clamp(36px,4vw,60px)}
  .ugx .feat__who{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;padding-left:14px;border-left:4px solid var(--red)}
  .ugx .feat__who b{font-size:clamp(20px,1.7vw,26px);font-weight:700;letter-spacing:-.02em;color:var(--ink)}
  .ugx .feat__who span{font-size:clamp(15px,1.2vw,18px);font-weight:600;color:var(--red)}
  .ugx .feat__logos2{--h:clamp(34px,2.9vw,46px);--a:calc(var(--h)*.47);display:flex;align-items:flex-start;gap:clamp(16px,1.8vw,26px);margin:0 0 clamp(18px,1.8vw,26px)}
  .ugx .feat__logos2 img{display:block;width:auto;max-width:none}
  .ugx .feat__logos2 .lg-amz{height:var(--h)}
  /* centre Anthropic on the Amazon wordmark (top 68% of its box), not on the smile */
  .ugx .feat__logos2 .lg-ant{height:var(--a);margin-top:calc(var(--h)*.34 - var(--a)/2)}
  .ugx .feat__logos2 i{width:1px;height:calc(var(--h)*.68);background:var(--rule-ink,rgba(0,0,0,.22))}
  @media (max-width:420px){.ugx .feat__logos2{--h:34px;gap:14px}}
  .ugx .story-sec .feat__logos{mix-blend-mode:normal;border-radius:0;height:clamp(34px,3vw,46px)}
  @media (min-width:861px){
    .ugx .story-sec .feat{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,5vw,88px)}
    .ugx .story-sec .feat__txt{gap:clamp(14px,1.4vw,20px)}
    .ugx .story-sec .feat__num{font-size:clamp(88px,10vw,168px)}
    .ugx .story-sec .feat__h{font-size:clamp(28px,2.8vw,42px)}
    .ugx .story-sec .feat__p{font-size:clamp(17px,1.35vw,20px);max-width:56ch}
    .ugx .story-sec .feat__ph{aspect-ratio:1/1;max-height:640px;justify-self:end;width:100%}
  }
  /* campuses: photo panels, accordion on desktop */
  .ugx .unis-sec .unis{counter-reset:u}
  .ugx .unis-sec .unis .uni{counter-increment:u;position:relative;padding:0;border:0;border-radius:26px;overflow:hidden;background:var(--maroon-deep);isolation:isolate;cursor:pointer;outline-offset:3px}
  .ugx .unis-sec .unis .uni__ph{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;z-index:-2}
  .ugx .unis-sec .unis .uni__ph img{width:100%;height:100%;object-fit:cover}
  .ugx .unis-sec .unis .uni::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(40,0,6,.1) 30%,rgba(40,0,6,.88) 100%)}
  .ugx .unis-sec .unis .uni::before{content:"0" counter(u);position:absolute;top:14px;left:18px;font-size:clamp(34px,3.4vw,56px);font-weight:700;letter-spacing:-.05em;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(251,244,215,.85)}
  .ugx .unis-sec .unis .uni__yr{position:absolute;left:18px;right:18px;bottom:calc(clamp(16px,1.3vw,19px) * 2.6 + 22px);margin:0;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cream)}
  .ugx .unis-sec .unis .uni__nm{position:absolute;left:18px;right:18px;bottom:18px;margin:0;font-size:clamp(16px,1.3vw,19px);line-height:1.2}
  .ugx .unis-sec .unis .uni__nm span{display:block;font-weight:500;color:var(--cream-72);font-size:.82em;margin-top:2px}
  .ugx .unis-sec .unis .uni__yr{bottom:auto;top:calc(clamp(34px,3.4vw,56px) + 26px)}
  .ugx .unis__line{display:none!important}
  @media (min-width:861px){
    .ugx .unis-sec .unis{display:flex!important;gap:14px;height:clamp(360px,32vw,500px)}
    .ugx .unis-sec .unis .uni{flex:1 1 0;min-width:0;transition:flex-grow .6s cubic-bezier(.2,.8,.2,1)}
    .ugx .unis-sec .unis .uni.is-on{flex-grow:2.7}
    .ugx .unis-sec .unis .uni.is-on .uni__nm{font-size:clamp(20px,1.9vw,28px)}
    .ugx .unis-sec .unis .uni.is-on::before{background:none;-webkit-text-stroke-color:var(--red);}
    .ugx .unis-sec .unis .uni__ph img{transition:transform .8s ease}
    .ugx .unis-sec .unis .uni.is-on .uni__ph img{transform:scale(1.04)}
  }
  @media (max-width:860px){
    .ugx .unis-sec .unis .uni{aspect-ratio:3/3.6}
    .ugx .unis-sec .unis .uni__ph{aspect-ratio:auto!important}
  }
  /* hub map graphics */
  .ugx .globs .dest{position:relative}
  .ugx .globs .dest .coord{line-height:1.45;white-space:normal}
  .ugx .dest__map{position:absolute;right:20px;top:16px;height:var(--mh,90px);width:auto;max-width:48%;fill:none;stroke:#fbf4d7;stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round;opacity:.92;pointer-events:none}
  .ugx .dest__map path{vector-effect:non-scaling-stroke}
  .ugx .dest__map--sg{--mh:68px}.ugx .dest__map--ae{--mh:84px}.ugx .dest__map--kr{--mh:86px}.ugx .dest__map--cn{--mh:92px}
  /* brown bags title */
  .ugx .bbt__t{font-weight:700;letter-spacing:-.015em;font-size:clamp(34px,3.6vw,52px)}
  .ugx .visits__logo--icon{background:none!important}

  /* v12 refinements */
  /* next on the map */
  .ugx .next{margin-top:clamp(22px,2.4vw,32px);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
  .ugx .next__label{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mustard)}
  .ugx .next__label{padding-left:5px}
  .ugx .next__label::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 5px rgba(186,59,65,.28)}
  .ugx .next__list{display:flex;flex-wrap:wrap;gap:8px}
  .ugx .next__list li{font-size:clamp(16px,1.25vw,19px);font-weight:700;letter-spacing:-.015em;color:var(--maroon-deep);background:var(--cream);border-radius:999px;padding:8px 16px}
  .ugx .next__list li.next__more{background:none;color:var(--cream);font-weight:400;border:1px dashed rgba(251,244,215,.5)}
  /* apply */
  .ugx .apply-sec{padding-block:clamp(40px,5vw,72px)!important}
  .ugx .apply-wrap .btn{height:64px;min-width:300px;padding:0 14px 0 32px;font-size:17px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:var(--red);color:#fff;box-shadow:0 14px 28px -12px rgba(186,59,65,.75),0 0 0 1px rgba(60,8,16,.12)}
  .ugx .apply-wrap .btn svg{width:40px;height:40px;padding:10px;border-radius:50%;background:var(--cream);color:var(--maroon-deep);flex:none;transition:transform .25s ease}
  .ugx .apply-wrap .btn:hover{background:var(--maroon-deep)}
  .ugx .apply-wrap .btn:hover svg{transform:translateX(4px)}
  .ugx .apply-wrap .btn:focus-visible{outline:3px solid var(--maroon-deep);outline-offset:3px}
  /* brown bag group photo */
  .ugx .bb__photos{height:auto;grid-template-rows:clamp(150px,15vw,230px) clamp(150px,15vw,230px) auto}
  .ugx .bb__photos .ph--wide{grid-column:1 / -1;aspect-ratio:2.3/1}
  .ugx .bb__photos .ph--wide img{object-position:center 36%}
  @media (max-width:860px){.ugx .bb__photos{grid-template-rows:none}.ugx .bb__photos .ph--wide{grid-column:auto;aspect-ratio:4/3}.ugx .bb__photos .ph--wide img{object-position:center 30%}}
  /* warmer: cream surfaces and accents */
  .ugx .bcard__txt{background:var(--cream);color:var(--ink)}
  .ugx .bcard__txt .h-l,.ugx .bcard__txt .h-l em{color:var(--ink)}
  .ugx .bcard__txt .h-l em{color:var(--red)}
  .ugx .bcard__txt .lede,.ugx .bcard__stats p,.ugx .bcard__real{color:var(--ink-70)}
  .ugx .bcard__real b,.ugx .bcard__hq{color:var(--ink)}
  .ugx .bcard__stats .num{color:var(--red)}
  .ugx .bcard__stats li{border-top-color:var(--ink)}
  .ugx .unis-sec .unis .uni__yr{color:var(--mustard)}
  .ugx .globs .dest .coord{color:var(--mustard)}
  .ugx .bbs__founders{border-top-color:rgba(251,244,215,.22)}
  .ugx .visits{border-top-color:rgba(251,244,215,.28)}
  .ugx .visits li{border-bottom-color:rgba(251,244,215,.28)}
  .ugx .bbf__co{color:var(--mustard)}

  /* v13: headings use the full row on web (no half-empty header rows), wide screens use more of the width */
  .ugx #gallery .head,.ugx .unis-sec .head,.ugx #india .head{grid-template-columns:1fr}
  @media (min-width:861px){
    .ugx #gallery .head .h-l{white-space:nowrap}
    .ugx #india .head .h-l em{display:block}
  }
  @media (min-width:1900px){.ugx{--max:99999px;--gutter:6.5%}}

  /* v16 */
  /* Krish Goel: photo about 20% smaller, still the hero of the section */
  .ugx .story-sec .feat{grid-template-columns:minmax(0,1fr) minmax(0,.64fr);align-items:center}
  .ugx .story-sec .feat__ph{aspect-ratio:4/4.5}
  .ugx .story-sec .feat__txt{max-width:62ch}
  @media (max-width:860px){
    .ugx .story-sec .feat{grid-template-columns:1fr}
    .ugx .story-sec .feat__ph{aspect-ratio:4/3.1;order:-1}
  }
  /* Brown bags: even 2 x 2 photo grid, calm and neutral */
  .ugx #brown-bags .bb{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4.5vw,72px);align-items:center}
  .ugx #brown-bags .bb__photos{height:auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:auto;gap:clamp(8px,1vw,14px)}
  .ugx #brown-bags .bb__photos .ph,.ugx #brown-bags .bb__photos .ph:first-child,.ugx #brown-bags .bb__photos .ph--wide{grid-row:auto;grid-column:auto;aspect-ratio:4/3;border-radius:18px}
  .ugx #brown-bags .bb__photos .ph img{object-position:center 35%}
  @media (max-width:860px){
    .ugx #brown-bags .bb{grid-template-columns:1fr}
    .ugx #brown-bags .bb__photos{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;overflow-x:auto}
    .ugx #brown-bags .bb__photos .ph,.ugx #brown-bags .bb__photos .ph:first-child,.ugx #brown-bags .bb__photos .ph--wide{aspect-ratio:4/3}
  }
  .ugx .visits li{transition:opacity .4s ease}
  .ugx #india .visits li:not(.is-on){opacity:.6}
  .ugx #india .visits li:hover,.ugx #india .visits li:focus-visible{opacity:1}
  /* India slideshow progress */
  .ugx .stage__dots{position:absolute;left:16px;right:16px;bottom:14px;display:flex;gap:6px;z-index:2;pointer-events:none}
  .ugx .stage__dots i{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.35);overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
  .ugx .stage__dots b{display:block;height:100%;width:0;background:#fff;border-radius:4px}
  .ugx .stage__dots .is-done b{width:100%}
  .ugx .stage__dots .is-on b{width:100%;animation:stagefill var(--ms,4800ms) linear}
  .ugx .stage__dots.is-held .is-on b{animation-play-state:paused}
  @keyframes stagefill{from{width:0}to{width:100%}}
  @media (prefers-reduced-motion:reduce){.ugx .stage__dots .is-on b{animation:none}}

  /* v17: Krish Goel section more compact on web and phone */
  .ugx .story-sec{padding-block:clamp(22px,2.6vw,40px)}
  .ugx .story-sec .feat{grid-template-columns:minmax(0,1fr) minmax(0,.56fr);gap:clamp(20px,3vw,44px)}
  .ugx .story-sec .feat__ph{aspect-ratio:4/3.9}
  .ugx .story-sec .feat__txt{gap:10px;max-width:none}
  .ugx .story-sec .feat__logos2{--h:clamp(30px,2.4vw,40px);margin-bottom:clamp(6px,.8vw,12px)}
  .ugx .story-sec .feat__who b{font-size:clamp(18px,1.4vw,22px)}
  .ugx .story-sec .feat__who span{font-size:clamp(14px,1.05vw,16px)}
  .ugx .story-sec .feat__num{font-size:clamp(46px,5vw,76px)}
  .ugx .story-sec .feat__h{font-size:clamp(19px,1.8vw,26px)}
  .ugx .story-sec .feat__p{font-size:clamp(15px,1.1vw,16.5px);line-height:1.5}
  @media (max-width:860px){
    .ugx .story-sec{padding-block:20px 26px}
    .ugx .story-sec .feat{grid-template-columns:1fr;gap:18px}
    .ugx .story-sec .feat__ph{aspect-ratio:16/9;max-height:220px;border-radius:20px}
    .ugx .story-sec .feat__ph img{object-position:center 28%}
    .ugx .story-sec .feat__txt{gap:8px;padding:0}
    .ugx .story-sec .feat__logos2{--h:30px;gap:14px;margin-bottom:2px}
    .ugx .story-sec .feat__num{font-size:46px}
    .ugx .story-sec .feat__h{font-size:19px}
    .ugx .story-sec .feat__p{font-size:14.5px}
  }

  /* v17b: phone fix, no tilt, full-width banner photo, clear gap above logos */
  @media (max-width:860px){
    .ugx .story-sec{padding-block:10px 24px}
    .ugx .story-sec .feat{gap:20px}
    .ugx .story-sec .feat__ph{transform:none!important;width:100%;margin:0;aspect-ratio:16/10;max-height:230px;box-shadow:0 16px 32px -20px rgba(60,8,16,.5)}
    .ugx .story-sec .feat__ph img{transform:none!important;object-position:center 30%}
    .ugx .story-sec .feat__txt{gap:10px}
    .ugx .story-sec .feat__logos2{margin-top:2px}
  }

  /* v18: founders strip, smaller photos, name leads, company second */
  .ugx .bbf{width:156px}
  .ugx .bbf-track{gap:22px}
  .ugx .bbf__ph{border-radius:18px}
  .ugx .bbs .bbf__name{margin-top:12px;padding-bottom:0;border-bottom:0;font-size:20px;line-height:1.15;font-weight:400;color:#fff}
  .ugx .bbs .bbf__name b{font-weight:800;display:block;font-size:22px;letter-spacing:-.01em}
  .ugx .bbs .bbf__co{margin-top:7px;font-size:15px;font-weight:700;color:var(--mustard)}
  .ugx .bbf__role{margin-top:3px;font-size:13px;line-height:1.35;font-weight:500;color:var(--cream-72)}
  @media (max-width:600px){.ugx .bbf{width:132px}.ugx .bbs .bbf__name{font-size:17px}.ugx .bbs .bbf__name b{font-size:19px}.ugx .bbs .bbf__co{font-size:14px}.ugx .bbf__role{font-size:12px}}

  /* v19: optional note, phone floors, shorter Global and India on phone, tap targets */
  .ugx .fine{margin-top:14px;max-width:62ch;font-size:14px;line-height:1.5;color:var(--cream-72)}
  .ugx .bbf__role{font-size:13px}
  .ugx .visits li:not(.is-on){opacity:.72}
  .ugx .stage__dots button,.ugx .bgal__dots button{position:relative}
  .ugx .stage__dots button::after,.ugx .bgal__dots button::after{content:"";position:absolute;inset:-18px -4px}
  @media (max-width:860px){
    .ugx .visits li:not(.is-on) p{display:none}
    .ugx .visits li{padding-block:16px}
    .ugx .stage{aspect-ratio:16/10}
    .ugx .globs{display:flex!important;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);padding-bottom:6px;scrollbar-width:none}
    .ugx .globs::-webkit-scrollbar{display:none}
    .ugx .globs .dest{flex:0 0 78%;scroll-snap-align:start;grid-column:auto!important;min-height:0}
    .ugx .glob-sec .head{margin-bottom:14px}
  }

  /* v21: compact */
  .ugx{--sec:clamp(44px,4.2vw,64px)}
  .ugx .sec.glow{padding-top:clamp(36px,4vw,56px)!important}
  .ugx #berkeley{padding-top:clamp(28px,3vw,44px)!important}
  .ugx .bbs{padding-block:clamp(32px,3.6vw,52px)!important}
  .ugx #brown-bags .bb__num{font-size:clamp(72px,8vw,120px)}
  .ugx .bb__photos{height:clamp(280px,29vw,390px)}
  .ugx .bbs__founders{margin-top:clamp(20px,2.4vw,32px);padding-top:clamp(18px,2.2vw,28px)}
  @media (min-width:861px){
    .ugx .stage{aspect-ratio:16/10}
    .ugx .visits li{padding-block:16px}
    .ugx #india .head,.ugx .unis-sec .head{margin-bottom:18px}
  }
  @media (max-width:700px){
    .ugx .sec,.ugx .sec--deep{padding-block:44px}
  }

  /* v21b */
  @media (min-width:861px){
    .ugx .sec.glow figure.ph{aspect-ratio:3.2/1!important}
    .ugx .bb__photos{height:clamp(230px,23vw,310px)}
    .ugx #brown-bags .bb__num{font-size:clamp(64px,6.6vw,96px)}
    .ugx #brown-bags .bb__copy .h-l{font-size:clamp(24px,2.4vw,34px)}
    .ugx .stage{aspect-ratio:16/9}
    .ugx .visits li{padding-block:12px}
    .ugx .visits p{font-size:15px}
    .ugx .visits h3{font-size:clamp(20px,1.9vw,26px)}
  }
  @media (max-width:860px){
    .ugx .sec.glow figure.ph{aspect-ratio:16/9!important}
  }

  /* v21c */
  @media (min-width:861px){
    .ugx #brown-bags .bb__photos{grid-template-rows:clamp(110px,11vw,155px) clamp(110px,11vw,155px)!important;height:auto!important;gap:12px}
    .ugx .bbf{width:132px}
    .ugx .bbf-track{gap:18px}
    .ugx .bbs .bbf__name{font-size:17px;margin-top:8px}
    .ugx .bbs .bbf__name b{font-size:19px}
    .ugx .bbs .bbf__co{font-size:13.5px;margin-top:4px}
    .ugx .bbf__role{font-size:12.5px}
  }

  /* v21d phone */
  @media (max-width:700px){
    .ugx .sec,.ugx .sec--deep{padding-block:36px}
    .ugx .sec.glow{padding-top:28px!important}
    .ugx #berkeley .ph,.ugx #berkeley figure{max-height:200px}
    .ugx .bb__photos .ph{aspect-ratio:16/10}
    .ugx #brown-bags .bb__num{font-size:72px}
    .ugx .stage{aspect-ratio:16/9}
    .ugx .next{margin-top:18px}
    .ugx .bbf{width:120px}
  }

  /* v21e phone */
  @media (max-width:700px){
    .ugx #berkeley .bcard__ph{aspect-ratio:16/9!important;max-height:200px;min-height:0!important}
    .ugx #berkeley .bstats,.ugx #berkeley .bcard__txt{gap:12px}
    .ugx #brown-bags .bb__num{font-size:60px!important}
    .ugx #brown-bags .bb__photos{grid-auto-columns:62%!important}
    .ugx #brown-bags .bb__photos .ph{aspect-ratio:16/11!important}
    .ugx #brown-bags .bb__copy{gap:8px}
  }

  @media (min-width:861px){
    .ugx #brown-bags .bb__photos{gap:12px!important;grid-template-rows:repeat(2,clamp(120px,11vw,150px))!important;grid-template-columns:1fr 1fr!important;align-content:center}
    .ugx #brown-bags .bb__photos .ph,.ugx #brown-bags .bb__photos .ph--wide{grid-row:auto!important;grid-column:auto!important;aspect-ratio:auto!important;height:100%;min-height:0}
  }
