
.portfolio-hero{background:var(--racai-obsidian);color:#fff;padding:clamp(80px,10vw,148px) 0 60px}
.portfolio-hero .section-rail{color:#ddd}.portfolio-hero-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:5vw;align-items:end;margin:70px 0 110px}
.portfolio-hero h1{font-size:clamp(68px,9.5vw,162px);line-height:.94;letter-spacing:-.075em;font-weight:400}
.portfolio-hero-grid>div p{font-size:clamp(16px,1.6vw,22px);line-height:1.6;max-width:400px;margin-bottom:42px;color:#d7d6d2}
.portfolio-hero-grid .text-link{display:inline-flex;gap:18px;align-items:center}
.portfolio-hero-baseline{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;border-top:1px solid #555;padding-top:20px;color:#b5b5b5;font-size:11px;letter-spacing:.16em}
.portfolio-intro{padding:clamp(80px,10vw,148px) 0;background:var(--racai-off-white);color:#0b0b0c}
.portfolio-intro h2{font-weight:400;letter-spacing:-.06em;font-size:clamp(43px,6.1vw,88px);line-height:1.05;margin:50px 0}
.portfolio-directory{border-top:1px solid #555}.portfolio-directory a{display:grid;grid-template-columns:150px 1fr 30px;gap:24px;align-items:center;min-height:84px;border-bottom:1px solid #b8b6b2;padding:20px 6px;transition:padding .24s ease}
.portfolio-directory a:hover{padding-left:16px;background:#e9e7e2}.portfolio-directory a span{font-size:12px;letter-spacing:.07em;color:#696e75}
.portfolio-directory a strong{font-size:clamp(17px,2vw,28px);font-weight:400;letter-spacing:-.035em}.portfolio-directory a svg{width:20px}
.portfolio-intro-note{font-size:13px;max-width:740px;color:#646a70;line-height:1.65;margin-top:30px}
.portfolio-case{padding:clamp(82px,10vw,148px) 0;border-top:1px solid #c3c0bb}
.portfolio-case-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(42px,6vw,110px)}
.portfolio-case h2{font-weight:500;font-size:clamp(48px,5vw,76px);letter-spacing:-.065em;line-height:1.06;margin:20px 0 14px}
.portfolio-case-copy{max-width:540px}.portfolio-case-copy .portfolio-sub{font-size:21px;line-height:1.3;margin-bottom:42px}
.portfolio-meta{display:grid;grid-template-columns:1fr 1fr;gap:30px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;padding:22px 0;margin:0 0 42px}
.portfolio-meta div{min-width:0}.portfolio-meta dt{font-size:10px;letter-spacing:.13em;text-transform:uppercase;opacity:.6}.portfolio-meta dd{font-size:12px;line-height:1.55;margin:10px 0 0}
.portfolio-case h3{font-size:12px;text-transform:uppercase;letter-spacing:.14em;font-weight:600;margin:26px 0 12px}
.portfolio-case-copy>p:not(.eyebrow):not(.portfolio-sub){font-size:15px;line-height:1.8;opacity:.8}
.portfolio-case-copy .portfolio-disclaimer{font-size:12px!important;border-left:2px solid currentColor;padding-left:13px;opacity:.7!important;margin-top:36px}
.portfolio-visual{min-height:550px;aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(22px,3vw,46px);overflow:hidden}
.portfolio-visual-top,.portfolio-visual-bottom{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.portfolio-visual-bottom{border-top:1px solid currentColor;padding-top:20px;line-height:1.45}
.portfolio-large-mark{font-size:clamp(38px,5.5vw,100px);letter-spacing:-.065em;font-weight:500;line-height:1.04;overflow-wrap:anywhere}
.portfolio-biomatica{background:#F1F3EE;color:#0B1F17}.portfolio-biomatica .portfolio-visual{background:#0B1F17;color:#F1F3EE}
.portfolio-gaigentics{background:#FBF7EF;color:#241F18}.portfolio-gaigentics .portfolio-visual{background:#E7DCC8;color:#241F18}
.portfolio-thesis-lab{background:#ECEEE8;color:#15171C}.portfolio-thesis-lab .portfolio-visual{background:#15171C;color:#ECEEE8}
.portfolio-outro{background:#0B0B0C;color:#fff;padding:120px 0 100px}
.portfolio-outro h2{font-size:clamp(56px,8vw,124px);line-height:.98;font-weight:400;letter-spacing:-.07em;margin:30px 0}
.portfolio-outro>div>p:not(.eyebrow){font-size:17px;line-height:1.65;max-width:600px;color:#d7d6d2}
.portfolio-cta{display:flex;align-items:center;gap:30px;flex-wrap:wrap;margin-top:40px}
.portfolio-handoff{font-size:12px!important;color:#aaa!important;margin-top:24px}
@media(max-width:800px){.portfolio-hero-grid,.portfolio-case-grid{grid-template-columns:1fr}.portfolio-hero-grid{gap:44px;margin:48px 0 70px}.portfolio-hero h1{font-size:clamp(62px,15vw,112px)}.portfolio-case-grid{gap:34px}.portfolio-case-copy{max-width:unset}.portfolio-visual{aspect-ratio:4/3;min-height:350px}.portfolio-case .eyebrow{font-size:11px}}
@media(max-width:540px){.portfolio-hero{padding:70px 0 48px}.portfolio-hero-baseline{grid-template-columns:1fr 1fr;gap:15px}.portfolio-directory a{grid-template-columns:1fr 26px;gap:8px}.portfolio-directory a span{grid-column:1/-1}.portfolio-directory a strong{font-size:19px}.portfolio-case{padding:70px 0}.portfolio-meta{gap:18px}.portfolio-case h2{font-size:48px}.portfolio-visual{min-height:330px}.portfolio-large-mark{font-size:clamp(40px,11vw,65px)}.portfolio-outro{padding:86px 0}.portfolio-cta{align-items:flex-start;flex-direction:column}.portfolio-hero h1{font-size:clamp(56px,14vw,90px)}}
@media(prefers-reduced-motion:reduce){.portfolio-directory a{transition:none}}

/* First-party selected art from the actual uploaded brand artifacts. Concept outputs, never fabricated client logos. */
.portfolio-visual-art{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1;gap:22px;padding:25px 5px;text-align:center;min-width:0}
.brand-symbol{object-fit:contain;max-width:min(48%,220px);height:auto;aspect-ratio:1/1;display:block}
.brand-bio{max-width:min(38%,170px)}
.brand-word{font-weight:600;letter-spacing:-.055em;line-height:1.15;font-size:clamp(30px,3.2vw,60px);max-width:100%;overflow-wrap:anywhere}
.brand-bio-word{font-size:clamp(28px,3.2vw,48px);letter-spacing:.15em}.brand-tag{font-size:10px;letter-spacing:.15em;opacity:.65;font-weight:500;line-height:1.7}
.gai-lockup{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}
.gai-mark{width:65px;height:65px;border-radius:17px;background:#241F18;display:grid;place-items:center;flex-shrink:0}
.gai-mark i{display:block;background:#CE6646;width:24px;height:24px;transform:rotate(45deg);border-radius:4px}
.brand-gai-word{font-size:clamp(32px,3.3vw,55px);letter-spacing:-.035em}.brand-gai-word span{color:#CE6646}
.thesis-lockup{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.thesis-mark{width:78px;height:78px;border-radius:17px;background:#2C44D0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.thesis-mark i{height:6px;background:#ECEEE8;border-radius:9px;display:block}
.thesis-mark i:nth-child(1){width:47px}.thesis-mark i:nth-child(2){width:36px}.thesis-mark i:nth-child(3){width:26px}.thesis-mark i:nth-child(4){width:17px}
.brand-thesis-word{font-family:Georgia,serif;font-size:clamp(31px,3.2vw,53px);letter-spacing:-.02em}
.brand-thesis-word span{color:#8596fe}
@media(max-width:580px){.portfolio-visual-art{gap:15px}.brand-symbol{max-width:120px}.brand-bio-word{font-size:29px}.brand-tag{font-size:9px}.gai-mark{width:48px;height:48px}.gai-mark i{width:19px;height:19px}.thesis-mark{width:55px;height:55px}.thesis-mark i{max-width:70%}.brand-thesis-word{font-size:29px}}

/* Keep approved specimens within narrow viewports; min-height must not grow aspect-ratio width. */
@media(max-width:800px){.portfolio-case-grid>*{min-width:0}.portfolio-visual{aspect-ratio:auto;width:100%;box-sizing:border-box}}
