/* Let content determine height and keep controls comfortable on touchscreens. */
.hero-content,.section-heading>div,.section-heading>p,.service-card,
.project-copy,.project-small,.small-project-copy,.about-copy,.process-grid>li{min-width:0}
.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.project-pair{grid-template-columns:repeat(2,minmax(0,1fr))}
.hero-actions{flex-wrap:wrap}
.hero-signoff{flex-wrap:wrap}
.button,.menu-toggle,.motion-toggle,.copy-email{min-height:44px}
.text-link,.service-link{display:inline-flex;align-items:center;min-height:44px}
.site-header nav>a{min-height:44px;display:inline-flex;align-items:center}
.hero-bottom{flex-wrap:wrap}
.motion-toggle{position:static}
.tags li,.tool-tile>span,.email-row>a{overflow-wrap:anywhere}
.visual-caption{flex-wrap:wrap;row-gap:5px}
.command-core{max-width:100%}
.workspace-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.workspace-grid>div{min-width:0;text-align:center}
.workspace-grid strong,.workspace-grid small{max-width:100%;overflow-wrap:anywhere}
.flow-track>div{min-width:0;flex:1;width:auto;align-self:stretch;justify-content:center}
.flow-track strong{white-space:normal;text-align:center;line-height:1.5}
.flow-track>i{min-width:10px;flex:0 0 7%}
.flow-tools{flex-wrap:wrap;gap:8px 18px}
.flow-visual,.data-visual{height:auto;min-height:272px;padding-bottom:30px}
.data-stack>div{min-width:0}
.data-stack strong{min-width:0;line-height:1.5}
.data-stack small{min-width:0;text-align:right}
.email-row{flex-wrap:wrap}
.copy-email{min-width:64px}
footer>div{flex-wrap:wrap;row-gap:12px}

@media(max-width:960px){
  .section-heading{display:block}
  .section-heading>p{max-width:600px;margin-top:24px}
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .service-card:last-child{grid-column:1/-1}
  .service-card h3{min-height:0}
  .service-card>p{flex:1}
  .about{display:flex;flex-direction:column-reverse;gap:38px}
  .about-art{width:min(100%,440px);align-self:center}
  .about-copy h2{font-size:clamp(2.125rem,4.8vw,3rem)}
  .project-featured{grid-template-columns:minmax(0,1fr)}
  .project-visual{border-right:0;border-bottom:1px solid #ffffff12}
  .project-copy h3 br{display:none}
}

@media(max-width:760px){
  .site-header{height:78px}
  .menu-toggle{display:flex;align-items:center;gap:10px;font-size:14px;position:relative;z-index:21;padding:10px 0 10px 15px}
  .menu-icon{width:18px;height:9px;border-top:1px solid #d8b6d2;border-bottom:1px solid #d8b6d2}
  .site-header nav{display:none;position:absolute;top:77px;left:0;right:0;padding:24px 6%;background:#0d1423f8;border-bottom:1px solid #e0b6d323;backdrop-filter:blur(20px);align-items:stretch;gap:5px;flex-direction:column;box-shadow:0 20px 50px #0004}
  .site-header nav.is-open{display:flex}
  .site-header nav>a{padding:12px}
  .site-header nav .nav-contact{margin-top:10px;align-self:flex-start;padding:9px 18px}
  .project-pair{grid-template-columns:minmax(0,1fr)}
  .process-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .process-grid li{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:15px}
  .process-number{grid-row:1/3}
  .process-grid h3{margin:3px 0 10px}
  .process-grid p{grid-column:2;max-width:none}
  .hero h1 em{white-space:normal}
}

@media(max-width:620px){
  .hero{display:flex;flex-direction:column;gap:28px;min-height:0;padding:44px 6% 20px}
  .hero-content{order:1;max-width:100%}
  .hero h1{font-size:clamp(2.25rem,10.8vw,4rem);line-height:1.12;letter-spacing:-.045em}
  .hero-description{font-size:1rem;line-height:1.8;max-width:none}
  .hero .eyebrow{max-width:none;line-height:1.8;letter-spacing:.7px}
  .hero-actions{gap:14px 24px}
  .hero-actions .button,.hero-actions .text-link{font-size:.875rem}
  .hero-signoff{align-items:flex-start;gap:12px 18px}
  .hero-signoff .signature{font-size:1.375rem;padding-top:4px}
  .hero-signoff>span:last-child{font-size:.75rem;max-width:none}
  .signoff-line{display:none}
  .hero-art{position:relative;order:2;flex:0 0 auto;align-self:center;width:calc(100% + 12vw);height:auto;aspect-ratio:1.6;top:auto;right:auto;bottom:auto;margin:0 -6vw;opacity:1}
  .hero-art-inner{position:absolute;inset:0;height:100%}
  .hero-art img{object-position:65% center}
  .hero-bottom{position:relative;order:3;left:auto;right:auto;bottom:auto;width:100%;gap:12px;justify-content:space-between}
  .hero-bottom>a{display:inline-flex;align-items:center;min-height:44px}
  .motion-toggle{padding:8px 0 8px 8px}
  .service-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  .service-card:last-child{grid-column:auto}
  .section h2{font-size:clamp(2rem,8.9vw,2.625rem)}
  .contact h2{font-size:clamp(2.25rem,10.2vw,3.5rem)}
  .toolkit-heading>p{font-size:1rem}
  .service-card>p,.section-heading>p,.project-copy>p:not(.eyebrow),
  .small-project-copy>p:last-child,.about-copy>p:not(.eyebrow),
  .process-grid p,.contact>p:not(.eyebrow){font-size:1rem}
  .flow-visual,.data-visual{min-height:245px}
  .flow-track{margin-top:30px}
  .about-signature{flex-wrap:wrap;row-gap:8px}
  .email-row>a{font-size:.875rem}
}

@media(max-width:380px){
  .hero-actions{align-items:flex-start;flex-direction:column;gap:10px}
  .project-visual,.flow-visual,.data-visual{padding-left:14px;padding-right:14px}
  .project-copy,.small-project-copy,.service-card{padding:24px}
  .flow-track>div{padding:12px 5px}
  .flow-tools{gap:8px 12px}
  .workspace-grid{gap:6px}
  .workspace-grid>div{padding:13px 4px}
  .visual-footnote{text-align:center}
}

@media(hover:none){
  .button:hover,.service-card:hover,.tool-tile:hover,.tool-tile:hover>img{transform:none}
  .service-card:before{display:none}
}
