/* Shared header */
.site-header { position: sticky; top: 0; z-index: 40; border-bottom: 1px solid var(--border-subtle); background: color-mix(in srgb, var(--surface-page) 94%, transparent); backdrop-filter: blur(12px); }
.site-header__inner { min-height: 72px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--space-5); }
.wordmark { display: inline-flex; align-items: center; gap: .55rem; font-family: var(--font-display); font-size: 1.28rem; font-weight: 500; letter-spacing: -.04em; }
.wordmark__slash { width: 16px; height: 3px; background: var(--accent-500); transform: rotate(-48deg); transform-origin: center; border-radius: 2px; }
.site-nav { display: flex; justify-content: center; gap: clamp(1.1rem, 2vw, 2.4rem); font-size: var(--text-sm); }
.site-nav a, .footer-nav a { transition: color var(--duration-fast) var(--ease-standard); }
.site-nav a:hover, .footer-nav a:hover { color: var(--accent-500); }
.menu-button { display: none; border: 0; background: transparent; width: 44px; height: 44px; align-items: center; justify-content: center; cursor: pointer; }
.menu-button__bars, .menu-button__bars::before, .menu-button__bars::after { width: 18px; height: 1.5px; background: var(--ink-950); display: block; position: relative; }
.menu-button__bars::before, .menu-button__bars::after { content:""; position:absolute; left:0; }
.menu-button__bars::before { top:-5px; }
.menu-button__bars::after { top:5px; }
.mobile-nav { display:none; }
.mobile-nav[data-open="true"] { display:block; border-top:1px solid var(--border-subtle); background:var(--surface-page); }
.mobile-nav__inner { padding-block: .8rem 1.35rem; display:grid; gap:.15rem; }
.mobile-nav a:not(.button) { min-height:48px; display:flex; align-items:center; border-bottom:1px solid var(--border-subtle); font-weight:500; }
.mobile-nav .button { margin-top:.7rem; }

/* Buttons and small links */
.button { min-height: 44px; padding: .78rem 1.14rem; display:inline-flex; align-items:center; justify-content:center; gap:.7rem; border:1px solid transparent; border-radius:var(--radius-sm); font-size:var(--text-sm); font-weight:600; cursor:pointer; transition: transform var(--duration-fast) var(--ease-standard), background var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard); }
.button:hover { transform: translateY(-1px); }
.button--primary { background:var(--accent-500); color:white; box-shadow: 0 7px 18px rgba(226,61,46,.16); }
.button--primary:hover { background:var(--accent-600); }
.button--primary:active { background:var(--accent-700); transform:none; }
.button--ghost { border-color:var(--border-subtle); background:var(--surface-card); }
.button--dark { background:white; color:var(--ink-950); }
.button--outline-light { border-color:color-mix(in srgb,white 42%,transparent); color:white; background:transparent; }
.button--outline-light:hover { border-color:white; }
.button__arrow { font-size:1.1em; line-height:1; }
.text-link { display:inline-flex; gap:.65rem; align-items:center; color:var(--accent-500); font-size:var(--text-xs); font-weight:700; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; }
.text-link span { transition: transform var(--duration-fast) var(--ease-standard); }
.text-link:hover span { transform:translateX(3px); }

/* Shared surfaces and headings */
.surface { border:1px solid var(--border-subtle); background:var(--surface-card); border-radius:var(--radius-md); }
.surface--soft { background:var(--surface-soft); }
.surface--dark { background:var(--surface-dark); color:var(--text-on-dark); border-color:transparent; }
.section-heading { display:grid; grid-template-columns:minmax(0, 6fr) minmax(17rem, 3fr); gap:var(--space-6); align-items:end; margin-bottom:var(--space-6); }
.section-heading__aside { justify-self:end; display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-3); max-width:34rem; }
.section-heading__aside .copy { max-width:42ch; }
.line-icon { width:34px; height:34px; display:inline-grid; place-items:center; flex:0 0 auto; }
.line-icon svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round; }
.card-arrow { font-size:1.05rem; line-height:1; }

/* Home hero */
.home-hero { padding-block: clamp(2.4rem, 1.1rem + 4.8vw, 6rem) clamp(2.2rem, 1.6rem + 2vw, 4rem); }
.home-hero__grid { display:grid; grid-template-columns:minmax(17rem, 4.8fr) minmax(0, 7.2fr); gap:clamp(1.5rem, 3vw, 4rem); align-items:center; }
.home-hero__copy { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-4); padding-block:var(--space-3); }
.home-hero__copy .h1 { max-width:10ch; }
.home-hero__lede { font-size:var(--text-lg); max-width:29ch; }
.home-hero__copy .button { margin-top:var(--space-2); }
.hero-media { position:relative; overflow:hidden; margin:0; aspect-ratio:16/9; background:#dce4e9; isolation:isolate; }
.hero-media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(15,17,19,.52) 100%); pointer-events:none; }
.hero-media figcaption { position:absolute; z-index:2; left:var(--space-4); bottom:var(--space-4); color:white; font-size:var(--text-xs); font-weight:600; letter-spacing:.16em; line-height:1.35; text-transform:uppercase; }

/* Process journey */
.home-process { padding-top:clamp(3.6rem, 2.2rem + 3vw, 6rem); }
.journey-grid { display:grid; grid-template-columns:1fr 1fr 1.9fr 1fr; gap:var(--grid-gap); align-items:stretch; }
.journey-card { position:relative; min-width:0; min-height:260px; padding:var(--space-4); border:1px solid var(--border-subtle); border-radius:var(--radius-md); background:linear-gradient(145deg,var(--surface-card),var(--surface-soft)); display:flex; flex-direction:column; }
.journey-card:not(:last-child)::after { content:"→"; position:absolute; right:calc(var(--grid-gap) * -0.72); top:48%; z-index:2; color:var(--ink-800); font-size:.95rem; }
.journey-card__top { display:flex; align-items:flex-start; justify-content:space-between; color:var(--ink-950); }
.journey-card__number { color:var(--accent-500); font-size:var(--text-xs); font-weight:700; }
.journey-card__top .line-icon { width:32px; height:32px; }
.journey-card__title { margin:var(--space-5) 0 var(--space-3); font-size:var(--text-lg); line-height:1.02; letter-spacing:-.035em; }
.journey-card__meta { margin:auto 0 0; color:var(--text-secondary); font-size:var(--text-sm); line-height:1.35; }
.journey-card__media { aspect-ratio:3/2; overflow:hidden; border-radius:var(--radius-sm); background:var(--ink-150); margin-bottom:var(--space-4); }
.journey-card__media img { width:100%; height:100%; object-fit:cover; }
.journey-card--media .journey-card__title { margin-top:var(--space-4); }
.journey-card__production { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.82fr); gap:.6rem; align-items:start; margin-bottom:var(--space-4); }
.journey-card__production .journey-card__media { margin-bottom:0; }
.journey-card__production .studio-split { grid-template-columns:1fr; margin:0; height:100%; }
.journey-card__production .studio-mini { min-height:0; }
.journey-card--production { background:linear-gradient(145deg,color-mix(in srgb,var(--accent-500) 4%,white),var(--surface-card)); border-color:color-mix(in srgb,var(--accent-500) 24%,var(--border-subtle)); }
.studio-split { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; margin:0 0 var(--space-4); }
.studio-mini { min-height:102px; border:1px solid var(--border-subtle); border-radius:var(--radius-sm); padding:.7rem; display:grid; grid-template-columns:auto 1fr; align-items:start; gap:.5rem; font-size:var(--text-xs); line-height:1.15; background:white; }
.studio-mini .line-icon { width:22px; height:22px; }
.studio-mini--dark { background:var(--ink-950); color:white; border-color:transparent; position:relative; }
.studio-mini--dark small { grid-column:1/-1; align-self:end; color:#c8cdd1; text-transform:uppercase; letter-spacing:.08em; font-size:.58rem; }

/* Capabilities */
.capability-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--grid-gap); }
.capability-card { min-height:170px; padding:var(--space-4); position:relative; display:flex; flex-direction:column; justify-content:space-between; background:linear-gradient(145deg,#fff,#f4f5f5); transition:transform var(--duration-base) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard); }
.capability-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--ink-950) 20%,transparent); }
.capability-card .line-icon { width:28px; height:28px; }
.capability-card h3 { font-size:var(--text-md); line-height:1.08; letter-spacing:-.025em; margin:var(--space-4) 2rem .5rem 0; }
.capability-card p { margin:0; padding-right:1.4rem; color:var(--text-secondary); font-size:var(--text-sm); line-height:1.35; }
.capability-card .card-arrow { position:absolute; right:var(--space-3); bottom:var(--space-3); }

/* Work */
.work-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--grid-gap); }
.work-card { overflow:hidden; background:white; }
.work-card__media { aspect-ratio:3/2; overflow:hidden; background:var(--ink-150); }
.work-card__media img { width:100%; height:100%; object-fit:cover; }
.work-card__body { padding:var(--space-3); }
.work-card__body h3 { margin:0; font-size:var(--text-sm); letter-spacing:-.01em; }
.work-card__body p { margin:.25rem 0 0; color:var(--text-secondary); font-size:var(--text-xs); }
.work-note { max-width:68ch; margin:var(--space-3) 0 0 auto; color:var(--text-secondary); font-size:var(--text-xs); }

/* Why CIEL */
.why-ciel { border-top:1px solid var(--border-subtle); }
.why-ciel__layout { display:grid; grid-template-columns:minmax(13rem, 3fr) minmax(0, 9fr); gap:var(--space-7); align-items:end; }
.benefit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--grid-gap); }
.benefit { min-height:110px; border-left:1px solid var(--border-subtle); padding:var(--space-3); display:flex; flex-direction:column; justify-content:space-between; gap:var(--space-4); }
.benefit .line-icon { width:28px; height:28px; }
.benefit span:last-child { font-size:var(--text-sm); line-height:1.15; max-width:12ch; }

/* Closing CTA */
.closing-band { padding:clamp(1.4rem,1rem + 1.8vw,2.5rem); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--space-6); align-items:center; overflow:hidden; }
.closing-band .eyebrow { color:#ff7669; }
.closing-band .h2 { font-size:clamp(1.45rem,1.15rem + 1vw,2.25rem); letter-spacing:-.035em; }
.closing-band__meta { display:flex; align-items:center; gap:var(--space-4); }
.closing-band__meta > span:first-child { color:#aeb4ba; font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.12em; }
.closing-band--media { position:relative; isolation:isolate; aspect-ratio:21/9; grid-template-columns:minmax(0,min(34rem,50%)); align-content:end; gap:var(--space-4); padding:clamp(1.6rem,1rem + 2.4vw,3.2rem); }
.closing-band--media .closing-band__meta { flex-wrap:wrap; justify-content:flex-start; }
.closing-band__media { position:absolute; inset:0; z-index:-1; }
.closing-band__media img { width:100%; height:100%; object-fit:cover; }
.closing-band__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,17,19,0) 40%,rgba(15,17,19,.82) 100%), linear-gradient(90deg,rgba(15,17,19,.55) 0%,rgba(15,17,19,0) 45%); }
.closing-slash { width:26px; height:3px; background:var(--accent-500); transform:rotate(-52deg); display:block; margin-inline:.25rem; }

/* Footer */
.site-footer { border-top:1px solid var(--border-subtle); padding-block:clamp(2rem,1.4rem + 2vw,3.2rem) 1.6rem; background:var(--surface-page); }
.site-footer__inner { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,.8fr); gap:var(--space-6); align-items:start; font-size:var(--text-xs); color:var(--text-secondary); }
.site-footer__brand p { margin:.8rem 0 0; font-size:var(--text-sm); color:var(--ink-800); }
.footer-nav { display:flex; flex-direction:column; align-items:flex-start; gap:.15rem; }
.footer-nav strong { margin-bottom:.4rem; color:var(--ink-950); font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase; }
.footer-nav a { min-height:32px; display:inline-flex; align-items:center; gap:.45rem; }
.footer-nav small { color:var(--accent-500); font-size:.58rem; letter-spacing:.08em; text-transform:uppercase; }
.site-footer__legal { grid-column:1/-1; padding-top:var(--space-4); border-top:1px solid var(--border-subtle); }
.footer-mark { color:var(--ink-950); }

@media (max-width: 1100px) {
  .home-hero__grid { grid-template-columns:minmax(15rem,4.2fr) minmax(0,5.8fr); gap:var(--space-5); }
  .home-hero__copy .h1 { font-size:clamp(2.3rem,4.5vw,4.4rem); }
  .journey-grid { grid-template-columns:1fr 1fr 1.55fr 1fr; }
  .journey-card { min-height:240px; padding:var(--space-3); }
  .studio-split { grid-template-columns:1fr; }
  .studio-mini { min-height:70px; }
  .capability-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .why-ciel__layout { grid-template-columns:1fr; gap:var(--space-5); }
}

@media (max-width: 860px) {
  .site-header__inner { min-height:64px; }
  .site-nav, .site-header__cta { display:none; }
  .site-header__inner { grid-template-columns:auto 1fr auto; }
  .menu-button { display:flex; grid-column:3; }
  .section-heading { grid-template-columns:1fr; }
  .section-heading__aside { justify-self:start; max-width:40rem; }
  .home-hero__grid { grid-template-columns:1fr; gap:var(--space-5); }
  .home-hero__copy { max-width:640px; padding-bottom:0; }
  .home-hero__copy .h1 { max-width:11ch; font-size:var(--text-3xl); }
  .journey-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .journey-card:not(:last-child)::after { display:none; }
  .journey-card--production { grid-column:span 2; }
  .studio-split { grid-template-columns:1fr 1fr; }
  .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .site-footer__inner { grid-template-columns:1fr 1fr; }
  .site-footer__brand { grid-column:1/-1; }
}

@media (max-width: 860px) and (min-width: 600px) {
  .journey-card--media:last-child:not(.journey-card--production) { grid-column:span 2; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-areas:"top media" "title media" "meta media"; grid-template-rows:auto auto 1fr; column-gap:var(--space-5); }
  .journey-card--media:last-child .journey-card__top { grid-area:top; }
  .journey-card--media:last-child .journey-card__title { grid-area:title; }
  .journey-card--media:last-child .journey-card__meta { grid-area:meta; }
  .journey-card--media:last-child .journey-card__media { grid-area:media; margin:0; }
}

@media (max-width: 699px) {
  .closing-band--media { aspect-ratio:auto; grid-template-columns:1fr; padding:1.25rem; }
  .closing-band--media .closing-band__media { position:relative; inset:auto; z-index:0; margin:-1.25rem -1.25rem .25rem; aspect-ratio:21/9; }
  .closing-band--media .closing-band__media::after { background:linear-gradient(180deg,rgba(15,17,19,0) 60%,rgba(15,17,19,.9) 100%); }
}

@media (max-width: 700px) and (min-width: 600px) {
  .closing-band { grid-template-columns:1fr; }
  .closing-band__meta { justify-content:space-between; }
  .closing-band__meta > span:first-child { min-width:0; }
}

@media (max-width: 599px) {
  .home-hero { padding-top:1.6rem; }
  .home-hero__copy { gap:.85rem; }
  .home-hero__copy .h1 { font-size:clamp(2.35rem,11vw,3.25rem); line-height:.91; }
  .home-hero__lede { font-size:var(--text-md); max-width:31ch; }
  .home-hero__copy .button { width:100%; }
  .hero-media { border-radius:var(--radius-sm); }
  .hero-media figcaption { font-size:.62rem; }
  .section { padding-block:clamp(3rem,8vw,4.3rem); }
  .section--tight { padding-block:clamp(2.4rem,7vw,3.7rem); }
  .section-heading { gap:var(--space-3); margin-bottom:var(--space-4); }
  .section-heading__aside { gap:.8rem; }
  .journey-grid { grid-template-columns:1fr; gap:.55rem; }
  .journey-card, .journey-card--production { grid-column:auto; min-height:auto; padding:1rem; }
  .journey-card__top { align-items:center; }
  .journey-card__top .line-icon { width:26px; height:26px; }
  .journey-card__title { margin:.7rem 0 .55rem; }
  .journey-card__meta { margin-top:.65rem; }
  .journey-card--media:not(.journey-card--production) { display:grid; grid-template-columns:minmax(0,1fr) 40%; grid-template-areas:"top media" "title media" "meta media"; column-gap:.9rem; align-items:start; }
  .journey-card--media:not(.journey-card--production) .journey-card__top { grid-area:top; }
  .journey-card--media:not(.journey-card--production) .journey-card__title { grid-area:title; margin:.6rem 0 0; }
  .journey-card--media:not(.journey-card--production) .journey-card__meta { grid-area:meta; margin-top:.45rem; }
  .journey-card--media:not(.journey-card--production) .journey-card__media { grid-area:media; margin:0; }
  .journey-card--media .journey-card__top .line-icon { display:none; }
  .journey-card__production { margin:.2rem 0 0; }
  .studio-split { margin-top:.35rem; }
  .capability-grid { grid-template-columns:1fr; gap:.55rem; }
  .capability-card { min-height:0; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.8rem; padding:1rem; }
  .capability-card h3 { margin:0 0 .2rem; }
  .capability-card p { font-size:var(--text-xs); }
  .capability-card .card-arrow { position:static; }
  .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
  .work-card__body { padding:.6rem .65rem .7rem; }
  .work-card__body h3 { font-size:var(--text-xs); }
  .work-card__body p { font-size:.62rem; }
  .work-note { margin-left:0; }
  .benefit-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; border-top:1px solid var(--border-subtle); border-bottom:1px solid var(--border-subtle); }
  .benefit { min-height:96px; border-left:0; border-right:1px solid var(--border-subtle); padding:.75rem .45rem; text-align:center; align-items:center; }
  .benefit:last-child { border-right:0; }
  .benefit .line-icon { width:23px; height:23px; }
  .benefit span:last-child { font-size:.62rem; line-height:1.15; }
  .closing-band { grid-template-columns:1fr; gap:var(--space-4); }
  .closing-band__meta { display:grid; grid-template-columns:1fr auto; }
  .closing-band__meta > span:first-child { grid-column:1/-1; }
  .closing-band .button { width:100%; }
  .site-footer__inner { gap:var(--space-5) var(--space-4); }
}

/* Solutions overview */
body[data-page^="solutions"] .site-nav a[href="/solutions"],
body[data-page="service"] .site-nav a[href="/solutions"],
body[data-page="work"] .site-nav a[href="/work"],
body[data-page="about"] .site-nav a[href="/about"],
body[data-page="contact"] .site-nav a[href="/contact"] { color:var(--accent-500); }
.solutions-page, .svc-page, .page { overflow:clip; }
.solutions-hero { padding-block:clamp(2rem,1rem + 3.7vw,5rem) 0; }
.solutions-hero__grid { display:grid; grid-template-columns:minmax(18rem,4.8fr) minmax(0,7.2fr); align-items:stretch; min-height:clamp(360px,35vw,500px); }
.solutions-hero__copy { padding:clamp(1rem,1vw,1.5rem) clamp(1.5rem,3.5vw,4.8rem) clamp(2.1rem,4vw,4rem) 0; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:var(--space-4); }
.solutions-hero__copy .h1 { max-width:9ch; font-size:clamp(3rem,4.85vw,5.45rem); }
.solutions-hero__lede { font-size:var(--text-lg); max-width:31ch; }
.solutions-hero__actions { display:flex; gap:.7rem; flex-wrap:wrap; padding-top:var(--space-2); }
.solutions-hero__media { position:relative; overflow:hidden; margin:0; background:#dce5ea; min-width:0; }
.solutions-hero__media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.solutions-hero__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 58%,rgba(15,17,19,.5) 100%); pointer-events:none; }
.solutions-hero__media figcaption { position:absolute; left:var(--space-4); bottom:var(--space-4); z-index:2; display:flex; align-items:flex-start; gap:.65rem; color:white; text-transform:uppercase; font-size:.66rem; line-height:1.45; letter-spacing:.22em; font-weight:600; }
.solutions-hero__media figcaption i,
.solutions-entry-note > i { width:23px; height:3px; display:block; flex:0 0 auto; background:var(--accent-500); transform:rotate(-52deg); margin-top:.45rem; }

/* Dark approach band: S02 sits on the right, real text sits on its dark left side. */
.solutions-approach { position:relative; isolation:isolate; overflow:hidden; padding-block:clamp(2.6rem,1.6rem + 3.2vw,4.6rem); }
.solutions-approach__media { position:absolute; top:0; right:0; bottom:0; width:58%; margin:0; z-index:-1; }
.solutions-approach__media img { width:100%; height:100%; object-fit:cover; }
.solutions-approach__media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--ink-950) 0%,rgba(15,17,19,.55) 18%,rgba(15,17,19,0) 42%); }
.solutions-approach__grid { display:grid; grid-template-columns:minmax(0,31rem); gap:var(--space-6); align-content:center; }
.solutions-approach__copy .eyebrow { color:#ff6a5d; }
.solutions-approach__copy .h2 { margin-top:var(--space-3); max-width:none; font-size:clamp(2rem,2.9vw,3.35rem); }
.solutions-approach__copy p { max-width:45ch; margin:var(--space-3) 0 0; color:#aeb4ba; font-size:var(--text-sm); }
.solutions-approach__list { list-style:none; padding:0; margin:0; position:relative; display:grid; gap:1.05rem; }
.solutions-approach__list::before { content:""; position:absolute; left:5px; top:8px; bottom:8px; width:1px; background:color-mix(in srgb,var(--accent-500) 55%,#5c6065); }
.solutions-approach__item { position:relative; display:grid; grid-template-columns:auto 1fr; align-items:start; gap:1rem; min-height:42px; }
.solutions-approach__dot { position:relative; z-index:1; width:11px; height:11px; margin-top:.24rem; border-radius:50%; background:var(--accent-500); box-shadow:0 0 0 5px var(--ink-950); }
.solutions-approach__item strong { display:block; font-size:var(--text-xs); line-height:1.25; text-transform:uppercase; letter-spacing:.055em; }
.solutions-approach__item small { display:block; margin-top:.18rem; color:#9fa5ab; font-size:.69rem; line-height:1.3; }

.solutions-capabilities { padding-top:clamp(3.2rem,2rem + 3.4vw,6rem); }
.solutions-section-head, .svc-section-head { display:grid; grid-template-columns:minmax(0,7fr) minmax(15rem,3fr); gap:var(--space-6); align-items:end; margin-bottom:var(--space-5); }
.solutions-section-head .h2, .svc-section-head .h2 { margin-top:var(--space-2); font-size:clamp(2rem,3vw,3.25rem); }
.solutions-entry-note { display:flex; gap:.9rem; justify-self:end; align-items:flex-start; max-width:16rem; padding-bottom:.35rem; }
.solutions-entry-note strong { display:block; text-transform:uppercase; font-size:.67rem; line-height:1.35; letter-spacing:.1em; }
.solutions-entry-note span { display:block; margin-top:.45rem; color:var(--text-secondary); font-size:var(--text-xs); line-height:1.35; }
.solutions-card-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--grid-gap); }
.solution-card { overflow:hidden; display:flex; flex-direction:column; min-width:0; background:white; transition:transform var(--duration-base) var(--ease-standard), box-shadow var(--duration-base) var(--ease-standard); }
.solution-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-float); }
.solution-card__media { aspect-ratio:4/3; overflow:hidden; background:var(--ink-150); }
.solution-card__media img { width:100%; height:100%; object-fit:cover; transition:transform 500ms var(--ease-standard); }
.solution-card:hover .solution-card__media img { transform:scale(1.022); }
.solution-card__body { position:relative; flex:1; display:flex; flex-direction:column; min-height:210px; padding:var(--space-3) var(--space-3) var(--space-4); }
.solution-card__index { color:var(--accent-500); font-size:var(--text-xs); font-weight:700; }
.solution-card h3 { margin:.42rem 2rem .5rem 0; font-size:var(--text-lg); line-height:1.02; letter-spacing:-.035em; }
.solution-card p { margin:0; color:var(--text-secondary); font-size:var(--text-xs); line-height:1.42; }
.solution-card__link { position:absolute; right:var(--space-3); bottom:var(--space-3); min-width:44px; min-height:44px; display:grid; place-items:end; font-size:1rem; }
.solution-card__studios { margin-top:auto; padding-top:var(--space-3); padding-right:2.2rem; display:grid; gap:.35rem; font-size:.68rem; line-height:1.25; }
.solution-card__studios span { display:flex; align-items:center; gap:.5rem; }
.solution-card__studios span::before { content:""; width:5px; height:5px; background:var(--accent-500); border-radius:50%; }
.solution-card__studios small { margin-left:auto; color:var(--text-secondary); font-size:.57rem; text-transform:uppercase; letter-spacing:.06em; }
.solution-card--production { border-color:color-mix(in srgb,var(--accent-500) 22%,var(--border-subtle)); }

/* Workflow band: S01 on the right, copy on solid charcoal. */
.solutions-workflow { padding-top:0; }
.solutions-workflow__band { min-height:clamp(330px,32vw,450px); position:relative; overflow:hidden; isolation:isolate; display:grid; align-items:center; }
.solutions-workflow__media { position:absolute; top:0; right:0; bottom:0; width:58%; z-index:-1; }
.solutions-workflow__media img { width:100%; height:100%; object-fit:cover; }
.solutions-workflow__media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--ink-950) 0%,rgba(15,17,19,.4) 22%,rgba(15,17,19,0) 50%); }
.solutions-workflow__content { padding:clamp(2rem,2.5vw,3.2rem); max-width:min(46%, 34rem); }
.solutions-workflow__content .eyebrow { color:#ff6a5d; }
.solutions-workflow__content .h2 { margin-top:var(--space-3); max-width:10ch; font-size:clamp(2rem,3vw,3.2rem); }
.solutions-workflow__content p { max-width:42ch; margin:var(--space-3) 0 var(--space-4); color:#c0c4c8; font-size:var(--text-sm); }

@media (max-width:1100px) {
  .solutions-hero__grid { grid-template-columns:minmax(15rem,4.7fr) minmax(0,5.3fr); min-height:400px; }
  .solutions-hero__copy { padding-right:var(--space-5); }
  .solutions-hero__copy .h1 { font-size:clamp(2.65rem,5vw,4.35rem); }
  .solutions-approach__media { width:56%; }
  .solutions-approach__grid { grid-template-columns:minmax(0,26rem); }
  .solutions-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .solution-card__body { min-height:170px; }
}

@media (max-width:860px) {
  .solutions-hero { padding-top:var(--space-5); }
  .solutions-hero__grid { grid-template-columns:1fr; min-height:0; }
  .solutions-hero__copy { padding:var(--space-4) 0 var(--space-5); max-width:720px; }
  .solutions-hero__copy .h1 { font-size:var(--text-3xl); max-width:10ch; }
  .solutions-hero__media { aspect-ratio:16/9; }
  .solutions-approach { display:flex; flex-direction:column; padding-bottom:0; }
  .solutions-approach__media { position:relative; order:2; width:100%; aspect-ratio:16/9; margin-top:var(--space-6); }
  .solutions-approach__media::after { background:linear-gradient(180deg,var(--ink-950) 0%,rgba(15,17,19,0) 30%); }
  .solutions-approach__grid { grid-template-columns:1fr 1fr; gap:var(--space-5); align-items:start; }
  .solutions-section-head, .svc-section-head { grid-template-columns:1fr auto; }
  .solutions-entry-note { max-width:14rem; }
  .solutions-workflow__band { min-height:0; align-items:start; }
  .solutions-workflow__media { position:relative; width:100%; aspect-ratio:16/9; z-index:0; }
  .solutions-workflow__media::after { background:linear-gradient(180deg,rgba(15,17,19,0) 70%,var(--ink-950) 100%); }
  .solutions-workflow__content { max-width:40rem; padding-top:var(--space-4); }
}

@media (max-width:700px) and (min-width:600px) {
  .solutions-approach__grid { grid-template-columns:minmax(0,1fr) minmax(16rem,.9fr); }
  .solutions-card-grid { gap:.8rem; }
  .solution-card__body { min-height:188px; }
}

@media (max-width:599px) {
  .solutions-hero { padding-top:.7rem; }
  .solutions-hero__copy { gap:.82rem; padding-bottom:1.25rem; }
  .solutions-hero__copy .h1 { font-size:clamp(2.45rem,12vw,3.4rem); line-height:.91; }
  .solutions-hero__lede { font-size:var(--text-sm); max-width:34ch; }
  .solutions-hero__actions { width:100%; display:grid; grid-template-columns:1fr auto; padding-top:.35rem; }
  .solutions-hero__actions .button { padding-inline:.85rem; }
  .solutions-hero__media { width:calc(100% + 2rem); margin-left:-1rem; }
  .solutions-hero__media figcaption { left:1rem; bottom:1rem; font-size:.57rem; }
  .solutions-approach { padding-top:2rem; }
  .solutions-approach__media { margin-top:var(--space-5); }
  .solutions-approach__grid { grid-template-columns:1fr; gap:var(--space-5); }
  .solutions-approach__copy .h2 { font-size:clamp(2rem,9vw,2.8rem); }
  .solutions-approach__copy p { font-size:var(--text-xs); }
  .solutions-approach__list { gap:.9rem; }
  .solutions-approach__item strong { font-size:.7rem; }
  .solutions-approach__item small { font-size:.62rem; }
  .solutions-section-head, .svc-section-head { grid-template-columns:1fr; gap:var(--space-3); margin-bottom:var(--space-4); }
  .solutions-section-head .h2, .svc-section-head .h2 { font-size:clamp(1.75rem,8vw,2.35rem); }
  .solutions-entry-note { justify-self:start; max-width:none; }
  .solutions-entry-note strong { font-size:.62rem; }
  .solutions-entry-note span { font-size:.66rem; }
  .solutions-card-grid { grid-template-columns:1fr; gap:.5rem; }
  .solution-card { display:grid; grid-template-columns:40% minmax(0,1fr); align-items:stretch; border-radius:var(--radius-sm); }
  .solution-card__media { aspect-ratio:4/3; align-self:center; }
  .solution-card__body { min-height:0; padding:.7rem 2.6rem .7rem .8rem; justify-content:center; }
  .solution-card__index { font-size:.62rem; }
  .solution-card h3 { font-size:.96rem; margin:.25rem 0 .25rem; }
  .solution-card p { display:none; }
  .solution-card__studios { margin-top:.25rem; padding:0; font-size:.58rem; gap:.15rem; }
  .solution-card__studios small { font-size:.5rem; }
  .solution-card__link { right:.4rem; bottom:.4rem; }
  .solutions-workflow { padding-bottom:2rem; }
  .solutions-workflow .container { width:100%; }
  .solutions-workflow__content { padding:1.25rem 1rem 1.6rem; }
  .solutions-workflow__content .h2 { font-size:clamp(2rem,9vw,2.7rem); }
  .solutions-workflow__content p { font-size:var(--text-xs); }
  .solutions-workflow__content .button { width:100%; }
}

/* Service pages (Creative Direction, Visual Development, Animation Studio, Cinematic Studio, Media Intelligence & Editing) */
.svc-hero { padding-block:clamp(2rem,1rem + 3.7vw,5rem) clamp(1rem,.6rem + 1.5vw,2rem); }
.svc-hero__grid { display:grid; grid-template-columns:minmax(18rem,4.6fr) minmax(0,7.4fr); gap:clamp(1.5rem,3.5vw,4.5rem); align-items:center; }
.svc-hero__copy { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-4); }
.svc-hero__copy .eyebrow a:hover { color:var(--accent-700); }
.svc-hero__copy .h1 { font-size:clamp(3rem,4.85vw,5.45rem); }
.svc-hero__lede { font-size:var(--text-lg); max-width:33ch; }
.svc-hero__actions { display:flex; gap:.7rem; flex-wrap:wrap; padding-top:var(--space-2); }
.svc-hero__tags { list-style:none; margin:var(--space-3) 0 0; padding:var(--space-3) 0 0; border-top:1px solid var(--border-subtle); display:flex; flex-wrap:wrap; gap:.35rem 0; color:var(--ink-800); font-size:var(--text-xs); font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.svc-hero__tags li:not(:last-child)::after { content:"/"; margin-inline:.7rem; color:var(--ink-300); }
.svc-hero__media { position:relative; overflow:hidden; margin:0; aspect-ratio:16/9; border-radius:var(--radius-md); background:#dce5ea; }
.svc-hero__media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.svc-hero__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 58%,rgba(15,17,19,.5) 100%); pointer-events:none; }
.svc-hero__media figcaption { position:absolute; z-index:1; left:var(--space-4); bottom:var(--space-4); display:flex; gap:.65rem; color:white; text-transform:uppercase; font-size:.66rem; line-height:1.45; letter-spacing:.22em; font-weight:600; }
.svc-hero__media figcaption i { width:23px; height:3px; display:block; flex:0 0 auto; background:var(--accent-500); transform:rotate(-52deg); margin-top:.45rem; }

.svc-section-head .copy { justify-self:end; }
/* C02 always shows its whole 16:9 frame: no cover crop at any width. */
.svc-process__media { margin:0; aspect-ratio:16/9; overflow:hidden; border-radius:var(--radius-md); background:var(--ink-150); }
.svc-process__media img { width:100%; height:100%; object-fit:contain; }
.svc-steps { list-style:none; margin:var(--space-4) 0 0; padding:0; display:grid; grid-template-columns:repeat(var(--steps,5),minmax(0,1fr)); gap:var(--grid-gap); }
.svc-badge { display:inline-block; margin-left:.5rem; padding:.2rem .5rem; border:1px solid currentColor; border-radius:var(--radius-pill); font-size:.6rem; letter-spacing:.1em; vertical-align:middle; }
.svc-step { position:relative; padding:var(--space-3) var(--space-3) var(--space-4) 0; border-top:1px solid var(--ink-950); }
.svc-step:not(:last-child)::after { content:"→"; position:absolute; right:0; top:var(--space-3); color:var(--ink-500); font-size:.9rem; }
.svc-step__number { color:var(--accent-500); font-size:var(--text-xs); font-weight:700; }
.svc-step h3 { margin:.5rem 0 .45rem; font-size:var(--text-lg); line-height:1.05; letter-spacing:-.035em; font-weight:500; }
.svc-step p { margin:0; color:var(--text-secondary); font-size:var(--text-sm); line-height:1.4; }

.svc-deliverables { border-top:1px solid var(--border-subtle); }
.svc-deliverables__grid { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(1.5rem,3.5vw,4.5rem); align-items:start; }
.svc-deliverables__intro { display:flex; flex-direction:column; gap:var(--space-3); }
.svc-deliverables__intro .h2 { font-size:clamp(2rem,3vw,3.25rem); }
.svc-deliverables__media { margin:var(--space-3) 0 0; aspect-ratio:3/2; overflow:hidden; border-radius:var(--radius-md); background:var(--ink-150); }
.svc-deliverables__media img { width:100%; height:100%; object-fit:cover; }
.svc-deliverable-grid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--grid-gap); align-self:end; }
.svc-deliverable { min-height:clamp(150px,13vw,190px); padding:var(--space-4); display:flex; flex-direction:column; background:linear-gradient(145deg,#fff,#f4f5f5); }
.svc-deliverable__number { color:var(--accent-500); font-size:var(--text-xs); font-weight:700; }
.svc-deliverable h3 { margin:auto 0 .45rem; padding-top:var(--space-5); font-size:var(--text-lg); line-height:1.05; letter-spacing:-.035em; font-weight:500; }
.svc-deliverable p { margin:0; color:var(--text-secondary); font-size:var(--text-sm); line-height:1.4; }

.svc-next-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--grid-gap); }
.svc-next { position:relative; overflow:hidden; display:flex; flex-direction:column; min-width:0; background:white; transition:transform var(--duration-base) var(--ease-standard), box-shadow var(--duration-base) var(--ease-standard); }
a.svc-next:hover { transform:translateY(-2px); box-shadow:var(--shadow-float); }
.svc-next__media { aspect-ratio:4/3; overflow:hidden; background:var(--ink-150); }
.svc-next__media img { width:100%; height:100%; object-fit:cover; }
.svc-next__media--soon { display:flex; flex-direction:column; justify-content:space-between; padding:var(--space-4); background:var(--ink-800); color:#d7dade; }
.svc-next__media--soon span:last-child { align-self:flex-start; padding:.35rem .6rem; border:1px solid color-mix(in srgb,white 30%,transparent); border-radius:var(--radius-pill); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; }
.svc-next__body { position:relative; flex:1; padding:var(--space-3) 2.6rem var(--space-4) var(--space-3); }
.svc-next h3 { margin:0 0 .4rem; font-size:var(--text-md); line-height:1.1; letter-spacing:-.025em; font-weight:500; }
.svc-next p { margin:0; color:var(--text-secondary); font-size:var(--text-xs); line-height:1.42; }
.svc-next--soon { background:var(--ink-950); color:var(--text-on-dark); }
.svc-next--soon p { color:#aeb4ba; }
.svc-next .card-arrow { position:absolute; right:var(--space-3); bottom:var(--space-3); }

.svc-closing .closing-band { grid-template-columns:minmax(0,1fr) auto; }
.svc-closing .svc-closing__actions { flex-wrap:wrap; justify-content:flex-start; }

@media (max-width:1100px) {
  .svc-hero__grid { grid-template-columns:minmax(15rem,4.6fr) minmax(0,5.4fr); gap:var(--space-5); }
  .svc-hero__copy .h1 { font-size:clamp(2.65rem,5vw,4.35rem); }
  .svc-steps { gap:.9rem; }
  .svc-step { padding-right:1.4rem; }
  .svc-step p { font-size:var(--text-xs); }
  .svc-next-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:860px) {
  .svc-hero__grid { grid-template-columns:1fr; }
  .svc-hero__copy { max-width:640px; }
  .svc-hero__copy .h1 { font-size:var(--text-3xl); }
  .svc-section-head .copy { justify-self:start; grid-column:1/-1; }
  .svc-steps { grid-template-columns:1fr; gap:0; margin-top:var(--space-5); }
  .svc-step { display:grid; grid-template-columns:3rem minmax(0,10rem) minmax(0,1fr); align-items:baseline; gap:.8rem; padding:1rem 0; border-top:1px solid var(--border-subtle); }
  .svc-step:last-child { border-bottom:1px solid var(--border-subtle); }
  .svc-step:not(:last-child)::after { display:none; }
  .svc-step h3 { margin:0; }
  .svc-deliverables__grid { grid-template-columns:1fr; }
  .svc-deliverables__intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:var(--space-5); align-items:start; }
  .svc-deliverables__intro > :not(.svc-deliverables__media) { grid-column:1; }
  .svc-deliverables__media { grid-column:2; grid-row:1 / span 3; margin:0; }
  .svc-closing .closing-band { grid-template-columns:1fr; }
}

@media (max-width:599px) {
  .svc-hero { padding-top:.7rem; }
  .svc-hero__copy { gap:.82rem; }
  .svc-hero__copy .h1 { font-size:clamp(2.45rem,12vw,3.4rem); line-height:.91; }
  .svc-hero__lede { font-size:var(--text-sm); }
  .svc-hero__actions { width:100%; display:grid; grid-template-columns:1fr auto; }
  .svc-hero__actions .button { padding-inline:.85rem; }
  .svc-hero__tags { font-size:.6rem; letter-spacing:.1em; }
  .svc-hero__tags li:not(:last-child)::after { margin-inline:.45rem; }
  .svc-hero__media { width:calc(100% + 2rem); margin-left:-1rem; border-radius:0; }
  .svc-hero__media figcaption { left:1rem; bottom:1rem; font-size:.57rem; }
  .svc-process__media { width:calc(100% + 2rem); margin-left:-1rem; border-radius:0; }
  .svc-step { grid-template-columns:2.2rem minmax(0,1fr); row-gap:.2rem; }
  .svc-step p { grid-column:2; }
  .svc-deliverables__intro { display:flex; }
  .svc-deliverable-grid { grid-template-columns:1fr; gap:.5rem; }
  .svc-deliverable { min-height:0; padding:1rem; display:grid; grid-template-columns:2.2rem minmax(0,1fr); row-gap:.2rem; }
  .svc-deliverable h3 { margin:0; padding:0; font-size:var(--text-md); }
  .svc-deliverable p { grid-column:2; font-size:var(--text-xs); }
  .svc-next-grid { grid-template-columns:1fr; gap:.5rem; }
  .svc-next { display:grid; grid-template-columns:40% minmax(0,1fr); border-radius:var(--radius-sm); }
  .svc-next__media { align-self:center; }
  .svc-next__media--soon { padding:.7rem; align-self:stretch; aspect-ratio:auto; }
  .svc-next__media--soon .line-icon { width:24px; height:24px; }
  .svc-next__body { display:flex; flex-direction:column; justify-content:center; padding:.7rem 2.4rem .7rem .8rem; }
  .svc-next h3 { font-size:.96rem; }
  .svc-next .card-arrow { right:.8rem; bottom:auto; top:50%; transform:translateY(-50%); }
  .svc-closing .closing-band__meta { display:grid; grid-template-columns:1fr; gap:.6rem; }
  .svc-closing .button { width:100%; }
}

/* Simple page hero (Work, 404) */
.page-hero { padding-block:clamp(2.4rem,1.2rem + 4vw,5.5rem) clamp(1rem,.6rem + 1.5vw,2rem); }
.page-hero__grid { display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:var(--space-6); align-items:end; }
.page-hero .h1 { font-size:clamp(2.6rem,1.4rem + 4.2vw,5.45rem); }
.page-hero__lede { font-size:var(--text-lg); max-width:40ch; }
.page-hero--center .container { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-4); min-height:45vh; justify-content:center; }

/* Work */
.work-grid--feature { grid-template-columns:repeat(2,minmax(0,1fr)); }
.work-grid--feature .work-card__body { padding:var(--space-4); }
.work-grid--feature .work-card__body h3 { font-size:var(--text-md); }

/* Contact */
.contact__grid { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:clamp(1.5rem,4vw,5rem); align-items:start; }
.contact__intro { display:flex; flex-direction:column; gap:var(--space-4); }
.contact__intro .h1 { font-size:clamp(2.6rem,1.4rem + 4.2vw,5.45rem); }
.contact__lede { font-size:var(--text-lg); max-width:36ch; }
.contact__next { list-style:none; margin:var(--space-3) 0 0; padding:0; border-top:1px solid var(--border-subtle); }
.contact__next li { display:grid; grid-template-columns:2.4rem minmax(0,1fr); gap:.6rem; padding:.9rem 0; border-bottom:1px solid var(--border-subtle); }
.contact__next span { color:var(--accent-500); font-size:var(--text-xs); font-weight:700; padding-top:.15rem; }
.contact__next strong { display:block; font-weight:500; }
.contact__next small { display:block; margin-top:.15rem; color:var(--text-secondary); font-size:var(--text-xs); }
.contact-form { padding:clamp(1.2rem,.8rem + 1.6vw,2.4rem); display:grid; gap:var(--space-4); background:white; }
.field { display:grid; gap:.4rem; }
.field label { font-size:var(--text-sm); font-weight:600; }
.field label span { color:var(--text-secondary); font-weight:400; }
.field input, .field select, .field textarea { width:100%; min-height:48px; padding:.75rem .85rem; border:1px solid color-mix(in srgb,var(--ink-950) 18%,transparent); border-radius:var(--radius-sm); background:var(--surface-page); color:var(--text-primary); font-size:16px; }
.field textarea { resize:vertical; min-height:130px; }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { outline:2px solid var(--focus-ring); outline-offset:1px; border-color:var(--ink-950); }
.field input:user-invalid, .field textarea:user-invalid { border-color:var(--accent-600); }
.contact-form .button { justify-self:start; }
.contact-form__status { margin:0; min-height:1.4em; color:var(--ink-800); font-size:var(--text-sm); }

@media (max-width:860px) {
  .page-hero__grid { grid-template-columns:1fr; gap:var(--space-4); }
  .contact__grid { grid-template-columns:1fr; }
  .contact__intro { max-width:640px; }
  .svc-steps--plain { grid-template-columns:1fr; }
}

@media (max-width:599px) {
  .work-grid--feature { grid-template-columns:1fr; }
  .page-hero__lede, .contact__lede { font-size:var(--text-md); }
  .contact-form .button { justify-self:stretch; }
}

@media (min-width:600px) {
  .svc-deliverable-grid:has(> li:nth-child(3):last-child) { grid-template-columns:repeat(3,minmax(0,1fr)); }
}