/* Owner-requested presentation polish — 2026-09-09.
   Targets the two previously underwhelming owner-visible regions without altering
   the verified service inventory, source facts, accessibility semantics or demo SEO. */

/* SERVICES — turn the sparse utility grid into one deliberate visual entry composition. */
.service-detail-section{padding-top:clamp(1.4rem,3vw,2.6rem)}
.service-routeboard{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:540px;margin:0 0 clamp(5rem,9vw,8rem);overflow:hidden;border-radius:calc(var(--radius) + .5rem);background:var(--ink);color:var(--paper);box-shadow:var(--shadow)}
.service-routeboard-media{position:relative;margin:0;min-height:100%;overflow:hidden;background:#342d2f}
.service-routeboard-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(24,23,22,.02) 40%,rgba(24,23,22,.58) 100%);pointer-events:none}
.service-routeboard-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.service-routeboard-media figcaption{position:absolute;left:1rem;bottom:1rem;z-index:1;padding:.48rem .7rem;border-radius:999px;background:rgba(24,23,22,.82);color:var(--paper);font-size:.69rem;font-weight:750;letter-spacing:.045em;backdrop-filter:blur(8px)}
.service-routeboard-copy{display:flex;flex-direction:column;justify-content:space-between;gap:2rem;padding:clamp(2rem,5vw,4.8rem);min-width:0}
.service-routeboard-copy .eyebrow{color:#efb19e}
.service-routeboard-copy h2{font-size:clamp(3rem,5vw,5.8rem);max-width:8ch;margin-bottom:1rem}
.service-routeboard-copy>div>p:last-child{max-width:35rem;color:#cfc3ba;font-size:1rem}
.service-routeboard .service-family-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;border:1px solid rgba(245,240,233,.2);border-radius:1rem;overflow:hidden}
.service-routeboard .service-family-nav a{position:relative;display:block;min-height:126px;margin:0;padding:1.15rem 2.4rem 1.15rem 1.15rem;border:0;border-right:1px solid rgba(245,240,233,.16);border-bottom:1px solid rgba(245,240,233,.16);color:var(--paper);font-size:.67rem}
.service-routeboard .service-family-nav a:nth-child(2n){border-right:0}
.service-routeboard .service-family-nav a:nth-last-child(-n+2){border-bottom:0}
.service-routeboard .service-family-nav a::after{content:"↗";position:absolute;right:1rem;top:1rem;font-size:1rem;font-weight:400;color:#efb19e;transition:transform .2s ease}
.service-routeboard .service-family-nav a:hover{background:rgba(245,240,233,.06)}
.service-routeboard .service-family-nav a:hover::after{transform:translate(3px,-3px)}
.service-routeboard .service-family-nav a span{display:block;margin-top:.42rem;color:var(--paper);font-size:clamp(1.35rem,2vw,1.9rem);line-height:1.03}

/* STUDIO — replace the oversized directory-like stack with an image-led editorial stage. */
.studio-result-stage{position:relative;overflow:hidden;background:linear-gradient(135deg,#181716 0%,#211d1c 58%,#33282a 100%)}
.studio-result-stage::before{content:"";position:absolute;width:520px;height:520px;right:-210px;top:-250px;border:1px solid rgba(245,240,233,.08);border-radius:50%;pointer-events:none}
.studio-stage-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(3rem,7vw,7rem);align-items:center}
.studio-stage-copy{min-width:0}
.studio-stage-copy .eyebrow{color:#efb19e}
.studio-stage-copy h2{font-size:clamp(3.2rem,6vw,6.5rem);max-width:7.5ch;margin-bottom:1.25rem}
.studio-stage-copy>p:not(.eyebrow){max-width:34rem;color:#cfc3ba;font-size:1.02rem}
.studio-route-inline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(2.3rem,5vw,4rem);border-top:1px solid rgba(245,240,233,.22);border-left:1px solid rgba(245,240,233,.14)}
.studio-route-inline a{position:relative;min-width:0;padding:1rem 2.2rem 1rem 1rem;border-right:1px solid rgba(245,240,233,.14);border-bottom:1px solid rgba(245,240,233,.18)}
.studio-route-inline a::after{content:"↗";position:absolute;right:.8rem;top:50%;transform:translateY(-50%);color:#efb19e;font-size:1rem}
.studio-route-inline span{display:block;margin-bottom:.32rem;color:#c4b8af;font-size:.63rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.studio-route-inline strong{display:block;font-family:var(--serif);font-size:clamp(1.18rem,2vw,1.62rem);font-weight:400;line-height:1.06}
.studio-route-inline a:hover{background:rgba(245,240,233,.055)}
.studio-stage-media{position:relative;min-height:640px}
.studio-stage-media figure{margin:0;position:absolute;overflow:hidden;background:#332b2d;box-shadow:0 28px 60px rgba(0,0,0,.28)}
.studio-stage-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.studio-stage-media figcaption{position:absolute;left:.85rem;bottom:.85rem;z-index:2;padding:.45rem .65rem;border-radius:999px;background:rgba(24,23,22,.82);color:var(--paper);font-size:.65rem;font-weight:750;letter-spacing:.04em;backdrop-filter:blur(8px)}
.studio-stage-main{inset:0 12% 0 0;border-radius:calc(var(--radius) + .45rem)}
.studio-stage-main img{object-position:center 42%}
.studio-stage-detail{right:0;bottom:7%;width:39%;aspect-ratio:.78;border:7px solid var(--ink);border-radius:calc(var(--radius) + .2rem)}
.studio-stage-detail img{object-position:center 38%}

@media (max-width:980px){
  .service-routeboard{grid-template-columns:1fr;min-height:0}
  .service-routeboard-media{min-height:420px}
  .studio-stage-grid{grid-template-columns:1fr;gap:2.8rem}
  .studio-stage-copy{max-width:50rem}
  .studio-stage-media{min-height:580px}
}

@media (max-width:720px){
  .service-detail-section{padding-top:1rem}
  .service-routeboard{margin-inline:-.15rem;margin-bottom:5.2rem;border-radius:1.45rem}
  .service-routeboard-media{min-height:285px}
  .service-routeboard-copy{padding:1.6rem 1.25rem 1.35rem;gap:1.8rem}
  .service-routeboard-copy h2{font-size:clamp(3rem,13.5vw,4.25rem);max-width:8.2ch}
  .service-routeboard-copy>div>p:last-child{font-size:.94rem;line-height:1.5}
  .service-routeboard .service-family-nav{display:block;border-radius:.8rem}
  .service-routeboard .service-family-nav a{display:grid;grid-template-columns:76px minmax(0,1fr) auto;align-items:center;gap:.7rem;min-height:0;padding:.9rem .9rem;border:0;border-bottom:1px solid rgba(245,240,233,.16);font-size:.62rem}
  .service-routeboard .service-family-nav a:nth-child(2n){border-right:0}
  .service-routeboard .service-family-nav a:nth-last-child(-n+2){border-bottom:1px solid rgba(245,240,233,.16)}
  .service-routeboard .service-family-nav a:last-child{border-bottom:0}
  .service-routeboard .service-family-nav a::after{position:static;grid-column:3;grid-row:1;font-size:.95rem;transform:none}
  .service-routeboard .service-family-nav a:hover::after{transform:translate(2px,-2px)}
  .service-routeboard .service-family-nav a span{grid-column:2;grid-row:1;margin:0;font-size:1.3rem;line-height:1.04}

  .studio-result-stage{padding-top:4.4rem;padding-bottom:4.8rem}
  .studio-stage-grid{gap:2.4rem}
  .studio-stage-copy h2{font-size:clamp(3.3rem,14vw,4.9rem);max-width:7.4ch}
  .studio-stage-copy>p:not(.eyebrow){font-size:.96rem}
  .studio-route-inline{margin-top:2rem;grid-template-columns:1fr 1fr}
  .studio-route-inline a{padding:.9rem 1.8rem .9rem .8rem}
  .studio-route-inline span{font-size:.58rem}
  .studio-route-inline strong{font-size:1.18rem}
  .studio-stage-media{min-height:500px}
  .studio-stage-main{inset:0 8% 0 0}
  .studio-stage-detail{width:42%;bottom:5%;border-width:5px}
}

@media (max-width:390px){
  .service-routeboard-media{min-height:260px}
  .service-routeboard-copy{padding:1.45rem 1.05rem 1.15rem}
  .service-routeboard-copy h2{font-size:3.45rem}
  .service-routeboard .service-family-nav a{grid-template-columns:70px minmax(0,1fr) auto;padding:.84rem .8rem}
  .service-routeboard .service-family-nav a span{font-size:1.18rem}
  .studio-stage-copy h2{font-size:3.65rem}
  .studio-route-inline{grid-template-columns:1fr}
  .studio-route-inline a{padding:.82rem 1.8rem .82rem .75rem}
  .studio-route-inline strong{font-size:1.22rem}
  .studio-stage-media{min-height:455px}
  .studio-stage-detail{width:44%}
}

@media (prefers-reduced-motion:reduce){
  .service-routeboard .service-family-nav a::after{transition:none}
  .service-routeboard .service-family-nav a:hover::after{transform:none}
}