/* ==========================================================================
   114 Safety Consultants — site stylesheet
   Brand: deep navy #011545 with the logo's navy #2D386E and red #B60A08. Type: Archivo.
   Motif: a red line that rises at 60°, echoing the logo's triangle mark.
   ========================================================================== */

:root{
  --navy-950:#000C2E;
  --navy-900:#011545;
  --navy-800:#0A2260;
  --navy-700:#16307A;
  --navy-600:#284699;
  --navy-100:#DCE3F2;
  --red-500:#E3201B;   /* accents on dark backgrounds */
  --red-600:#B60A08;   /* logo red: buttons, links, icons on light */
  --red-700:#930806;
  --ink:#0A1433;
  --text:#384260;
  --muted:#586281;
  --line:#DDE3EE;
  --line-strong:#C3CCDD;
  --bg:#FFFFFF;
  --bg-soft:#F4F6FB;
  --bg-tint:#EAEFF9;
  --on-dark:#FFFFFF;
  --on-dark-muted:rgba(255,255,255,.76);
  --on-dark-soft:rgba(255,255,255,.62);
  --success:#0B7A43;
  --focus:#2F6FED;

  --font:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --container:1200px;
  --gutter:clamp(16px,4vw,32px);
  --radius-sm:8px;
  --radius:12px;
  --radius-lg:16px;
  --shadow-sm:0 1px 2px rgba(1,21,69,.06),0 2px 8px -2px rgba(1,21,69,.06);
  --shadow:0 18px 40px -18px rgba(1,21,69,.28),0 4px 10px -4px rgba(1,21,69,.08);
  --shadow-lg:0 34px 70px -28px rgba(1,21,69,.45);
  --ease:cubic-bezier(.2,.7,.2,1);
  --header-h:92px;
  --hero-media:min(50vw,920px);
  --rise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 12'%3E%3Cpath d='M0 10.25h31.6l4.9-8.5' fill='none' stroke='%23E3201B' stroke-width='3.5'/%3E%3C/svg%3E");
  color-scheme:light;
}

/* --- Base -------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
body{margin:0;font-family:var(--font);font-size:1.0625rem;line-height:1.65;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,h4{margin:0;color:var(--ink);font-weight:780;line-height:1.1;letter-spacing:-.022em;text-wrap:balance}
h1{font-size:clamp(2.3rem,1rem + 2.9vw,3.6rem);line-height:1.05;letter-spacing:-.028em}
h2{font-size:clamp(1.95rem,1.1rem + 2.1vw,2.85rem);letter-spacing:-.026em}
h3{font-size:1.2rem;font-weight:700;line-height:1.3;letter-spacing:-.012em}
h4{font-size:1.1rem;font-weight:700;line-height:1.3;letter-spacing:-.01em}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
figure{margin:0}
strong{font-weight:700}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.section--navy,.hero,.site-footer,.speak,.cta-banner,.faq-cta{--focus:#FFFFFF}
::selection{background:var(--navy-900);color:#fff}

.container{width:min(100% - 2 * var(--gutter),var(--container));margin-inline:auto}
.skip-link{position:absolute;left:1rem;top:-100px;z-index:200;padding:.75rem 1rem;border-radius:var(--radius-sm);background:var(--navy-900);color:#fff;font-weight:700;text-decoration:none}
.skip-link:focus{top:1rem}
.icon{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.icon-wa{width:24px;height:24px;flex:none;fill:currentColor}

/* --- Brand motif ------------------------------------------------------------- */
.rise{display:block;width:40px;height:12px;margin-bottom:1.15rem;background:var(--rise) no-repeat left center/contain}
.kicker{display:flex;align-items:center;gap:.85rem;margin-bottom:1.15rem;font-size:.8rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;font-stretch:108%;color:var(--navy-700)}
.kicker::before{content:"";flex:none;width:40px;height:12px;background:var(--rise) no-repeat left center/contain}

/* --- Buttons & links --------------------------------------------------------- */
.btn{--btn-bg:var(--red-600);--btn-fg:#fff;--btn-bd:transparent;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:3.25rem;padding:.8rem 1.45rem;border:1.5px solid var(--btn-bd);border-radius:var(--radius-sm);background:var(--btn-bg);color:var(--btn-fg);font-size:1rem;font-weight:700;line-height:1.2;letter-spacing:.005em;text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer;touch-action:manipulation;transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease),box-shadow .25s var(--ease),transform .15s var(--ease)}
.btn .icon{width:1.15em;height:1.15em;stroke-width:2.3;transition:transform .25s var(--ease)}
.btn:hover .icon{transform:translateX(4px)}
.btn:active{transform:translateY(1px)}
.btn--primary{box-shadow:0 10px 22px -12px rgba(182,10,8,.65)}
.btn--primary:hover{--btn-bg:var(--red-700)}
.btn--light{--btn-bg:#fff;--btn-fg:var(--navy-900)}
.btn--light:hover{--btn-bg:#E8EEFA}
.btn--outline-light{--btn-bg:transparent;--btn-fg:#fff;--btn-bd:rgba(255,255,255,.5)}
.btn--outline-light:hover{--btn-bg:rgba(255,255,255,.08);--btn-bd:#fff}
.btn--block{display:flex;width:100%}

.link-arrow{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:1rem;color:var(--navy-900)}
.link-arrow .icon{width:1.15em;height:1.15em;color:var(--red-600);stroke-width:2.3;transition:transform .25s var(--ease)}
.stretched{text-decoration:none;color:inherit}
.stretched::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}

/* --- Header ------------------------------------------------------------------ */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.97);border-bottom:1px solid transparent;transition:box-shadow .25s var(--ease),border-color .25s var(--ease)}
@supports (backdrop-filter:blur(8px)){.site-header{background:rgba(255,255,255,.9);backdrop-filter:saturate(170%) blur(12px)}}
.site-header.is-scrolled{border-color:var(--line);box-shadow:0 10px 30px -22px rgba(1,21,69,.45)}
.header__inner{display:flex;align-items:center;gap:1.25rem;min-height:var(--header-h)}
.brand{flex:none;display:block;border-radius:6px}
.brand img{width:auto;height:74px}
.nav{margin-left:auto}
.nav__list{display:flex;align-items:center;gap:.15rem}
.nav__list a{position:relative;display:block;padding:.65rem .8rem;border-radius:6px;font-size:.97rem;font-weight:600;color:var(--ink);text-decoration:none;transition:color .2s}
.nav__list a::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.25rem;height:3px;border-radius:2px;background:var(--red-600);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav__list a:hover::after,.nav__list a[aria-current="page"]::after{transform:scaleX(1)}
.nav__list a:hover{color:var(--navy-700)}
.header__cta{margin-left:.6rem;min-height:2.95rem;padding:.65rem 1.2rem}
.nav-toggle{display:none;position:relative;width:48px;height:48px;margin-right:-8px;border:0;border-radius:10px;background:transparent;color:var(--navy-900);cursor:pointer}
.nav-toggle__bars,.nav-toggle__bars::before,.nav-toggle__bars::after{position:absolute;left:12px;width:24px;height:2.5px;border-radius:2px;background:currentColor;transition:transform .3s var(--ease),opacity .2s}
.nav-toggle__bars{top:calc(50% - 1.25px)}
.nav-toggle__bars::before,.nav-toggle__bars::after{content:"";left:0}
.nav-toggle__bars::before{top:-7px}
.nav-toggle__bars::after{top:7px}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars{background:transparent}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::before{transform:translateY(7px) rotate(45deg);background:var(--navy-900)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::after{transform:translateY(-7px) rotate(-45deg);background:var(--navy-900)}

.mobile-menu{position:absolute;left:0;right:0;top:100%;max-height:calc(100dvh - var(--header-h));overflow-y:auto;background:#fff;border-top:1px solid var(--line);box-shadow:0 30px 60px -20px rgba(1,21,69,.35),0 0 0 100vmax rgba(1,21,69,.35);clip-path:inset(0 0 -100vmax 0)}
.mobile-menu[hidden]{display:none}
.mobile-menu nav{padding-block:.75rem 1.5rem}
.mobile-menu__list a{display:flex;align-items:center;justify-content:space-between;padding:1rem .25rem;border-bottom:1px solid var(--line);font-size:1.1rem;font-weight:650;color:var(--ink);text-decoration:none}
.mobile-menu__list a[aria-current="page"]{color:var(--red-600)}
.mobile-menu__cta{margin-top:1.25rem}
.mobile-menu__contact{display:grid;gap:.6rem;margin-top:1.25rem;font-weight:600}
.mobile-menu__contact li{display:flex;align-items:center;gap:.65rem;color:var(--navy-900)}
.mobile-menu__contact .icon{width:20px;height:20px;color:var(--red-600)}
.mobile-menu__contact a{text-decoration:none;padding-block:.35rem}
body.menu-open{overflow:hidden}

/* --- Hero ------------------------------------------------------------------- */
.hero{position:relative;isolation:isolate;overflow:hidden;background:var(--navy-900);color:var(--on-dark-muted)}
.hero::before{content:"";position:absolute;inset:0;z-index:-3;background:radial-gradient(56rem 34rem at -8% -18%,rgba(52,98,206,.42),transparent 62%),radial-gradient(38rem 26rem at 32% 118%,rgba(227,32,27,.12),transparent 62%),linear-gradient(180deg,#021B55 0%,#011545 55%,#01113A 100%)}
.hero::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:56px 56px;background-position:-1px -1px;-webkit-mask-image:linear-gradient(100deg,#000 0%,rgba(0,0,0,.55) 32%,transparent 58%);mask-image:linear-gradient(100deg,#000 0%,rgba(0,0,0,.55) 32%,transparent 58%)}
.hero__inner{display:flex;align-items:center;min-height:var(--hero-h,0);padding-block:clamp(3.5rem,6vw,5.5rem)}
.hero__content{position:relative;z-index:1;width:100%;max-width:640px}
.hero h1{color:#fff}
.hero .kicker{color:#C9D4F0}
.hero__tagline{margin-top:1.3rem;font-size:clamp(1.2rem,1rem + .55vw,1.45rem);font-weight:700;line-height:1.35;letter-spacing:-.01em;color:#fff}
.hero__lead{margin-top:1.1rem;font-size:clamp(1.06rem,.98rem + .3vw,1.2rem);line-height:1.62;color:var(--on-dark-muted);max-width:36em}
.hero__tagline + .hero__lead{margin-top:.85rem}
.hero__note{margin-top:1.4rem;padding-left:1rem;border-left:3px solid var(--red-500);font-size:.98rem;line-height:1.6;color:var(--on-dark-soft);max-width:34em}
.hero__actions{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2.1rem}
.hero__media{position:absolute;top:0;right:0;bottom:0;z-index:-1;width:var(--hero-media);clip-path:polygon(15% 0,100% 0,100% 100%,0 100%)}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center;animation:settle 1.6s var(--ease) both}
.hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,21,69,.55) 0%,rgba(1,21,69,0) 42%),linear-gradient(0deg,rgba(1,21,69,.32) 0%,rgba(1,21,69,0) 34%)}
.hero__edge{position:absolute;top:0;right:0;width:var(--hero-media);height:100%;overflow:visible;pointer-events:none}
.hero__edge line{stroke:var(--red-500);stroke-width:5;vector-effect:non-scaling-stroke}
.hero__rule{position:absolute;left:0;bottom:0;height:5px;width:100%;background:var(--red-500)}
.hero--split .hero__rule{width:calc(100% - var(--hero-media))}
.hero--split{--hero-h:clamp(500px,66vh,600px)}
.hero--split .hero__content{max-width:min(560px,calc(50vw - var(--gutter) - 3rem))}
.hero--home{--hero-h:clamp(560px,calc(100vh - 160px),700px)}
.hero--home h1{font-size:clamp(2.3rem,1rem + 3vw,3.7rem)}
.hero--split:not(.hero--home) h1{font-size:clamp(2.15rem,1rem + 2.55vw,3.3rem)}
.hero--plain h1{max-width:18ch}
.hero__mark{position:absolute;z-index:-1;top:50%;right:max(var(--gutter),calc((100% - var(--container)) / 2));height:86%;width:auto;aspect-ratio:669/586;transform:translateY(-50%);pointer-events:none}
.hero__mark-shape{fill:rgba(255,255,255,.04);stroke:rgba(255,255,255,.22);stroke-width:1.25;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.hero--plain .hero__lead{max-width:40em}
@keyframes settle{from{transform:scale(1.06)}to{transform:scale(1)}}

.breadcrumb{margin-bottom:1.6rem;font-size:.9rem}
.breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.breadcrumb li{display:flex;align-items:center;gap:.5rem;color:var(--on-dark-soft)}
.breadcrumb li + li::before{content:"";width:6px;height:6px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);opacity:.7;margin-right:.2rem}
.breadcrumb a{color:#fff;text-decoration:none;font-weight:600}
.breadcrumb a:hover{text-decoration:underline;text-underline-offset:3px}
.breadcrumb [aria-current]{color:var(--on-dark-soft)}

/* --- Notice strip ------------------------------------------------------------ */
.notice{background:var(--bg-tint);border-bottom:1px solid var(--line)}
.notice p{display:flex;align-items:center;justify-content:center;gap:.75rem;padding-block:1.05rem;font-size:1rem;line-height:1.5;color:var(--text);text-align:left}
.notice .icon{width:22px;height:22px;color:var(--red-600)}
.notice strong{color:var(--ink)}

/* --- Sections ---------------------------------------------------------------- */
.section{padding-block:clamp(4.5rem,2.8rem + 5vw,7.5rem)}
.section--soft{background:var(--bg-soft)}
.section--navy{position:relative;isolation:isolate;overflow:hidden;background:var(--navy-900);color:var(--on-dark-muted)}
.section--navy::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(80rem 40rem at 100% 0%,#000,transparent 70%);mask-image:radial-gradient(80rem 40rem at 100% 0%,#000,transparent 70%)}
.section--navy h2,.section--navy h3{color:#fff}
.section--navy .lead,.section--navy .section-head .lead{color:var(--on-dark-muted)}
.section--pillars{padding-block:clamp(3rem,2rem + 3vw,4.5rem) clamp(4rem,3rem + 3vw,5.75rem)}

.section-head{max-width:780px;margin-bottom:clamp(2.25rem,1.6rem + 2vw,3.5rem)}
.section-head .lead,.lead{margin-top:1rem;font-size:clamp(1.08rem,1rem + .3vw,1.22rem);line-height:1.6;color:var(--muted)}
.section-head--split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:1rem 4rem;align-items:end;max-width:none}
.section-head--split .rise,.section-head--split .kicker{grid-column:1/-1;margin-bottom:0}
.section-head--split .lead{margin-top:0;padding-bottom:.3rem}
.section-head--wide{max-width:900px}
.section-head--statement .lead{font-size:clamp(1.3rem,1rem + 1.1vw,1.85rem);line-height:1.35;font-weight:650;letter-spacing:-.015em;color:var(--navy-700);max-width:28em}
.section-actions{display:flex;justify-content:center;margin-top:clamp(2.5rem,2rem + 2vw,3.5rem)}

/* --- Pillars (home) ---------------------------------------------------------- */
.pillars{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2rem)}
.pillar{position:relative;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.pillar__media{position:relative;aspect-ratio:16/7.2;overflow:hidden;background:var(--navy-800)}
.pillar__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.pillar__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,21,69,0) 55%,rgba(1,21,69,.35))}
.pillar__body{position:relative;flex:1;display:flex;flex-direction:column;gap:.75rem;padding:0 clamp(1.5rem,3vw,2.25rem) clamp(1.6rem,3vw,2.1rem)}
.pillar__body .icon-tile{margin-top:-2rem;margin-bottom:.4rem;box-shadow:0 0 0 5px #fff}
.pillar__title{font-size:clamp(1.35rem,1.1rem + .7vw,1.65rem);letter-spacing:-.02em}
.pillar__body p{color:var(--muted);max-width:36em}
.pillar__body .link-arrow{margin-top:auto;padding-top:.35rem}
.pillar:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:transparent}
.pillar:hover .pillar__media img{transform:scale(1.045)}
.pillar:hover .link-arrow .icon{transform:translateX(4px)}

/* --- Cards ------------------------------------------------------------------- */
.grid{display:grid;gap:clamp(1rem,2vw,1.5rem)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.icon-tile{display:inline-grid;place-items:center;flex:none;width:3.5rem;height:3.5rem;border-radius:12px;background:var(--navy-900);color:#F0302A}
.icon-tile .icon{width:26px;height:26px;stroke-width:1.85}
.card{position:relative;display:flex;flex-direction:column;gap:.7rem;padding:clamp(1.5rem,2.2vw,1.9rem);background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.card::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:var(--red-500);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.card .icon-tile{margin-bottom:.55rem}
.card h3{font-size:1.18rem}
.card p{font-size:1rem;line-height:1.6;color:var(--muted)}
.card .link-arrow{margin-top:auto;padding-top:.6rem}
.card--link:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:transparent}
.card--link:hover::before,.card--feature:hover::before{transform:scaleX(1)}
.card--link:hover .link-arrow .icon{transform:translateX(4px)}
.section--soft .card{border-color:#E1E6F0}
.card--feature{padding:clamp(1.6rem,2.6vw,2.2rem)}
.card--feature .icon-tile{width:3.75rem;height:3.75rem}
.card--feature h3{font-size:1.28rem}

/* Outsourcing: 3 + 2 role layout */
.roles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem)}
.roles > *{grid-column:span 2}
.roles > :nth-child(4){grid-column:2 / span 2}
.roles > :nth-child(5){grid-column:4 / span 2}

/* --- Process ----------------------------------------------------------------- */
.process{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:clamp(1.5rem,3vw,2.5rem);counter-reset:step}
.process__step{position:relative}
.process__marker{display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem}
.process__icon,.process__num{position:relative;z-index:1;display:grid;place-items:center;flex:none;border-radius:50%}
.process__icon{width:4.25rem;height:4.25rem;background:#fff;color:var(--red-600);box-shadow:0 0 0 8px rgba(255,255,255,.08)}
.process__icon .icon{width:28px;height:28px;stroke-width:1.85}
.process__num{width:3.25rem;height:3.25rem;background:var(--red-600);color:#fff;font-size:1.25rem;font-weight:800;box-shadow:0 0 0 7px rgba(227,32,27,.16)}
.process__line{position:relative;flex:1;height:2px;margin-right:calc(-1 * clamp(1.5rem,3vw,2.5rem) + .75rem);background:repeating-linear-gradient(90deg,var(--line-strong) 0 8px,transparent 8px 14px)}
.process__line::after{content:"";position:absolute;right:-1px;top:50%;width:9px;height:9px;border-top:2px solid var(--line-strong);border-right:2px solid var(--line-strong);transform:translateY(-50%) rotate(45deg)}
.process__label{display:block;margin-bottom:.45rem;font-size:.82rem;font-weight:700;letter-spacing:.12em;color:var(--red-600)}
.process__step h3{font-size:1.25rem}
.process__step p{margin-top:.55rem;color:var(--muted);max-width:26em}
.process--dark .process__line{background:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 8px,transparent 8px 14px)}
.process--dark .process__line::after{border-color:rgba(255,255,255,.5)}
.process--dark .process__label{color:#FF6B71}
.process--dark .process__step p{color:var(--on-dark-muted)}

/* --- Why work with us ------------------------------------------------------ */
.why{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:clamp(2.5rem,5vw,5.5rem);align-items:center}
.why__media{position:relative;margin:0 0 1.5rem}
.why__media::before{content:"";position:absolute;right:-18px;bottom:-18px;width:58%;height:62%;border-radius:var(--radius-lg);background:repeating-linear-gradient(135deg,rgba(1,21,69,.09) 0 2px,transparent 2px 11px);z-index:-1}
.why__media img{width:100%;aspect-ratio:4/3.05;object-fit:cover;border-radius:var(--radius-lg);box-shadow:var(--shadow)}
.why__badge{position:absolute;left:clamp(-1.5rem,-2vw,-.75rem);bottom:-1.5rem;display:grid;grid-template-columns:auto 1fr;grid-template-areas:"over over" "num text";column-gap:.85rem;row-gap:.3rem;align-items:center;max-width:300px;padding:1.1rem 1.4rem 1.15rem 1.2rem;border-radius:var(--radius);background:var(--navy-900);color:var(--on-dark-muted);box-shadow:var(--shadow-lg)}
.why__badge::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:0 3px 3px 0;background:var(--red-500)}
.why__badge-over{grid-area:over;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#C9D4F0}
.why__badge strong{grid-area:num;font-size:3.4rem;line-height:.9;font-weight:800;letter-spacing:-.04em;color:#fff}
.why__badge-text{grid-area:text;font-size:.95rem;line-height:1.35;font-weight:600;color:#fff}
.features{display:grid;gap:.9rem}
.feature{display:flex;align-items:flex-start;gap:1.1rem;padding:1.2rem 1.35rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);transition:border-color .3s,box-shadow .3s}
.feature:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm)}
.feature .icon-tile{width:3.1rem;height:3.1rem;border-radius:10px}
.feature .icon-tile .icon{width:24px;height:24px}
.feature h3{font-size:1.15rem}
.feature p{margin-top:.25rem;font-size:1rem;color:var(--muted)}

/* --- Projects ---------------------------------------------------------------- */
.project-card{position:relative;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.project-card__media{position:relative;aspect-ratio:2.35/1;overflow:hidden;background:var(--navy-800)}
.project-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.project-card__body{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.3rem 1.5rem}
.project-card h3{font-size:1.28rem}
.project-card--link:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.project-card--link:hover img{transform:scale(1.045)}
.project-card--link:hover .link-arrow .icon{transform:translateX(4px)}
/* --- Projects page: client track record ------------------------------------ */
.section-head--center{margin-inline:auto;text-align:center}
.section-head--center .rise{margin-inline:auto}
.section-head--center .kicker{justify-content:center}
.clients-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem)}
.client-card{position:relative;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);transition:border-color .3s,box-shadow .3s}
.client-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm)}
.client-card__logo{position:relative;display:grid;place-items:center;height:132px;padding:1.25rem 1.5rem;border-bottom:1px solid var(--line);background:#fff}
.client-card__logo::after{content:"";position:absolute;left:1.6rem;bottom:-1px;width:40px;height:3px;background:var(--red-500)}
.client-card__logo img{max-width:100%;height:auto}
.client-card__body{padding:1.35rem 1.6rem 1.6rem}
.client-card h3{font-size:1.15rem;line-height:1.35}
.checklist{margin-top:.85rem}
.checklist li{display:flex;align-items:flex-start;gap:.7rem;padding:.5rem 0;font-size:.98rem;line-height:1.5;color:var(--text)}
.checklist li + li{border-top:1px dashed var(--line)}
.checklist .icon{width:20px;height:20px;margin-top:.12rem;padding:3px;border-radius:50%;background:#FDECEC;color:var(--red-600);stroke-width:3.2}
.logo-wall{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}
.logo-wall li{display:grid;place-items:center;flex:0 1 150px;height:104px;padding:1rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.logo-wall img{max-width:100%;height:auto}

/* --- FAQ --------------------------------------------------------------------- */
.faq{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:clamp(2.5rem,5vw,5.5rem);align-items:start}
.faq__aside{position:sticky;top:calc(var(--header-h) + 2rem)}
.faq__aside .section-head{margin-bottom:0}
.faq__action{margin-top:2rem}
.faq-list{display:grid;gap:.75rem}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);transition:border-color .25s,box-shadow .25s}
.faq-item:hover{border-color:var(--line-strong)}
.faq-item[open]{border-color:var(--navy-100);box-shadow:var(--shadow-sm)}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding:1.15rem 1.35rem;cursor:pointer;list-style:none;font-size:1.06rem;font-weight:700;line-height:1.42;color:var(--ink);border-radius:var(--radius)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item__icon{display:grid;place-items:center;flex:none;width:2.1rem;height:2.1rem;border-radius:50%;background:var(--bg-tint);color:var(--navy-900);transition:transform .3s var(--ease),background-color .25s,color .25s}
.faq-item__icon .icon{width:18px;height:18px;stroke-width:2.4}
.faq-item[open] .faq-item__icon{transform:rotate(45deg);background:var(--red-600);color:#fff}
.faq-item__answer{padding:0 1.35rem 1.3rem;color:var(--text)}
.faq-item__answer p{max-width:62ch}
.faq-item__answer a{color:var(--red-700);font-weight:600}
.faq-item[open] .faq-item__answer{animation:faq-in .35s var(--ease)}
@keyframes faq-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

.faq-cta{position:relative;isolation:isolate;overflow:hidden;margin-top:2.25rem;border-radius:var(--radius-lg);background:var(--navy-900);color:var(--on-dark-muted)}
.faq-cta img{position:absolute;left:0;right:0;bottom:0;width:100%;height:58%;object-fit:cover;object-position:70% 50%;z-index:-2}
.faq-cta::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--navy-900) 38%,rgba(1,21,69,.55) 75%,rgba(1,21,69,.2))}
.faq-cta__content{padding:1.75rem 1.75rem 2rem}
.faq-cta h3{font-size:1.35rem;color:#fff;max-width:18em}
.faq-cta p{margin-top:.6rem;font-size:1rem;max-width:30em}
.faq-cta a:not(.btn){color:#fff;font-weight:600;text-underline-offset:3px;word-break:break-word}
.faq-cta .btn{margin-top:1.4rem}

/* --- CTA banner -------------------------------------------------------------- */
.cta-banner{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;min-height:320px;border-radius:20px;background:var(--navy-900);color:var(--on-dark-muted);box-shadow:var(--shadow)}
.cta-banner::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(40rem 22rem at 0% 0%,rgba(52,98,206,.4),transparent 65%);pointer-events:none}
.cta-banner__media{position:absolute;top:0;right:0;bottom:0;width:48%;z-index:-1;clip-path:polygon(15% 0,100% 0,100% 100%,0 100%)}
.cta-banner__media img{width:100%;height:100%;object-fit:cover}
.cta-banner__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,21,69,.5),rgba(1,21,69,0) 45%)}
.cta-banner__content{width:min(100%,56%);padding:clamp(2.25rem,4vw,3.5rem)}
.cta-banner h2{color:#fff;font-size:clamp(1.8rem,1.1rem + 1.9vw,2.6rem)}
.cta-banner p{margin-top:.9rem;font-size:1.12rem;max-width:32em}
.cta-banner .btn{margin-top:1.8rem}
.section--contact .cta-banner{margin-bottom:clamp(4rem,3rem + 4vw,6rem)}
.section--cta{padding-block:clamp(3.5rem,2.5rem + 4vw,5.5rem)}

/* --- Contact ----------------------------------------------------------------- */
.contact{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(1.25rem,2.5vw,2rem);align-items:stretch}
.contact-head .section-head{margin-bottom:clamp(2rem,1.5rem + 1.5vw,2.75rem)}
.form-card{position:relative;padding:clamp(1.5rem,3vw,2.5rem);background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem 1.25rem}
.field{display:flex;flex-direction:column;gap:.45rem;min-width:0}
.field--full{grid-column:1/-1}
.field label{font-size:.95rem;font-weight:700;color:var(--ink)}
.req{color:var(--red-600)}
.input{width:100%;min-height:3.15rem;padding:.75rem .95rem;border:1.5px solid var(--line-strong);border-radius:var(--radius-sm);background:#fff;color:var(--ink);font-size:1rem;line-height:1.4;transition:border-color .2s,box-shadow .2s}
.input::placeholder{color:#6F7891;opacity:1}
.input:hover{border-color:#A5B0C8}
.input:focus{outline:none;border-color:var(--navy-700);box-shadow:0 0 0 4px rgba(22,48,122,.15)}
.input[aria-invalid="true"]{border-color:var(--red-600);box-shadow:0 0 0 4px rgba(182,10,8,.1)}
select.input{appearance:none;-webkit-appearance:none;padding-right:2.75rem;cursor:pointer;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23011545' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right .9rem center/18px}
textarea.input{min-height:8.5rem;resize:vertical}
.field__error{display:flex;align-items:center;gap:.4rem;font-size:.9rem;font-weight:600;color:var(--red-700)}
.field__error::before{content:"!";display:grid;place-items:center;flex:none;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--red-700);color:#fff;font-size:.72rem;font-weight:800}
.field__error[hidden]{display:none}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.form__footer{display:flex;align-items:center;gap:1rem;margin-top:1.6rem}
.enquiry .btn{min-width:13rem}
.btn__spinner{display:none;width:1.1rem;height:1.1rem;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
.btn.is-loading{pointer-events:none;opacity:.85}
.btn.is-loading .icon{display:none}
.btn.is-loading .btn__spinner{display:block}
@keyframes spin{to{transform:rotate(360deg)}}
.form__status{display:flex;gap:.75rem;align-items:flex-start;margin-top:1.25rem;padding:1rem 1.1rem;border-radius:var(--radius-sm);font-size:1rem;line-height:1.5}
.form__status[hidden]{display:none}
.form__status .icon{margin-top:.05rem}
.form__status--success{background:#E8F6EE;color:#0A5C33;border:1px solid #BFE5CF}
.form__status--error{background:#FDECEC;color:#8E0A10;border:1px solid #F6C4C6}
.form__status a{color:inherit;font-weight:700}

.speak{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:.6rem;padding:clamp(1.6rem,3vw,2.4rem);border-radius:var(--radius-lg);background:var(--navy-900);color:var(--on-dark-muted);box-shadow:var(--shadow)}
.speak::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:40px 40px;-webkit-mask-image:linear-gradient(180deg,transparent,#000 70%);mask-image:linear-gradient(180deg,transparent,#000 70%)}
.speak::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--red-500)}
.speak h3{font-size:clamp(1.6rem,1.3rem + .8vw,2rem);color:#fff}
.speak > p{font-size:1.05rem}
.speak__rows{display:grid;gap:.9rem;margin:1.3rem 0 1.6rem}
.speak-row{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:var(--radius);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.speak-row .icon-tile{background:#fff;color:var(--red-600)}
.speak-row__text{display:flex;flex-direction:column;min-width:0}
.speak-row__text span{font-size:.92rem;color:var(--on-dark-soft)}
.speak-row__text a{font-size:clamp(1.12rem,1rem + .4vw,1.35rem);font-weight:800;letter-spacing:-.01em;color:#fff;text-decoration:none;overflow-wrap:anywhere}
.speak-row--email .speak-row__text a{font-size:clamp(1rem,.92rem + .3vw,1.16rem);letter-spacing:0}
.speak-row__text a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px;text-decoration-color:var(--red-500)}
.speak-row__wa{display:grid;place-items:center;flex:none;width:2.75rem;height:2.75rem;margin-left:auto;border-radius:50%;background:#1EA952;color:#fff;transition:transform .2s var(--ease)}
.speak-row__wa:hover{transform:scale(1.07)}
.speak-row__wa .icon-wa{width:22px;height:22px}
.speak__details{display:grid;gap:.8rem;margin-top:auto;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.14);font-size:.97rem;line-height:1.5}
.speak__details li{display:flex;gap:.75rem;align-items:flex-start;color:var(--on-dark-muted)}
.speak__details .icon{width:20px;height:20px;margin-top:.1rem;color:#FF5A61}
.speak__details a{color:inherit;text-decoration:none}
.speak__details a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.nowrap{white-space:nowrap}

.map{position:relative;overflow:hidden;min-height:420px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--bg-tint)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.section--map{padding-top:0;background:var(--bg-soft)}

/* --- About ------------------------------------------------------------------- */
.split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(1.5rem,5vw,5rem);align-items:start}
.split__lead{font-size:clamp(1.2rem,1rem + .7vw,1.55rem);line-height:1.5;font-weight:500;letter-spacing:-.01em;color:var(--ink)}
.highlight{position:relative;overflow:hidden;display:flex;align-items:center;gap:1.1rem;margin-top:2rem;padding:1.15rem 1.35rem 1.15rem 1.6rem;border-radius:var(--radius);background:var(--bg-soft);font-size:1.08rem;font-weight:650;color:var(--navy-900)}
.highlight::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--red-500)}
.highlight .icon-tile{width:3rem;height:3rem;border-radius:10px}
.highlight .icon-tile .icon{width:24px;height:24px}
.mv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem)}
.mv__card{position:relative;display:flex;gap:1.5rem;align-items:flex-start;padding:clamp(1.6rem,3vw,2.4rem);background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}
.mv__card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--red-500)}
.mv__icon{display:grid;place-items:center;flex:none;width:4.5rem;height:4.5rem;border-radius:50%;background:#FDECEC;color:var(--red-600)}
.mv__icon .icon{width:34px;height:34px;stroke-width:1.8}
.mv__card h3{font-size:1.45rem}
.mv__card p{margin-top:.55rem;font-size:1.08rem;color:var(--muted)}
.guides{margin-top:clamp(3.5rem,3rem + 3vw,5rem)}
.divider-label{display:flex;align-items:center;gap:1.25rem;margin-bottom:clamp(2rem,1.5rem + 2vw,3rem);font-size:.82rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-stretch:108%;color:var(--navy-700)}
.divider-label::before,.divider-label::after{content:"";flex:1;height:1px;background:var(--line-strong)}
.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem);counter-reset:p}
.principles li{position:relative;padding-top:1.5rem;counter-increment:p}
.principles li::before{content:"";position:absolute;left:0;top:0;width:40px;height:12px;background:var(--rise) no-repeat left center/contain}
.principles h4{font-size:1.3rem;color:var(--ink)}
.principles h4::before{content:counter(p,decimal-leading-zero) " ";color:var(--red-600);font-weight:700;font-size:.95rem;letter-spacing:.1em;vertical-align:.12em;margin-right:.3rem}
.principles p{margin-top:.55rem;color:var(--muted)}

/* --- Outsourcing callout --------------------------------------------------- */
.callout{display:flex;align-items:center;gap:1.4rem;margin-top:clamp(3rem,2.5rem + 2vw,4rem);padding:1.5rem 1.75rem;border-radius:var(--radius-lg);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.callout .icon-tile{background:#fff;color:var(--red-600)}
.callout p{display:flex;flex-direction:column;gap:.2rem;color:var(--on-dark-muted)}
.callout strong{font-size:1.15rem;color:#fff}
.callout .btn{margin-left:auto;flex:none}

/* --- Footer ------------------------------------------------------------------ */
.site-footer{position:relative;padding-top:clamp(3.75rem,3rem + 3vw,5.25rem);background:var(--navy-950);color:var(--on-dark-soft);font-size:.98rem}
.site-footer::before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:var(--red-500)}
.footer__grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.75fr) minmax(0,.75fr) minmax(0,1.45fr);gap:2.5rem clamp(1.5rem,3vw,3rem)}
.footer__logo{display:inline-block;border-radius:6px}
.footer__logo img{width:auto;height:104px}
.footer__brand p{margin-top:1.4rem;max-width:30em;line-height:1.6}
.footer__col h2{margin-bottom:1.15rem;font-size:1.02rem;font-weight:700;letter-spacing:.01em;color:#fff}
.footer__col ul{display:grid;gap:.7rem}
.footer__col a{color:var(--on-dark-muted);text-decoration:none;transition:color .2s}
.footer__col a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.footer__contact li{display:flex;align-items:flex-start;gap:.75rem;line-height:1.5}
.footer__contact .icon{width:19px;height:19px;margin-top:.15rem;color:var(--red-500)}
.footer__contact a,.footer__contact span{overflow-wrap:anywhere}
.footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:clamp(2.75rem,2rem + 3vw,4rem);padding-block:1.5rem;border-top:1px solid rgba(255,255,255,.12);font-size:.92rem}

/* --- WhatsApp float ------------------------------------------------------------- */
.wa-float{position:fixed;right:clamp(14px,2vw,26px);bottom:clamp(14px,2vw,26px);z-index:90;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#1EA952;color:#fff;box-shadow:0 14px 30px -10px rgba(0,0,0,.45);transition:transform .25s var(--ease),opacity .25s,visibility .25s}
.wa-float .icon-wa{width:30px;height:30px}
.wa-float:hover{transform:scale(1.07)}
.wa-float.is-hidden,body.menu-open .wa-float{opacity:0;visibility:hidden;transform:translateY(14px)}

/* --- Reveal on scroll -------------------------------------------------------- */
.js [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--d,0ms)}
.js [data-reveal].is-in{opacity:1;transform:none}

/* --- Responsive -------------------------------------------------------------- */
@media (max-width:1180px){
  .nav__list a{padding-inline:.6rem;font-size:.94rem}
  .nav__list a::after{left:.6rem;right:.6rem}
}
@media (max-width:1100px){
  .nav{display:none}
  .nav-toggle{display:block}
  .header__cta{margin-left:auto}
  .grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer__brand{grid-column:1/-1}
}
@media (max-width:960px){
  :root{--header-h:72px}
  .brand img{height:58px}
  .hero--split,.hero--home{--hero-h:0}
  .hero--split{display:flex;flex-direction:column}
  .hero__media{position:relative;width:100%;aspect-ratio:16/9.5;clip-path:polygon(0 0,100% 0,100% 90%,0 100%)}
  .hero__media::after{background:linear-gradient(0deg,rgba(1,21,69,.35),rgba(1,21,69,0) 40%)}
  .hero__edge,.hero__mark{display:none}
  .hero--split .hero__rule{width:100%}
  .hero--split .hero__content{max-width:none}
  .hero__inner{padding-block:2.25rem 3.25rem}
  .hero--plain .hero__inner{padding-block:3rem 3.5rem}
  .section-head--split{grid-template-columns:1fr}
  .section-head--split .lead{padding-bottom:0}
  .grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .clients-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .roles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .roles > *,.roles > :nth-child(4),.roles > :nth-child(5){grid-column:auto}
  .roles > :last-child{grid-column:1/-1}
  .process{grid-template-columns:1fr;gap:0}
  .process__step{display:grid;grid-template-columns:auto 1fr;column-gap:1.25rem;padding-bottom:2rem}
  .process__step:last-child{padding-bottom:0}
  .process__marker{grid-row:1/4;flex-direction:column;align-items:center;gap:0;margin-bottom:0;height:100%}
  .process__line{flex:1;width:2px;height:auto;min-height:1.5rem;margin:.6rem 0 -2rem;background:repeating-linear-gradient(180deg,var(--line-strong) 0 8px,transparent 8px 14px)}
  .process--dark .process__line{background:repeating-linear-gradient(180deg,rgba(255,255,255,.35) 0 8px,transparent 8px 14px)}
  .process__line::after{display:none}
  .process__label{margin-top:.3rem}
  .process__step h3{align-self:start;padding-top:.15rem}
  .process__num + .process__line{margin-top:.5rem}
  .why{grid-template-columns:1fr}
  .why__media{max-width:640px;margin-inline:auto 1.25rem}
  .faq{grid-template-columns:1fr}
  .faq__aside{position:static}
  .cta-banner{flex-direction:column;align-items:stretch;min-height:0}
  .cta-banner__media{position:relative;width:100%;aspect-ratio:16/7;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
  .cta-banner__media::after{background:linear-gradient(0deg,rgba(1,21,69,.3),rgba(1,21,69,0) 50%)}
  .cta-banner__content{width:100%;padding-top:1.75rem}
  .contact{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .split__head .rise{margin-bottom:1rem}
  .callout{flex-wrap:wrap}
  .callout p{flex:1 1 300px}
  .callout .btn{margin-left:0}
}
@media (max-width:640px){
  body{font-size:1rem}
  .header__cta{display:none}
  .nav-toggle{margin-left:auto}
  .grid--2,.grid--3,.grid--4,.pillars,.mv,.principles,.roles,.clients-grid{grid-template-columns:1fr}
  .logo-wall li{flex-basis:calc(50% - .5rem);height:96px}
  .roles > :last-child{grid-column:auto}
  .form-grid{grid-template-columns:1fr}
  .field--full{grid-column:auto}
  .enquiry .btn{width:100%}
  .notice p{align-items:flex-start;font-size:.95rem}
  .notice .icon{margin-top:.1rem}
  .why__badge{left:.75rem;bottom:-1.25rem;max-width:calc(100% - 1.5rem)}
  .why__badge strong{font-size:2.8rem}
  .why__media{margin-right:.75rem}
  .why__media::before{right:-.75rem;bottom:-.75rem}
  .mv__card{flex-direction:column;gap:1.1rem}
  .speak{padding:1.5rem 1.25rem 1.75rem}
  .speak-row{padding:.8rem;gap:.8rem}
  .speak-row .icon-tile{width:2.75rem;height:2.75rem;border-radius:10px}
  .speak-row .icon-tile .icon{width:22px;height:22px}
  .speak-row--email .speak-row__text a{font-size:1rem}
  .project-card__body{flex-direction:column;align-items:flex-start;gap:.45rem;padding:1.15rem 1.25rem 1.3rem}
  .cta-banner__content{padding:1.6rem 1.4rem 2rem}
  .map{min-height:360px}
    .footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer__contact{grid-column:1/-1}
  .btn{white-space:normal}
  .faq-item summary{padding:1.05rem 1.1rem;font-size:1.02rem}
  .faq-item__answer{padding:0 1.1rem 1.15rem}
}
@media (max-width:380px){
  .footer__grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .js [data-reveal]{opacity:1;transform:none}
}
@media print{
  .site-header,.wa-float,.hero__media,.hero__edge,.nav-toggle,.mobile-menu{display:none!important}
  .hero,.section--navy,.site-footer{background:#fff!important;color:#000!important}
  .hero h1,.section--navy h2,.section--navy h3{color:#000!important}
  .js [data-reveal]{opacity:1!important;transform:none!important}
}