/* About page — Design 1 content in the current (Design 2) style. */

/* photo placeholders */
.ph-photo{position:relative;display:grid;place-content:center;justify-items:center;gap:8px;min-height:200px;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--tint),#FFF4D6);border:1px dashed #CFC6FF;color:var(--purple-ink);text-align:center;padding:16px}
.ph-photo svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;opacity:.7}
.ph-photo span{font:700 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.ph-photo.tall{min-height:260px}.ph-photo.wide{min-height:320px}

/* who we are */
#who-we-are .prose h2{font-size:clamp(26px,3.2vw,36px)}
.pull{font-weight:700;font-size:18px;color:var(--ink);border-left:3px solid var(--gold);padding-left:14px}
.who-side{display:grid;gap:18px;align-self:start}

/* why choose GETDO: points pop in, bulb brightens */
.why-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:center}
.bulb-wrap{display:grid;justify-items:center;gap:10px;--g:0}
.bulb-svg{width:min(260px,70%);height:auto;overflow:visible}
.bulb-glow{opacity:var(--g);transform-origin:100px 95px;transform:scale(calc(.6 + var(--g) * .5));transition:opacity .5s,transform .5s}
.bulb-rays{opacity:var(--g);transition:opacity .5s}
.bulb-glass{fill:#E8EAF2;stroke:#C9CDDA;stroke-width:4;transition:fill .5s,stroke .5s}
.bulb-fil{stroke:#9AA0B4;transition:stroke .5s}
.bulb-wrap.lit-1 .bulb-glass{fill:#FFF6D6}.bulb-wrap.lit-2 .bulb-glass{fill:#FFEFA8}.bulb-wrap.lit-3 .bulb-glass{fill:#FFE27A}.bulb-wrap.lit-4 .bulb-glass{fill:#FFD84D;stroke:#F5B400}
.bulb-wrap.lit-1 .bulb-fil,.bulb-wrap.lit-2 .bulb-fil,.bulb-wrap.lit-3 .bulb-fil,.bulb-wrap.lit-4 .bulb-fil{stroke:#E58A00}
.bulb-cap{font:700 12px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.why-list{list-style:none;display:grid;gap:12px;margin-top:22px}
.why-list li{display:flex;gap:16px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 20px;transition:opacity .45s,transform .45s cubic-bezier(.3,1.5,.5,1),border-color .3s,box-shadow .3s}
.why-list li.on{border-color:var(--purple);box-shadow:var(--shadow)}
.why-n{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--purple-ink);font:700 13px var(--f-mono);transition:background .3s,color .3s}
.why-list li.on .why-n{background:var(--gold);color:var(--ink)}
.why-list h3{font-size:18px}.why-list p{color:var(--ink-2);font-size:15px;margin-top:4px}
.js-motion .why-list li:not(.on){opacity:.25;transform:translateX(24px) scale(.97)}
@media(max-width:900px){.why-grid{grid-template-columns:1fr;gap:28px}.bulb-svg{width:180px}}
@media(prefers-reduced-motion:reduce){.why-list li,.bulb-glow,.bulb-glass{transition:none}}

/* Native scrolling holds this panel until the complete strategy has appeared. */
#why.why-scroll{height:calc(100vh - var(--why-top,73px) - var(--why-bottom,0px));height:calc(100svh - var(--why-top,73px) - var(--why-bottom,0px));padding-block:clamp(20px,4vh,40px);overflow:hidden}
.why-scroll .why-grid{height:100%;min-height:0}
.why-scroll .why-copy{min-width:0}
.why-scroll .why-heading h2{font-size:clamp(28px,3vw,40px);line-height:1.15}
#why.why-scroll .why-list li{opacity:calc(.14 + var(--reveal,0) * .86);transform:translateX(calc((1 - var(--reveal,0)) * 20px));transition:border-color .2s,box-shadow .2s}
.why-scroll .bulb-glow,.why-scroll .bulb-rays,.why-scroll .bulb-glass,.why-scroll .bulb-fil{transition:none}
.why-scroll .bulb-glass,.why-static .bulb-glass{fill:color-mix(in srgb,#FFD84D calc(var(--g) * 100%),#E8EAF2);stroke:color-mix(in srgb,#F5B400 calc(var(--g) * 100%),#C9CDDA)}
.why-scroll .bulb-fil,.why-static .bulb-fil{stroke:color-mix(in srgb,#E58A00 calc(var(--g) * 100%),#9AA0B4)}
@media(max-width:900px){
 .why-scroll .why-grid{grid-template-columns:minmax(80px,.28fr) minmax(0,1fr);grid-template-rows:auto auto;gap:20px 18px;align-content:center}
 .why-scroll .why-copy{display:contents}
 .why-scroll .bulb-wrap{grid-column:1;grid-row:1;gap:0}
 .why-scroll .bulb-svg{width:110px;max-width:100%}
 .why-scroll .bulb-cap{font-size:8px;letter-spacing:.06em;text-align:center}
 .why-scroll .why-heading{grid-column:2;grid-row:1}
 .why-scroll .why-heading .eyebrow{font-size:10px;margin-bottom:8px}
 .why-scroll .why-heading h2{font-size:clamp(23px,4vw,32px)}
 .why-scroll .why-list{grid-column:1/-1;grid-row:2;margin-top:0;gap:10px}
 .why-scroll .why-list li{padding:12px 14px;gap:12px}
 .why-scroll .why-list h3{font-size:16px}
 .why-scroll .why-list p{font-size:13px;line-height:1.5}
 .why-scroll .why-n{width:32px;height:32px;font-size:11px}
}
#why.why-compact{padding-block:12px}
.why-compact .why-grid{gap:12px 20px}
.why-compact .bulb-svg{width:84px}
.why-compact .bulb-cap{display:none}
.why-compact .why-heading h2{font-size:23px}
.why-compact .why-heading .eyebrow{font-size:9px;margin-bottom:5px}
.why-compact .why-list{gap:7px;margin-top:14px}
.why-compact .why-list li{padding:9px 12px;gap:10px;border-radius:12px}
.why-compact .why-list h3{font-size:15px;line-height:1.4}
.why-compact .why-list p{font-size:13px;line-height:1.45}
.why-compact .why-list li:not(.is-current) p{height:0;overflow:hidden;margin:0;opacity:0}
.why-compact .why-n{width:27px;height:27px;font-size:10px}
.why-compact .why-list li>div{align-self:center;min-width:0}
.why-landscape .why-grid{grid-template-columns:minmax(0,.65fr) minmax(0,1.65fr);grid-template-rows:1fr;gap:28px}
.why-landscape .bulb-wrap{grid-column:1;grid-row:1}
.why-landscape .bulb-svg{width:160px}
.why-landscape .why-copy{display:block;grid-column:2;grid-row:1}
.why-landscape .why-heading h2{font-size:22px}
.why-landscape .why-list{gap:5px;margin-top:10px}
.why-landscape .why-list li{padding:6px 10px}
.why-landscape .why-list p{font-size:12px;line-height:1.4}
.why-landscape .why-n{width:24px;height:24px}
@media(min-width:901px){.why-compact .bulb-svg{width:220px}.why-compact:not(.why-landscape) .why-list li:not(.is-current) p{height:auto;overflow:visible;margin-top:4px;opacity:1}}
@media(min-width:761px) and (max-width:1280px){.why-scroll .why-grid{padding-right:104px}}

/* founders */
.founders{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.founder{display:grid;grid-template-columns:180px 1fr;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}
.founder .ph-photo.portrait{border-radius:0;border:0;border-right:1px dashed #CFC6FF;min-height:100%}
.founder .fb{padding:24px}
.founder h3{font-size:22px;margin-top:6px}
.tl{list-style:none;display:grid;gap:10px;margin-top:16px;border-left:2px solid var(--tint);padding-left:16px}
.tl li{position:relative;font-size:14.5px;color:var(--ink-2);display:grid;grid-template-columns:62px 1fr;gap:8px}
.tl li::before{content:"";position:absolute;left:-22px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--purple);box-shadow:0 0 0 3px var(--surface)}
.tl b{font-family:var(--f-mono);color:var(--purple-ink);font-size:13px}
.fl{margin-top:16px;font-size:14.5px}
@media(max-width:1000px){.founders{grid-template-columns:1fr}}
@media(max-width:560px){.founder{grid-template-columns:1fr}.founder .ph-photo.portrait{min-height:200px;border-right:0;border-bottom:1px dashed #CFC6FF}}

/* departments */
.depts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.dept{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transition:transform .25s,border-color .25s}
.dept:hover{transform:translateY(-4px);border-color:var(--purple)}
.dept .ph-photo{border-radius:0;border:0;aspect-ratio:4/3;min-height:0}
.dept .db{padding:18px 20px}.dept h3{font-size:18px}.dept p{color:var(--ink-2);font-size:15px;margin-top:4px}
@media(max-width:800px){.depts{grid-template-columns:1fr}}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:170px;gap:14px;grid-template-areas:"a a b c" "a a d c" "e f f c"}
.gal figure{margin:0;position:relative;border-radius:var(--radius-lg);overflow:hidden}
.gal .ph-photo{height:100%;min-height:0;border-radius:inherit}
.gal figcaption{position:absolute;left:12px;bottom:12px;background:rgba(21,24,38,.82);color:#fff;font-weight:700;font-size:13px;border-radius:999px;padding:5px 12px}
.gal .g1{grid-area:a}.gal .g2{grid-area:b}.gal .g3{grid-area:c}.gal .g4{grid-area:d}.gal .g5{grid-area:e}.gal .g6{grid-area:f}
.gal figure:hover .ph-photo{background:linear-gradient(135deg,#E6E0FF,#FFE9A8)}
@media(max-width:760px){.gal{grid-template-columns:1fr 1fr;grid-auto-rows:140px;grid-template-areas:"a a" "b c" "d d" "e f"}}

/* awards */
.award-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
@media(max-width:900px){.award-row{grid-template-columns:1fr;gap:28px}}

/* mock-up photos */
.mock-photo{position:relative;margin:0;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:var(--tint)}
.mock-photo img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:3/2}
.mock-photo.tall img{aspect-ratio:16/10}.mock-photo.wide img{aspect-ratio:3/2}.mock-photo.dept{border:0;border-radius:0}.mock-photo.dept img{aspect-ratio:4/3}
.mock-photo .who-flag,.f-photo .who-flag{position:absolute;left:10px;top:10px;font:700 10px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.9);color:var(--ink-2);border-radius:5px;padding:3px 7px}
.gal-img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.gal figure:hover .gal-img{transform:scale(1.05)}

/* big highlighted tagline */
.tagline-xl{margin-top:22px;font:800 clamp(30px,4vw,48px)/1.1 var(--f-sans);letter-spacing:-.02em;color:var(--ink)}
.tagline-xl span{display:block}
.tagline-xl .hl{color:var(--purple-ink);background:linear-gradient(transparent 60%,rgba(245,180,0,.55) 60%);display:inline;padding:0 .08em}

/* founders: photo on top, journey below */
.founders .founder{grid-template-columns:1fr;display:flex;flex-direction:column}
.f-photo{position:relative;margin:0;aspect-ratio:3/2;overflow:hidden;background:var(--tint)}
.f-photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.founders .founder .fb{padding:26px 28px 30px}

/* essence titles only */
.nots li{align-items:center}
.nots strong{font-size:18px}
#who-we-are .ww-text p+p{margin-top:12px}
