/* Production Solutions - preview build
   Design taken from the approved homepage mockup, extended for the full site.
   Brand tokens per the Production Solutions design reference. */

@font-face{font-family:"Ubuntu";src:url("../assets/fonts/Ubuntu-Light.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Ubuntu";src:url("../assets/fonts/Ubuntu-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Ubuntu";src:url("../assets/fonts/Ubuntu-Italic.ttf") format("truetype");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Ubuntu";src:url("../assets/fonts/Ubuntu-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Ubuntu";src:url("../assets/fonts/Ubuntu-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}

:root{
  --ps-charcoal:#2D2D2D; --ps-ink-900:#1A1A1A; --ps-ink-800:#232323; --ps-ink-600:#3A3A3A;
  --ps-ink-500:#4A4A4A; --ps-ink-400:#6E6E6E; --ps-ink-300:#9A9A9A; --ps-ink-200:#C8C8C8;
  --ps-ink-100:#E4E4E4; --ps-ink-050:#F2F2F2;
  --ps-blue:#3E7ABE; --ps-green:#60C08C;
  --ps-gradient:linear-gradient(115deg,#27E397 0%,#0281F2 100%);
  --shadow-md:0 8px 24px rgba(45,45,45,.10); --shadow-lg:0 18px 48px rgba(45,45,45,.14);
  --shadow-glow-green:0 8px 28px rgba(39,227,151,.28);
  --ring-focus:0 0 0 3px rgba(62,122,190,.35);
  --container:1200px; --narrow:760px;
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-std:cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"Ubuntu",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;color:var(--ps-charcoal);background:#FFF;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
.narrow{max-width:var(--narrow)}


/* nav */
.nav{position:sticky;top:0;z-index:100;background:rgba(45,45,45,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.nav-inner{max-width:var(--container);margin:0 auto;padding:0 24px;height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-logo img{height:44px;width:auto}
.nav-links{display:flex;align-items:center;gap:30px;list-style:none}
.nav-links a{color:#FFF;text-decoration:none;font-size:14px;font-weight:500;letter-spacing:.04em;position:relative;padding:4px 0}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--ps-gradient);transition:width 200ms var(--ease-std)}
.nav-links a:hover::after,.nav-links a[aria-current]::after{width:100%}
.nav-right{display:flex;align-items:center;gap:20px}
.lang{display:flex;gap:2px;font-size:12px;font-weight:500;letter-spacing:.08em}
.lang a{color:rgba(255,255,255,.55);text-decoration:none;padding:4px 6px;border-radius:4px}
.lang a.active{color:#FFF;background:rgba(255,255,255,.12)}
.lang a:hover{color:#FFF}
.nav-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;flex:0 0 auto}
.nav-toggle span{display:block;width:22px;height:2px;background:#FFF;border-radius:2px;
  transition:transform 220ms var(--ease-std),opacity 160ms var(--ease-std)}
.nav.open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.open .nav-toggle span:nth-child(2){opacity:0}
.nav.open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;font-family:inherit;font-weight:500;letter-spacing:.04em;text-decoration:none;cursor:pointer;border:none;transition:transform 200ms var(--ease-std),box-shadow 200ms var(--ease-std)}
.btn:active{transform:scale(.98)}
.btn-lg{height:54px;padding:0 32px;font-size:16px}
.btn-md{height:44px;padding:0 26px;font-size:14px}
.btn-primary{background:var(--ps-gradient);color:#FFF}
.btn-primary:hover{box-shadow:var(--shadow-glow-green);transform:translateY(-2px)}
.btn-inverse-outline{background:transparent;color:#FFF;border:2px solid rgba(255,255,255,.55)}
.btn-inverse-outline:hover{border-color:#FFF}
.btn-outline{background:transparent;color:var(--ps-charcoal);border:2px solid var(--ps-ink-200)}
.btn-outline:hover{border-color:var(--ps-blue);color:var(--ps-blue)}
.btn:focus-visible{outline:none;box-shadow:var(--ring-focus)}

/* type helpers */
.eyebrow{font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.accent-rule{width:64px;height:3px;background:var(--ps-gradient);border-radius:2px;margin:20px 0 24px}
.accent-rule.center{margin-left:auto;margin-right:auto}

/* page hero */
.phero{position:relative;background:#1A1A1A center 40%/cover no-repeat;color:#FFF;display:flex;align-items:flex-end;min-height:56vh}
.phero.tall{min-height:92vh}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,26,26,.42) 0%,rgba(26,26,26,.30) 30%,rgba(26,26,26,.80) 66%,rgba(26,26,26,.95) 100%)}
.phero-content{position:relative;z-index:1;max-width:var(--container);margin:0 auto;padding:120px 24px 72px;width:100%}
.phero .eyebrow{color:rgba(255,255,255,.75);margin-bottom:18px}
.phero h1{font-size:clamp(34px,5vw,64px);font-weight:700;line-height:1.08;letter-spacing:-.02em;max-width:900px}
.phero.tall h1{font-size:clamp(38px,5.5vw,76px);max-width:820px}
.phero p{font-size:18px;line-height:1.65;color:rgba(255,255,255,.86);max-width:660px;margin:22px 0 34px}
.phero-ctas{display:flex;gap:16px;flex-wrap:wrap}

/* stats */
.stats{background:#1A1A1A;color:#FFF;padding:64px 0}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;text-align:center}
.stat-value{font-size:clamp(40px,4.5vw,56px);font-weight:700;line-height:1.08;letter-spacing:-.02em;background:var(--ps-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat-label{font-size:14px;color:rgba(255,255,255,.65);margin-top:8px;letter-spacing:.04em}
.stats-note{text-align:center;color:rgba(255,255,255,.45);font-size:13px;margin-top:28px}

/* sections */
section{padding:96px 0}
section.tight{padding:64px 0}
.section-head{max-width:var(--narrow);margin-left:auto;margin-right:auto}
.section-head.flush{margin-left:0;margin-right:0}
.section-head.center{margin:0 auto;text-align:center}
.section-head .eyebrow{color:var(--ps-blue)}
.section-head h2,.section-head h1{font-size:clamp(28px,3.5vw,34px);font-weight:700;line-height:1.2;letter-spacing:-.01em;margin-top:12px}
.section-head p{color:var(--ps-ink-500);margin-top:0}
.dark{background:var(--ps-charcoal);color:#FFF}
.dark .section-head .eyebrow{color:var(--ps-green)}
.dark .section-head p{color:rgba(255,255,255,.80)}
.subtle{background:var(--ps-ink-050)}

/* prose */
.prose{max-width:var(--narrow);margin-left:auto;margin-right:auto}
.prose h2{font-size:clamp(26px,3.2vw,32px);font-weight:700;line-height:1.2;letter-spacing:-.01em;margin:56px 0 4px}
.prose h2:first-child{margin-top:0}
.prose h2 + .accent-rule{margin:16px 0 22px}
.prose h3{font-size:20px;font-weight:700;line-height:1.3;margin:36px 0 10px}
.prose p{margin-bottom:18px;font-size:17px}
.prose p strong{font-weight:700}
.prose ul{margin:0 0 18px 22px}
.prose li{margin-bottom:8px}
.prose a{color:var(--ps-blue);text-decoration:none;border-bottom:1px solid rgba(62,122,190,.35)}
.prose a:hover{border-color:var(--ps-blue)}
.case-link{margin:22px 0 0;font-size:16px;font-weight:500}
.case-link a{display:inline-flex;align-items:center;gap:8px}
.case-link a::after{content:"\2192";font-weight:400}
.dark .case-link a{color:#FFF;border-bottom-color:rgba(255,255,255,.45)}
.dark .case-link a:hover{border-bottom-color:#FFF}
.prose .lede{font-size:20px;line-height:1.6;color:var(--ps-ink-500)}
.dateline{font-size:14px;color:var(--ps-ink-400);margin:0 0 26px}

/* ---------- bottom call to action, phones only ---------- */
.mobile-cta{display:none}
@media(max-width:700px){
  .mobile-cta{
    display:flex;align-items:center;justify-content:center;
    position:fixed;left:14px;right:14px;z-index:120;
    bottom:calc(14px + env(safe-area-inset-bottom));
    height:52px;border-radius:999px;
    background:var(--ps-gradient);color:#FFF;
    font-family:inherit;font-size:16px;font-weight:500;letter-spacing:.02em;
    text-decoration:none;box-shadow:0 8px 26px rgba(0,0,0,.30);
    transition:transform 260ms var(--ease-out),opacity 200ms var(--ease-std);
  }
  .mobile-cta:active{transform:scale(.98)}
  /* out of the way when a call to action is already on screen */
  .mobile-cta.away{transform:translateY(120%);opacity:0;pointer-events:none}
  /* so the bar never covers the last line of the footer */
  body{padding-bottom:78px}
}
@media(prefers-reduced-motion:reduce){.mobile-cta{transition:none}}
.eml a{color:var(--ps-blue);text-decoration:none;border-bottom:1px solid rgba(62,122,190,.35)}
.contact-details .eml a{color:#FFF;border-bottom-color:rgba(255,255,255,.35)}
.dark .prose{color:rgba(255,255,255,.85)}
.dark .prose h2,.dark .prose h3{color:#FFF}

/* offer blocks */
.offer{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:40px}
.offer-item{background:#FFF;border:1px solid var(--ps-ink-100);border-radius:16px;box-shadow:var(--shadow-md);padding:28px}
.offer-item h3{font-size:18px;font-weight:700;margin-bottom:8px}
.offer-item p{font-size:15px;color:var(--ps-ink-500);line-height:1.6}
.dark .offer-item{background:var(--ps-ink-600);border-color:rgba(255,255,255,.20);box-shadow:none}
.dark .offer-item p{color:rgba(255,255,255,.78)}

/* service cards */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.svc-grid.two{grid-template-columns:repeat(2,1fr);max-width:816px;margin-left:auto;margin-right:auto}
.svc-card{background:#FFF;border:1px solid var(--ps-ink-100);border-radius:16px;box-shadow:var(--shadow-md);overflow:hidden;display:flex;flex-direction:column;transition:transform 200ms var(--ease-std),box-shadow 200ms var(--ease-std);text-decoration:none;color:inherit}
.svc-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.svc-media{height:200px;overflow:hidden;background:var(--ps-ink-050)}
.svc-media img{width:100%;height:100%;object-fit:cover;transition:transform 400ms var(--ease-out)}
.svc-card:hover .svc-media img{transform:scale(1.03)}
.svc-body{padding:26px 26px 30px;display:flex;flex-direction:column;gap:10px;flex:1}
.svc-body h3{font-size:20px;font-weight:700;line-height:1.2}
.svc-body p{font-size:14px;line-height:1.6;color:var(--ps-ink-500)}
.svc-link{margin-top:auto;padding-top:12px;font-size:14px;font-weight:500;color:var(--ps-blue);letter-spacing:.04em}

/* figure */
.figure{margin:40px 0}
.figure img{border-radius:10px;width:100%}
.figure figcaption{font-size:13px;color:var(--ps-ink-400);margin-top:10px}
.dark .figure figcaption{color:rgba(255,255,255,.55)}
.media-band img{width:100%;height:clamp(260px,42vh,460px);object-fit:cover}

/* about split */
.split{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:center}
.split-media{border-radius:10px;overflow:hidden;height:460px}
.split-media img{width:100%;height:100%;object-fit:cover}
.split-caption{font-size:13px;color:rgba(255,255,255,.55);margin-top:12px;line-height:1.5}

/* clients + quotes */
.client-row{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 40px;margin-top:40px}
.client-row span{font-size:15px;font-weight:500;letter-spacing:.06em;color:var(--ps-ink-400);text-transform:uppercase}
.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
/* column layout so the attributions sit on one baseline across the row, however
   different the quote lengths are. Without it a five-line quote pushes its name
   40px below the two beside it and the row reads as ragged. */
.quote-card{background:#FFF;border:1px solid var(--ps-ink-100);border-radius:16px;box-shadow:var(--shadow-md);padding:32px;display:flex;flex-direction:column}
.quote-card blockquote{font-size:16px;line-height:1.65}
/* Translated testimonials. The client's own words stay in the language they
   said them in; the translation sits underneath as a clearly marked aid. */
.quote-tr{display:block;margin-top:14px;padding-top:14px;border-top:1px solid var(--ps-ink-100);font-style:italic;color:var(--ps-ink-500)}
.quote-tr-label{display:block;font-style:normal;font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ps-ink-400);margin-bottom:6px}
.pullquote .quote-tr{border-top-color:rgba(255,255,255,.18)}
.quote-card figcaption{margin-top:auto;padding-top:24px;font-size:13px;color:var(--ps-ink-400)}
.quote-card figcaption strong{display:block;font-size:14px;font-weight:500;color:var(--ps-charcoal)}

/* featured quote, case studies. Deliberately not a card: a card reads as one of
   several, and the whole point of this one is that it is the only quote on the
   page, so it gets the width and the type size instead of a border. */
.pullquote{max-width:var(--narrow);margin:0 auto;position:relative;padding-left:36px}
.pullquote::before{
  content:"\201C";position:absolute;left:-6px;top:-18px;
  font-size:88px;line-height:1;font-weight:700;color:var(--ps-blue);opacity:.30;
}
.pullquote blockquote{
  font-size:clamp(21px,2.4vw,27px);line-height:1.45;font-weight:500;
  letter-spacing:-.01em;color:var(--ps-charcoal);margin:0;
}
.pullquote figcaption{
  margin-top:24px;padding-top:18px;font-size:14px;color:var(--ps-ink-400);
  border-top:3px solid transparent;border-image:var(--ps-gradient) 1;
}
.pullquote figcaption strong{display:block;font-size:16px;font-weight:700;color:var(--ps-charcoal);margin-bottom:2px}
.dark .pullquote blockquote{color:#FFF}
.dark .pullquote::before{color:var(--ps-green);opacity:.44}
.dark .pullquote figcaption{color:rgba(255,255,255,.62)}
.dark .pullquote figcaption strong{color:#FFF}
@media(max-width:700px){
  .pullquote{padding-left:0}
  .pullquote::before{position:static;display:block;font-size:58px;height:36px;margin-bottom:4px}
  .pullquote figcaption{margin-top:18px;padding-top:14px}
}

/* faq */
.faq{margin-top:40px;max-width:var(--narrow);margin-left:auto;margin-right:auto}
.faq details{border-bottom:1px solid var(--ps-ink-100);padding:18px 0}
.faq summary{font-size:17px;font-weight:500;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;font-weight:400;color:var(--ps-blue);line-height:1;flex:0 0 auto}
.faq details[open] summary::after{content:"\2013"}
.faq p{margin-top:12px;color:var(--ps-ink-500);font-size:16px}

/* contact band */
.contact-band{position:relative;background:#1A1A1A center/cover no-repeat;color:#FFF}
.contact-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,26,26,.55) 0%,rgba(26,26,26,.90) 100%)}
.contact-band .container{position:relative;z-index:1}
.contact-grid{display:grid;grid-template-columns:6fr 6fr;gap:64px;align-items:start}
.contact-band h2{font-size:clamp(28px,3.5vw,34px);font-weight:700;line-height:1.2;letter-spacing:-.01em;margin-top:12px}
.contact-band .eyebrow{color:rgba(255,255,255,.75)}
.contact-info p{color:rgba(255,255,255,.85)}
.contact-details{margin-top:32px;display:flex;flex-direction:column;gap:12px;font-size:15px}
.contact-details a{color:#FFF;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35)}
.contact-details a:hover{border-color:#FFF}
.contact-details span{color:rgba(255,255,255,.60)}
.form-card{background:#FFF;border-radius:16px;box-shadow:var(--shadow-lg);padding:40px;color:var(--ps-charcoal)}
.field{margin-bottom:20px}
.field label{display:block;font-size:13px;font-weight:500;margin-bottom:6px}
.field input,.field textarea{width:100%;font-family:inherit;font-size:15px;padding:12px 14px;border:1px solid var(--ps-ink-200);border-radius:6px;color:var(--ps-charcoal);background:#FFF}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--ps-blue);box-shadow:var(--ring-focus)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-note{font-size:12px;color:var(--ps-ink-400);margin-top:16px}
.field [aria-invalid="true"]{border-color:#B3261E}
.field-error,.form-error{font-size:13px;color:#B3261E;margin:6px 0 0}
.form-error{margin:0 0 16px}
.form-card button[disabled]{opacity:.65;cursor:progress}

/* cta band */
.cta-band{background:var(--ps-charcoal);color:#FFF;text-align:center}
.cta-band h2{font-size:clamp(28px,3.5vw,34px);font-weight:700;line-height:1.2;letter-spacing:-.01em}
.cta-band p{color:rgba(255,255,255,.80);max-width:620px;margin:16px auto 32px}

/* at a glance */
.glance{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:8px}
.glance div{border-top:3px solid transparent;border-image:var(--ps-gradient) 1;padding-top:14px}
.glance dt{font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ps-ink-400);margin-bottom:6px}
.glance dd{font-size:15px;line-height:1.5}
.glance.six{grid-template-columns:repeat(3,1fr)}

/* ---------- kit table, case studies ---------- */
.kit-table{width:100%;border-collapse:collapse;margin:32px 0 8px;font-size:16px}
.kit-table th,.kit-table td{text-align:left;vertical-align:top;padding:14px 0;border-bottom:1px solid var(--ps-ink-100)}
.kit-table tr:first-child th,.kit-table tr:first-child td{border-top:1px solid var(--ps-ink-100)}
.kit-table th{width:34%;padding-right:24px;font-weight:700;color:var(--ps-charcoal)}
.kit-table td{color:var(--ps-ink-500)}
.subtle .kit-table th,.subtle .kit-table td{border-color:var(--ps-ink-200)}
@media(max-width:700px){
  .kit-table,.kit-table tbody,.kit-table tr,.kit-table th,.kit-table td{display:block;width:auto}
  .kit-table tr{padding:14px 0;border-bottom:1px solid var(--ps-ink-100)}
  .kit-table th,.kit-table td{border:0;padding:0}
  .kit-table th{margin-bottom:4px}
  .kit-table tr:first-child th{border-top:0}
}

/* footer */
footer{background:#1A1A1A;color:rgba(255,255,255,.70);padding:64px 0 40px;font-size:14px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;align-items:start}
.footer-grid img{height:52px;width:auto;margin-bottom:16px}
footer h4{color:#FFF;font-size:13px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px}
footer ul{list-style:none;display:flex;flex-direction:column;gap:10px}
footer a{color:rgba(255,255,255,.70);text-decoration:none}
footer a:hover{color:#FFF}
.footer-bottom{border-top:1px solid rgba(255,255,255,.20);margin-top:48px;padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12px;color:rgba(255,255,255,.45)}

/* reveal */
.reveal{opacity:0;transform:translateY(16px);transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* video facade */
.vfacade{position:relative;border-radius:10px;overflow:hidden;background:var(--ps-ink-900);cursor:pointer}
.vfacade img{width:100%;display:block;opacity:.65}
.vfacade .play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#FFF;text-align:center;padding:24px}
.vfacade .play span{font-size:13px;color:rgba(255,255,255,.8);max-width:340px}
.vfacade .disc{width:72px;height:72px;border-radius:999px;background:var(--ps-gradient);display:grid;place-items:center}

/* ============================================================ RESPONSIVE
   Tablet landscape and below: the desktop nav collapses into a menu.
   Everything from here down is ordered widest first.                      */

@media(max-width:1080px){
  .split,.contact-grid,.offer{grid-template-columns:1fr}
  .glance,.glance.six{grid-template-columns:1fr 1fr}
  .split-media{height:340px}
}

@media(max-width:960px){
  .svc-grid,.quote-grid{grid-template-columns:1fr 1fr}
  .svc-grid.two{max-width:none}
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px}
  section{padding:64px 0}
  .split-media{height:300px}
  .phero-content{padding:96px 24px 56px}

  /* the menu */
  .nav-inner{gap:12px}
  .nav-toggle{display:flex}
  .nav-links{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:#1F1F1F;
    padding:6px 0 10px;border-top:1px solid rgba(255,255,255,.10);
    box-shadow:0 18px 44px rgba(0,0,0,.42);
  }
  .nav.open .nav-links{display:flex}
  .nav-links li{width:100%}
  .nav-links a{display:block;padding:15px 24px;font-size:16px}
  .nav-links a::after{display:none}
  .nav-links a[aria-current]{background:rgba(255,255,255,.08);box-shadow:inset 3px 0 0 var(--ps-green)}
}

/* Tablet portrait */
@media(max-width:820px){
  .stats-grid{gap:24px}
  .media-band img{height:clamp(200px,30vh,320px)}
  .duo img{height:210px}
}

/* Phone */
@media(max-width:700px){
  section{padding:52px 0}
  .container{padding:0 20px}
  .svc-grid,.quote-grid{grid-template-columns:1fr;margin-top:36px}
  .svc-grid.two{grid-template-columns:1fr}
  .glance,.glance.six,.footer-grid{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:1fr;gap:26px}
  .stats{padding:44px 0}

  .nav-cta{display:none}          /* Contact is in the menu */
  .lang a{padding:8px 8px}
  .nav-logo img{height:38px}

  .phero{min-height:auto}
  .phero.tall{min-height:76vh}
  .phero-content{padding:72px 20px 44px}
  .phero p{font-size:16px;margin:16px 0 26px}
  .phero-ctas{gap:12px;width:100%}
  .phero-ctas .btn{width:100%}

  .btn-lg{height:50px;padding:0 24px;font-size:15px}
  .split-media{height:230px}
  .media-band img{height:clamp(170px,24vh,240px)}
  .band-cap{font-size:12px;padding:10px 20px 0}

  .form-card{padding:24px 20px;border-radius:12px}
  /* 16px stops iOS zooming the page when a field is focused */
  .field input,.field textarea{font-size:16px;padding:13px 14px}
  .field{margin-bottom:16px}

  .prose p,.prose li{font-size:16px}
  .prose h2{margin:44px 0 4px}
  .figure{margin:28px 0}
  .duo{margin:28px 0;gap:16px}
  .faq summary{font-size:16px}
}

/* Small phone */
@media(max-width:400px){
  .container{padding:0 16px}
  .phero-content{padding:64px 16px 40px}
  .stat-value{font-size:40px}
  .logo{height:78px}
}

/* ---------- client logo row ---------- */
.logo-row{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 24px;margin-top:44px;align-items:center;justify-items:center}
.logo{position:relative;width:100%;height:96px;display:grid;place-items:center;padding:10px;border-radius:10px}
.logo img{object-fit:contain;max-width:100%;height:auto!important;filter:grayscale(1) opacity(.66);transition:filter 220ms var(--ease-std)}
.logo:hover img{filter:grayscale(0) opacity(1)}
.logo-tip{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ps-ink-300);opacity:0;transition:opacity 200ms var(--ease-std);white-space:nowrap}
.logo:hover .logo-tip{opacity:1}
@media(max-width:960px){.logo-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.logo-row{grid-template-columns:repeat(2,1fr)}}