/* About: full-width composition, with project imagery supporting each discipline. */
#about.about-studio{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:100svh;padding:clamp(60px,10svh,108px) var(--hero-gutter,5vw);
  border-top:1px solid rgba(255,255,255,.08);color:#c4c4cd;
  background:radial-gradient(ellipse at 79% 40%,rgba(111,121,255,.075),transparent 48%),radial-gradient(ellipse at 6% 0%,rgba(255,255,255,.055),transparent 48%),linear-gradient(126deg,#050505 12%,#0b0b0f 58%,#030304 100%);
}
#about.about-studio::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:105vw;height:67vw;left:32%;top:4%;border-radius:50%;
  border:1px solid rgba(185,191,223,.12);transform:rotate(-36deg);
  background:linear-gradient(165deg,rgba(160,166,198,.045),transparent 34%,rgba(0,0,0,.7) 82%);
  box-shadow:inset 0 42px 95px rgba(171,178,229,.035),inset 0 -80px 160px #000,0 50px 120px #0009;
}
#about.about-studio::after{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:110vw;height:44vw;left:-44%;bottom:-37%;border-radius:50%;
  border:1px solid rgba(187,193,222,.1);transform:rotate(-22deg);
  box-shadow:0 -22px 90px rgba(178,185,225,.045),inset 0 40px 90px #0009;
  background:linear-gradient(180deg,#15151c90,#030304 65%);
}
#about .studio-layout{
  display:grid;grid-template-columns:minmax(0,1.07fr) minmax(0,1fr);
  align-items:stretch;align-content:center;width:100%;
  column-gap:clamp(40px,5vw,96px);row-gap:clamp(32px,5svh,54px);
  min-height:calc(100svh - clamp(120px,20svh,216px));
}
#about .studio-biography,#about .studio-practice{min-width:0}
#about.about-studio .about-identity{
  position:relative;width:100%;max-width:100%;height:auto;margin:0 0 32px;
  font-family:"Unbounded",sans-serif;font-size:clamp(36px,3.45vw,64px);
  font-weight:500;line-height:1.16;letter-spacing:0;color:#f2f2f0;
}
#about.about-studio .about-identity span{font:inherit;letter-spacing:inherit;color:var(--accent)}
#about .studio-lead,#about .studio-notes{max-width:50ch;font:400 clamp(16px,1.15vw,20px)/1.7 "Manrope",sans-serif;letter-spacing:0;color:#b9b9c3}
#about .studio-lead{margin:0}
#about .studio-notes{margin-top:20px;padding:0;border:0}
#about .studio-notes p{margin:0}
#about .studio-notes p+p{margin-top:20px}
#about .studio-highlight{font:inherit;letter-spacing:inherit;text-transform:inherit;text-decoration:inherit;color:var(--accent)}
/* Stretch both columns in the same grid row; biography sets their shared height. */
#about .studio-practice{padding:0;display:flex}
#about.about-studio #expertise{display:flex;width:100%!important;margin:0!important;padding:0!important;background:transparent!important;color:inherit!important}
#about .studio-service-list{flex:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:.9fr 1fr;gap:clamp(14px,1vw,20px)}
#about .studio-service{
  position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;min-width:0;min-height:0;
  padding:clamp(20px,1.6vw,30px);border:1px solid rgba(180,185,216,.24);border-radius:18px;background:#121019;
  box-shadow:inset 0 1px 0 #ffffff12,0 22px 44px #0005;
  transition:border-color .25s,box-shadow .25s;
}
#about .studio-service:first-child{grid-column:1/-1}
#about .studio-service-image{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%;filter:grayscale(1) sepia(1) hue-rotate(205deg) saturate(1.45) brightness(.95);pointer-events:none}
#about .studio-service:first-child .studio-service-image{object-position:50% 58%}
#about .studio-service:nth-child(3) .studio-service-image{object-position:50% 48%}
#about .studio-service::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(14,10,30,.08) 0%,rgba(10,8,21,.28) 28%,rgba(7,6,16,.87) 65%,#070610 100%)}
#about .studio-service:hover{border-color:rgba(162,170,255,.5);box-shadow:inset 0 1px 0 #ffffff20,0 22px 55px #0007}
#about .studio-service-copy{position:relative;z-index:1;min-width:0;padding-top:74px}
#about .studio-service:first-child .studio-service-copy{max-width:80%;padding-top:54px}
#about .studio-service h3{margin:0 0 10px;font:500 clamp(17px,1.3vw,25px)/1.35 "Manrope",sans-serif;letter-spacing:-.015em;color:#f6f4ff;text-shadow:0 2px 12px #000}
#about .studio-service:first-child h3{font-size:clamp(20px,1.55vw,28px)}
#about .studio-service p{margin:0;font:400 clamp(13px,.9vw,17px)/1.65 "Manrope",sans-serif;color:#d2cedf;text-shadow:0 1px 8px #000}
#about .studio-toolkit{grid-column:1/-1;padding-top:28px;border-top:1px solid rgba(183,188,215,.17)}
#about .studio-tool-list{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:26px clamp(28px,3.4vw,64px);margin:0;padding:0;list-style:none}
#about .studio-tool-list li{display:flex;align-items:center;gap:12px;color:#b9bac6;font:400 clamp(10px,.63vw,12px)/1.5 "IBM Plex Mono",monospace;letter-spacing:.025em;white-space:nowrap}
#about .studio-tool-icon{display:block;flex:0 0 28px;width:28px;height:28px;object-fit:contain}
#about .studio-tool-monogram{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border:1px solid #777782;border-radius:5px;font:500 11px/1 "Manrope",sans-serif;letter-spacing:-.035em}
@media(min-width:981px) and (max-height:760px){
  #about.about-studio{padding-top:60px;padding-bottom:60px}
  #about .studio-layout{min-height:calc(100svh - 120px);row-gap:32px}
  #about.about-studio .about-identity{margin-bottom:26px}
  #about .studio-lead,#about .studio-notes{font-size:16px;line-height:1.65}
  #about .studio-notes,#about .studio-notes p+p{margin-top:17px}
  #about .studio-service-copy{padding-top:48px}
  #about .studio-service:first-child .studio-service-copy{padding-top:40px}
}
@media(max-width:1100px) and (min-width:981px){#about .studio-layout{column-gap:40px;grid-template-columns:1fr 1fr}}
@media(max-width:980px){
  #about.about-studio{padding:76px 6vw}
  #about .studio-layout{grid-template-columns:1fr;gap:42px;min-height:0}
  #about .studio-biography{max-width:680px}
  #about.about-studio .about-identity{font-size:clamp(36px,5.6vw,54px)}
  #about .studio-lead,#about .studio-notes{font-size:17px}
  #about .studio-service-list{grid-template-rows:auto auto;gap:14px}
  #about .studio-service{min-height:240px}
  #about .studio-service:first-child{min-height:230px}
  #about .studio-service h3{font-size:20px}
  #about .studio-service p{font-size:14px}
  #about .studio-tool-list{gap:24px 30px}
}
@media(max-width:600px){
  #about.about-studio{padding:60px 6vw}
  #about.about-studio::before{width:170vw;height:130vw;left:15%;top:28%}
  #about .studio-layout{gap:34px}
  #about.about-studio .about-identity{font-size:clamp(26px,6.9vw,40px);margin-bottom:30px}
  #about .studio-lead,#about .studio-notes{font-size:15px;line-height:1.75}
  #about .studio-service-list{grid-template-columns:1fr;gap:12px}
  #about .studio-service,#about .studio-service:first-child{grid-column:1;min-height:240px;padding:22px}
  #about .studio-service-copy,#about .studio-service:first-child .studio-service-copy{padding-top:74px;max-width:100%}
  #about .studio-service h3,#about .studio-service:first-child h3{font-size:20px}
  #about .studio-toolkit{padding-top:24px}
  #about .studio-tool-list{gap:22px 24px}
  #about .studio-tool-list li{font-size:10px;gap:8px}
}
@media(prefers-reduced-motion:reduce){#about .studio-service{transition:none}}