/* GeoTechnica V3. Light premium direction: ivory surfaces, generous spacing,
   restrained red, Alexandria for Arabic and headings, Space Grotesk for Latin labels.
   V3 adds: sectors served, technique matrix, unified project meta, contextual CTAs,
   and a where-we-work band. V3 component styles are appended at the end of this file. */

:root{
  --red:#dc1419;
  --red-deep:#b30e13;
  --ink:#191b1d;
  --muted:#6c7074;
  --paper:#fbfaf7;
  --paper-2:#f3f1ea;
  --card:#ffffff;
  --line:#e5e2d9;
  --line-dark:#d5d1c6;
  --charcoal:#1c1f21;
  --ar:'Alexandria','IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif;
  --latin:'Space Grotesk','Manrope','Segoe UI',sans-serif;
  --gutter:clamp(22px,5vw,84px);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:104px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--ar);font-size:17px;font-weight:300;line-height:1.9;-webkit-font-smoothing:antialiased}
body.dialog-open{overflow:hidden}
html[lang=en] body{line-height:1.7}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}
button,a,summary{touch-action:manipulation}
button{cursor:pointer;border:0;background:none;color:inherit;padding:0}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.35;font-weight:600}
h2{font-size:clamp(33px,3.5vw,52px)}
html[lang=en] h1,html[lang=en] h2{letter-spacing:-1.5px}
p{overflow-wrap:break-word}
::selection{color:#fff;background:var(--red)}
:focus-visible{outline:3px solid var(--red);outline-offset:5px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:0;border-color:var(--red);box-shadow:0 0 0 2px #dc141917}

.shell{width:min(100% - var(--gutter)*2,1300px);margin-inline:auto}
.latin{font-family:var(--latin);direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums;font-weight:500}
.muted{color:var(--muted)}
.section{padding-block:clamp(80px,10vw,130px)}
.small-label{font-size:12.5px;color:var(--muted);font-weight:500;letter-spacing:.4px}

/* Icons */
.icon{width:19px;height:19px;flex-shrink:0}
.icon use{stroke:currentColor}
html[dir=rtl] .flip{transform:scaleX(-1)}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1);transition-delay:var(--d,0s)}
.reveal.in{opacity:1;transform:none}
html.no-motion .reveal{opacity:1;transform:none;transition:none}

/* Staggered children: hero copy */
.hero-copy.reveal{opacity:1;transform:none}
.hero-copy.reveal :is(.eyebrow,h1,.hero-lead,.hero-buttons,.hero-foot){transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1)}
.hero-copy.reveal:not(.in) :is(.eyebrow,h1,.hero-lead,.hero-buttons,.hero-foot){opacity:0;transform:translateY(24px)}
.hero-copy.reveal h1{transition-delay:.12s}
.hero-copy.reveal .hero-lead{transition-delay:.24s}
.hero-copy.reveal .hero-buttons{transition-delay:.36s}
.hero-copy.reveal .hero-foot{transition-delay:.5s}
html.no-motion .hero-copy.reveal :is(.eyebrow,h1,.hero-lead,.hero-buttons,.hero-foot){opacity:1;transform:none;transition:none}

/* Staggered grids */
.service-grid .service-card.reveal:nth-child(2){--d:.1s}
.service-grid .service-card.reveal:nth-child(3){--d:.2s}
.service-grid .service-card.reveal:nth-child(4){--d:.3s}
.stats.reveal{opacity:1;transform:none}
.stats.reveal .stat{transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1)}
.stats.reveal:not(.in) .stat{opacity:0;transform:translateY(24px)}
.stats.reveal .stat:nth-child(2){transition-delay:.12s}
.stats.reveal .stat:nth-child(3){transition-delay:.24s}
.stats.reveal .stat:nth-child(4){transition-delay:.36s}
html.no-motion .stats.reveal .stat{opacity:1;transform:none;transition:none}

/* Marker rule grows in */
.section-marker .marker-rule{transform:scaleX(0);transform-origin:right;transition:transform 1s cubic-bezier(.22,.61,.36,1) .2s}
html[dir=ltr] .section-marker .marker-rule{transform-origin:left}
.reveal.in .marker-rule,.in .section-marker .marker-rule,.section-marker.in .marker-rule{transform:scaleX(1)}
html.no-motion .marker-rule{transform:scaleX(1);transition:none}

/* Scroll progress */
.scroll-progress{position:absolute;bottom:-1px;inset-inline-start:0;width:100%;height:2px;background:var(--red);transform:scaleX(0);transform-origin:right;z-index:41;pointer-events:none}
html[dir=ltr] .scroll-progress{transform-origin:left}

/* Header shadow after scroll */
.site-header{transition:box-shadow .3s}
.site-header.scrolled{box-shadow:0 10px 30px -18px #4a443766}

/* Section marker */
.section-marker{display:flex;align-items:center;gap:16px;color:var(--ink);font-size:14px;font-weight:500;margin-bottom:34px}
.section-marker .latin{font-size:13px;color:var(--red);letter-spacing:2px}
.marker-rule{width:54px;height:1px;background:var(--line-dark)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:60px;margin-bottom:56px}
.section-heading>p{max-width:410px;color:var(--muted);font-size:16.5px}

/* Buttons and links */
.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;min-height:58px;padding:15px 28px;color:#fff;background:var(--red);font-size:15.5px;font-weight:500;line-height:1.5;border:1px solid transparent;transition:background .25s,transform .2s,box-shadow .25s}
.button:hover{background:var(--red-deep);box-shadow:0 14px 30px -14px #dc141966}
.button:active{transform:translateY(1px)}
.button .icon{transition:transform .25s}
.button:hover .icon{transform:translate(3px,-3px)}
html[dir=rtl] .button:hover .icon.flip{transform:scaleX(-1) translate(3px,-3px)}
.button-small{min-height:46px;font-size:14px;padding:10px 20px;gap:18px}
.text-link{display:inline-flex;align-items:center;gap:14px;min-height:44px;padding:4px 0;font-weight:500;font-size:15px;transition:color .2s}
.text-link:hover{color:var(--red)}
.text-link .icon{width:17px;height:17px}
.underlined{border-bottom:1px solid var(--line-dark);padding-bottom:10px}
.skip-link{position:fixed;inset-inline-start:20px;top:-110px;padding:12px 22px;z-index:200;background:var(--red);color:#fff}
.skip-link:focus{top:10px}

/* Utility bar */
.utility{background:var(--charcoal);color:#c9ccce;font-size:12px;padding:9px 0;line-height:1.5}
.utility .shell,.utility-right{display:flex;align-items:center;justify-content:space-between;gap:28px}
.utility-loc{display:flex;align-items:center;gap:9px}
.status-dot{width:5px;height:5px;border-radius:50%;background:var(--red)}
.utility a{font-family:var(--latin);font-size:12px;letter-spacing:.5px}
.utility a:hover{color:#fff}

/* Header */
.site-header{position:sticky;top:0;z-index:40;background:#fbfaf7f0;border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:32px;min-height:94px}
.brand{display:block;flex-shrink:0}
.brand img{width:188px;height:auto}
.main-nav{display:flex;align-items:center;gap:34px;font-size:15px;font-weight:400}
.main-nav a{position:relative;padding:13px 0}
.main-nav a::after{position:absolute;bottom:6px;inset-inline-start:0;width:0;height:1.5px;background:var(--red);content:'';transition:width .25s}
.main-nav a:hover::after{width:100%}
.nav-actions{display:flex;align-items:center;gap:18px}
.language{font:500 13px var(--latin);min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-dark);padding:6px 12px;transition:border-color .2s,color .2s}
.language:hover{border-color:var(--ink)}
.menu-toggle{display:none;width:44px;height:44px;padding:10px}
.menu-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:6px 0;transition:transform .2s}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}

/* Hero */
.hero{position:relative;background:var(--paper)}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(40px,5vw,90px);align-items:center;padding-block:clamp(56px,7vw,110px) clamp(48px,6vw,90px)}
.eyebrow{font-size:13.5px;font-weight:400;color:var(--muted);display:flex;align-items:center;gap:14px}
.eyebrow .line{width:34px;height:1.5px;background:var(--red);flex-shrink:0}
.hero h1{font-size:clamp(50px,5.6vw,86px);font-weight:700;line-height:1.32;margin-block:26px 26px}
.hero h1 em{font-style:normal;font-weight:300;color:var(--ink)}
.hero-lead{max-width:560px;font-size:17.5px;line-height:2;color:#43474a}
.hero-buttons{display:flex;align-items:center;gap:32px;margin-top:38px}
.hero-foot{display:flex;flex-wrap:wrap;gap:10px 34px;margin-top:56px;padding-top:22px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.hero-foot .latin{font-size:11.5px;letter-spacing:2px;color:#93989c}
.hero-visual{position:relative;margin:0}
.hero-frame{position:relative;overflow:hidden}
.hero-frame img{width:100%;height:clamp(420px,46vw,620px);object-fit:cover;object-position:center 57%;transform:scale(1.08);will-change:transform}
html.no-motion .hero-frame img{transform:none}
.hero-frame::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#1a140e2b,transparent 40%)}
.hero-corner{position:absolute;top:-13px;inset-inline-end:-13px;width:110px;height:110px;border-top:2px solid var(--red);border-inline-end:2px solid var(--red);pointer-events:none}
.hero-plaque{position:absolute;bottom:0;inset-inline-start:0;z-index:1;display:flex;flex-direction:column;gap:5px;background:var(--paper);padding:18px 26px 16px;font-size:13.5px;max-width:75%}
.hero-plaque .latin{font-size:11px;letter-spacing:2.2px;color:var(--red)}
.hero-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--card);overflow:hidden}
.strip-track{display:flex;width:max-content;animation:marquee 32s linear infinite}
.hero-strip:hover .strip-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
html[dir=rtl] .strip-track{animation-name:marquee-rtl}
@keyframes marquee-rtl{to{transform:translateX(50%)}}
.strip-inner{display:flex;gap:clamp(40px,6vw,90px);padding-block:18px;padding-inline-end:clamp(40px,6vw,90px);font-size:13.5px;white-space:nowrap}
.strip-inner>span{display:flex;align-items:center;gap:12px}
.strip-inner b{font-weight:500;font-size:11.5px;color:var(--red);letter-spacing:1px}
html.no-motion .strip-track{animation:none;width:100%}
html.no-motion .strip-inner{width:100%;justify-content:space-between;flex-wrap:wrap;white-space:normal;padding-inline:var(--gutter)}
html.no-motion .strip-inner[aria-hidden=true]{display:none}

/* About */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,110px)}
.about-copy .intro{font-size:19px;line-height:2}
.about-copy .muted{font-size:15.5px;margin-top:18px}
.about-copy .text-link{margin-top:26px;gap:12px}
.file-meta{font-size:11.5px;color:var(--muted);font-weight:400;letter-spacing:1px;padding-inline-start:14px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:74px;border-top:1px solid var(--line);padding-top:42px;gap:34px}
.stat{position:relative;min-width:0}
.stat+.stat{border-inline-start:1px solid var(--line);padding-inline-start:34px}
.stat-number{font-size:clamp(40px,3.6vw,58px);font-weight:500;line-height:1.25;letter-spacing:-2px;display:inline-block}
.stat-unit{font-family:var(--ar);font-style:normal;font-size:15px;font-weight:400;letter-spacing:0;margin-inline-start:9px}
.stat-plus{font-style:normal;color:var(--red);font-size:.72em;font-weight:400}
.stat-prefix{display:block;font-size:12px;color:var(--muted);position:absolute;top:-19px}
.stat h3{font-size:15px;font-weight:500;margin-top:12px;line-height:1.7}
.stat p{font-size:12.5px;color:var(--muted);margin-top:4px}

/* Services */
.services-section{background:var(--paper-2)}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.service-card{min-width:0;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);transition:box-shadow .35s,transform .35s}
.service-card:hover{box-shadow:0 26px 50px -30px #3a352c4d;transform:translateY(-4px)}
html.no-motion .service-card:hover{transform:none}
.card-image{position:relative;overflow:hidden;aspect-ratio:1.15;background:#dcd8cf}
.card-image>img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.service-card:hover .card-image>img{transform:scale(1.05)}
.card-image::after{position:absolute;inset:0;content:'';pointer-events:none;background:linear-gradient(0deg,#12100b4d,transparent 45%)}
.image-number{position:absolute;inset-inline-start:16px;top:14px;color:#fff;z-index:1;font-size:12px;letter-spacing:1.4px;text-shadow:0 1px 5px #000}
.round-arrow{position:absolute;inset-inline-end:0;bottom:0;z-index:2;width:48px;height:48px;background:var(--paper);display:grid;place-items:center;transition:background .2s,color .2s}
.round-arrow:hover{background:var(--red);color:#fff}
.service-copy{padding:24px 22px 22px;display:flex;flex-direction:column;flex:1}
.service-en{font-size:11px;font-weight:500;letter-spacing:1.6px;color:var(--muted)}
.service-copy h3{font-size:21.5px;line-height:1.6;margin-block:9px 10px;min-height:69px}
.service-copy p{font-size:14.5px;line-height:1.95;color:var(--muted);margin-bottom:20px;flex:1;font-weight:300}
.service-copy .text-link{border-top:1px solid var(--line);width:100%;font-size:13.5px;justify-content:space-between;padding-top:15px;margin-top:auto}
.service-help{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:52px;font-size:15px;color:var(--muted)}
.service-help .text-link{color:var(--ink)}

/* Projects */
.projects-section{background:var(--paper)}
.project-feature{display:grid;grid-template-columns:1.12fr 1fr;background:var(--charcoal);color:#fff}
.project-visual{position:relative;min-height:480px}
.project-visual>img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.photo-caption{position:absolute;bottom:16px;inset-inline-start:16px;inset-inline-end:16px;color:#fff;font-size:12px;line-height:1.7;width:fit-content;padding:6px 12px;background:#15181ac9}
.project-feature-copy{padding:clamp(32px,3.6vw,54px);display:flex;flex-direction:column;align-items:start}
.project-tags{display:flex;flex-wrap:wrap;gap:9px;font-size:12px;color:#b9bfc2;letter-spacing:.4px}
.project-tags span+span::before{content:'/';padding-inline-end:9px;color:#7c8489}
.project-feature-copy h3{font-size:32px;line-height:1.55;margin-block:22px 15px}
.project-feature-copy h3 bdi{font-family:var(--latin);font-size:34px;font-weight:600;letter-spacing:-.5px}
.project-feature-copy>p{font-size:15.5px;line-height:2;color:#c3cacd;font-weight:300}
.project-metric{display:flex;align-items:center;gap:22px;margin-block:26px;border-top:1px solid #ffffff21;padding-top:22px;width:100%}
.project-metric strong{font-size:50px;letter-spacing:-2px;font-weight:500}
.project-metric>span{font-size:13px;color:#c3cacd;line-height:1.75}
.project-feature-copy>.text-link{margin-top:auto;color:#fff}
.project-feature-copy>.text-link:hover{color:#ff8a8d}
.project-secondary{display:grid;grid-template-columns:1fr 1fr;gap:0 54px;margin-top:14px}
.project-row{border-bottom:1px solid var(--line);padding:28px 0;display:flex;align-items:center;gap:24px}
.project-index{font-size:12px;color:#a9a598;align-self:start;margin-top:6px;letter-spacing:1px}
.project-row h3{font-size:22px;margin-top:7px;font-weight:600}
.project-subtitle{font-size:12px;color:var(--muted);margin-top:8px;text-align:start;letter-spacing:.3px}
.outline-circle{width:50px;height:50px;border:1px solid var(--line-dark);border-radius:50%;flex-shrink:0;margin-inline-start:auto;display:grid;place-items:center;transition:background .2s,color .2s,border-color .2s}
.outline-circle:hover{color:#fff;border-color:var(--red);background:var(--red)}

/* Capabilities */
.capabilities-section{background:var(--paper-2)}
.capabilities-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,95px);align-items:center}
.capability-picture{position:relative;align-self:stretch;min-height:600px;background:#d8d4cb;margin:0}
.capability-picture>img{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:43% center}
.picture-label{position:absolute;bottom:0;inset-inline-end:0;display:flex;flex-direction:column;gap:8px;background:var(--red);color:#fff;padding:26px 32px;min-width:68%}
.picture-label .latin{font-size:11px;letter-spacing:2px;color:#ffd4d5}
.picture-label>span:last-child{font-size:23px;font-weight:500}
.capability-copy .section-marker{margin-bottom:22px}
.capability-copy>p{font-size:16.5px;margin-top:22px}
.capability-accordions{margin-top:34px;border-top:1px solid var(--line-dark)}
details{border-bottom:1px solid var(--line-dark)}
summary{display:flex;align-items:center;gap:20px;list-style:none;cursor:pointer;min-height:68px;font-size:16.5px;font-weight:500;padding-block:13px}
summary::-webkit-details-marker{display:none}
summary .latin{font-size:11.5px;color:var(--red);letter-spacing:1px}
.details-sign{position:relative;width:14px;height:14px;flex-shrink:0;margin-inline-start:auto}
.details-sign::before,.details-sign::after{content:'';position:absolute;top:6px;left:0;width:14px;height:1.4px;background:currentColor;transition:transform .25s}
.details-sign::after{transform:rotate(90deg)}
details[open] .details-sign::after{transform:rotate(0)}
details>p{font-size:14.5px;line-height:2;color:var(--muted);padding:0 34px 22px 8px;font-weight:300}
html[dir=ltr] details>p{padding:0 8px 22px 34px}
details[open]>p{animation:acc-open .45s cubic-bezier(.22,.61,.36,1)}
@keyframes acc-open{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* Profile band */
.profile-section{background:var(--red);color:#fff;padding:50px 0}
.profile-inner{display:flex;align-items:center;gap:36px}
.profile-icon{width:46px;flex-shrink:0}
.profile-icon svg{display:block;width:100%;height:auto}
.profile-inner .small-label{color:#ffc6c8;font-size:13px}
.profile-inner h2{font-size:31px;margin-block:4px 10px}
.profile-inner p{font-size:14.5px;color:#ffdbdc;font-weight:300}
.button-white{background:#fff;color:var(--ink);margin-inline-start:auto;gap:44px;flex-shrink:0}
.button-white:hover{background:#f5ecec;box-shadow:0 14px 30px -14px #00000059}
.button-white small{display:block;font-size:11px;color:var(--muted);font-weight:500;letter-spacing:1px;margin-top:7px}

/* Contact */
.contact-section{background:var(--paper)}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(48px,7vw,110px)}
.contact-copy h2{font-size:clamp(38px,4.3vw,62px);line-height:1.4}
.contact-copy>p{font-size:17px;color:var(--muted);margin-block:26px 38px;max-width:380px}
.contact-email{display:inline-flex;align-items:center;gap:16px;font-size:clamp(16px,1.7vw,23px);font-family:var(--latin);font-weight:500;padding-block:8px;border-bottom:1.5px solid var(--ink);transition:color .2s,border-color .2s}
.contact-email:hover{color:var(--red);border-color:var(--red)}
.contact-location{display:flex;gap:15px;align-items:start;margin-top:44px}
.location-icon{width:24px;height:24px;color:var(--red);margin-top:3px}
.contact-location strong{font-size:16px;font-weight:500}
.contact-location div>span{display:block;font-size:13px;color:var(--muted);margin-top:4px}
.contact-note{margin-top:70px;padding-top:26px;border-top:1px solid var(--line)}
.contact-note .latin{font-size:11.5px;letter-spacing:2px;color:#96938a}

/* Form */
.project-form{padding:38px;background:var(--card);border:1px solid var(--line);box-shadow:0 30px 60px -46px #4a443733}
.form-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}
.form-heading h3{font-size:23px}
.preview-badge{font-size:11.5px;border:1px solid var(--line-dark);color:var(--muted);padding:3px 10px;white-space:nowrap;letter-spacing:.4px}
.form-note{font-size:13px;color:var(--muted);margin-top:9px;margin-bottom:27px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{margin-bottom:17px;min-width:0}
.field label{display:block;font-size:13.5px;font-weight:500;margin-bottom:8px}
input:not([type=file]),select,textarea{display:block;width:100%;max-width:100%;border:1px solid var(--line-dark);background:#fff;border-radius:0;min-height:48px;padding:11px 13px;font-size:14px;font-weight:300;color:var(--ink);line-height:1.6;transition:border-color .2s}
textarea{resize:vertical;min-height:104px}
select{padding-inline-end:28px;font-weight:400}
input::placeholder,textarea::placeholder{color:#96938a;font-size:13px}
input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--red)}
.field-error{display:block;font-size:12px;color:var(--red);margin-top:4px;line-height:1.6}
.field-error:empty{display:none}
.attachment-field{border:1px dashed var(--line-dark);padding:13px 16px;margin-top:2px;background:#fcfbf9}
.attachment-field>label{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:500;cursor:pointer}
.attach-icon{width:16px;height:16px;color:var(--red)}
.attachment-field input{font-size:12px;display:block;max-width:100%;margin-top:10px;direction:ltr}
.attachment-field input::file-selector-button{border:1px solid var(--line-dark);background:var(--paper-2);color:var(--ink);padding:6px 12px;font:inherit;font-size:12px;margin-inline-end:8px}
.attachment-field>small{display:block;color:var(--muted);font-size:12px;line-height:1.8;margin-top:8px}
.attachment-field>p{font-size:12px;margin-top:6px;white-space:pre-line}
.form-submit{width:100%;justify-content:space-between;margin-top:24px}
.form-status{font-size:14px;line-height:1.9;color:var(--ink);background:#eef3ee;border-inline-start:3px solid #517657;margin-top:20px;padding:15px}
.form-status:empty{display:none}
.form-status.error{border-color:var(--red);background:#fdf1f1}

/* Footer */
.footer{background:#17191b;color:#fff;padding:64px 0 24px}
.footer-top{display:flex;align-items:center;gap:70px;padding-bottom:42px;border-bottom:1px solid #ffffff21}
.footer .brand img{width:220px}
.footer-top>p{font-size:19px;line-height:1.75;color:#bfc5c9;font-weight:300}
.back-top{margin-inline-start:auto;font-size:13px;display:flex;align-items:center;gap:18px;min-height:44px}
.back-top:hover .back-top-circle{border-color:var(--red);background:var(--red)}
.back-top-circle{border:1px solid #757e85;width:46px;height:46px;display:grid;place-items:center;border-radius:50%;transition:background .2s,border-color .2s}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;font-size:12px;color:#a4adb3;padding-top:24px}
.footer-bottom>.latin{font-size:11.5px;letter-spacing:1px}
.footer-preview{color:#bfc5c9}
.footer-bottom>a{font-family:var(--latin)}
.footer-bottom>a:hover{color:#fff}

/* Dialog */
dialog{position:fixed;border:0;padding:0;width:min(740px,calc(100% - 36px));max-height:85dvh;background:#fff;color:var(--ink);box-shadow:0 24px 90px #00000045;overflow:auto}
dialog[open]{animation:dialog-in .4s cubic-bezier(.22,.61,.36,1)}
@keyframes dialog-in{from{opacity:0;transform:translateY(26px) scale(.985)}to{opacity:1;transform:none}}
dialog::backdrop{background:#14100abd;backdrop-filter:blur(4px)}
dialog[open]::backdrop{animation:backdrop-in .35s ease}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
.dialog-top{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;padding:12px 26px;background:#fff;z-index:1;border-bottom:1px solid var(--line)}
.dialog-top>.latin{font-size:11.5px;color:var(--muted);letter-spacing:1.4px}
.dialog-close{width:44px;height:44px;display:grid;place-items:center;color:var(--ink);transition:color .2s}
.dialog-close:hover{color:var(--red)}
.dialog-content{padding:34px}
.dialog-content>img:not([hidden]){width:100%;height:235px;object-fit:cover;margin-bottom:26px}
.dialog-content h2{font-size:31px;margin-block:8px 18px}
.dialog-content>p:not(.detail-source){color:var(--muted);font-size:16.5px;line-height:2;font-weight:300}
.dialog-content ul{padding-inline-start:24px;font-size:15.5px;line-height:2;margin-block:22px;font-weight:300}
.dialog-content li{margin-bottom:9px}
.dialog-content li::marker{color:var(--red)}
.detail-source{font-size:12px;line-height:1.9;color:var(--muted);border-top:1px solid var(--line);padding-top:17px;margin-block:22px}
.dialog-content .button{margin-top:5px}

/* English typographic tuning */
html[lang=en] .hero h1{font-size:clamp(46px,5vw,78px);line-height:1.14}
html[lang=en] .service-copy h3{font-size:20.5px;line-height:1.45}
html[lang=en] body{font-weight:400}
html[lang=en] .hero-lead,html[lang=en] .service-copy p,html[lang=en] details>p,html[lang=en] .project-feature-copy>p{font-weight:400}

/* Responsive */
@media(max-width:1150px){
  .main-nav{gap:22px;font-size:14px}.nav-wrap{gap:20px}.brand img{width:168px}.nav-actions{gap:10px}
  .hero-grid{gap:36px}.hero h1{font-size:clamp(46px,5.4vw,66px)}
  .about-grid{gap:56px}.stats{grid-template-columns:repeat(2,1fr);gap:30px}
  .stat:nth-child(odd){border-inline-start:0;padding-inline-start:0}
  .stat:nth-child(3){border-inline-start:0;padding-inline-start:0}
  .stat:nth-child(even){border-inline-start:1px solid var(--line);padding-inline-start:30px}
  .service-grid{grid-template-columns:repeat(2,1fr);gap:22px}
  .service-copy h3{min-height:0}
  .capabilities-grid{gap:44px}.contact-grid{gap:50px}
  .project-feature-copy{padding:32px}.profile-inner{gap:24px}.profile-inner h2{font-size:27px}
}
@media(max-width:950px){
  .nav-cta{display:none}
  .hero-grid{grid-template-columns:1fr;gap:44px;padding-top:48px}
  .hero-frame img{height:clamp(320px,52vw,460px)}
  .hero-corner{top:-10px;inset-inline-end:-10px;width:84px;height:84px}
  .hero-foot{margin-top:40px}
  .section-heading{gap:35px;align-items:start}
  .section-heading>p{max-width:340px;font-size:15.5px}
  .about-grid{grid-template-columns:1fr;gap:30px}
  .project-feature{grid-template-columns:1fr}
  .project-visual{min-height:320px;aspect-ratio:1.5;position:relative}
  .project-secondary{grid-template-columns:1fr;gap:0}
  .capabilities-grid{grid-template-columns:1fr;gap:36px}
  .capability-picture{min-height:420px;order:2}
  .capability-copy{order:1}
  .contact-grid{grid-template-columns:1fr;gap:48px}
  .contact-note{display:none}
  .profile-inner{flex-wrap:wrap}
  .profile-inner>.button{margin-inline-start:82px}
  .footer-top{gap:40px}.footer .brand img{width:190px}
}
@media(max-width:700px){
  :root{--gutter:22px}
  html{scroll-padding-top:84px}
  .utility-right>span{display:none}
  .nav-wrap{min-height:80px;gap:15px}
  .brand img{width:160px}
  .menu-toggle{display:block}
  .main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);border-top:1px solid var(--line);padding:16px var(--gutter) 22px;box-shadow:0 14px 18px #00000012;flex-direction:column;gap:2px;align-items:stretch;font-size:16px}
  .main-nav.is-open{display:flex}
  .main-nav a{min-height:48px;border-bottom:1px solid var(--line)}
  .main-nav a::after{display:none}
  .hero-grid{padding-top:40px;gap:36px}
  .hero h1{font-size:clamp(44px,10.5vw,60px);margin-block:22px}
  .hero-lead{font-size:16px}
  .hero-buttons{gap:20px;flex-wrap:wrap;margin-top:30px}
  .hero-buttons .button{font-size:14px;gap:22px;padding:13px 20px}
  .hero-plaque{padding:13px 18px 12px;font-size:12.5px}
  .strip-inner{font-size:12.5px;gap:34px;padding-inline-end:34px}
  .section{padding-block:66px}
  h2{font-size:33px}
  .section-marker{margin-bottom:26px}
  .marker-rule{width:36px}
  .stats{grid-template-columns:1fr;margin-top:40px;padding-top:28px;gap:0}
  .stat{display:grid;grid-template-columns:130px 1fr;gap:18px;align-items:center;padding-block:18px;border-bottom:1px solid var(--line)}
  .stat+.stat,.stat:nth-child(even){border-inline-start:0;padding-inline-start:0}
  .stat:last-child{border-bottom:0}
  .stat h3{margin-top:0;font-size:14.5px}
  .stat-number{font-size:40px;letter-spacing:-1.5px}
  .stat-prefix{position:static;display:block;margin-bottom:-4px}
  .section-heading{display:block;margin-bottom:34px}
  .section-heading>p{max-width:none;margin-top:20px}
  .service-grid{grid-template-columns:1fr;gap:26px}
  .card-image{aspect-ratio:1.45}
  .service-copy h3{font-size:21px}
  .service-help{flex-direction:column;gap:4px;margin-top:34px;font-size:14px;text-align:center}
  .project-visual{min-height:250px;aspect-ratio:1.35}
  .project-feature-copy{padding:28px 24px}
  .project-feature-copy h3{font-size:27px}
  .project-feature-copy h3 bdi{font-size:29px}
  .project-metric strong{font-size:42px}
  .project-row{padding-block:24px;gap:18px}
  .project-row h3{font-size:20px}
  .capability-picture{min-height:330px;aspect-ratio:1.2}
  .picture-label{min-width:70%;padding:20px 24px}
  .picture-label>span:last-child{font-size:20px}
  summary{font-size:15.5px}
  details>p{font-size:14px}
  .profile-section{padding-block:38px}
  .profile-inner{display:grid;grid-template-columns:34px 1fr;gap:20px}
  .profile-icon{width:34px;align-self:start;margin-top:8px}
  .profile-inner h2{font-size:24px;line-height:1.55;margin-top:4px}
  .profile-inner p{font-size:13px;line-height:1.85}
  .profile-inner>.button{grid-column:1/-1;margin-inline-start:0;justify-self:stretch;justify-content:space-between;min-height:62px}
  .contact-copy h2{font-size:42px}
  .contact-copy>p{font-size:16px;margin-block:22px 28px}
  .contact-email{font-size:18px}
  .project-form{padding:24px}
  .form-heading h3{font-size:21px}
  .form-row{gap:14px}
  input:not([type=file]),textarea,select{font-size:16px;min-height:50px}
  .footer{padding-top:44px}
  .footer-top{display:grid;grid-template-columns:1fr auto;gap:24px;padding-bottom:30px}
  .footer .brand img{width:176px}
  .footer-top>p{font-size:17px;grid-column:1}
  .back-top{grid-column:2;grid-row:1/3}
  .back-top>span:first-child{display:none}
  .footer-bottom{display:grid;grid-template-columns:1fr 1fr;gap:14px;font-size:12px}
  .footer-bottom>a{justify-self:end}
  .footer-bottom>span:nth-child(2){justify-self:end}
  .dialog-content{padding:24px}
  .dialog-top{padding:8px 16px}
  .dialog-content h2{font-size:26px}
  .dialog-content>img:not([hidden]){height:180px}
  .dialog-content .button{width:100%;font-size:14px}
}
@media(max-width:390px){
  :root{--gutter:18px}
  .brand img{width:144px}
  .nav-actions{gap:6px}
  .hero h1{font-size:42px}
  .hero-buttons{gap:14px}
  .stat{grid-template-columns:112px 1fr;gap:12px}
  .stat-number{font-size:34px}
  .form-row{grid-template-columns:1fr;gap:0}
  .project-form{padding:20px}
  .contact-email{font-size:16px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .reveal{opacity:1;transform:none}
  .hero-copy.reveal:not(.in) :is(.eyebrow,h1,.hero-lead,.hero-buttons,.hero-foot){opacity:1;transform:none}
  .stats.reveal:not(.in) .stat{opacity:1;transform:none}
  .section-marker .marker-rule{transform:scaleX(1)}
  .hero-frame img{transform:none}
  .strip-track{width:100%}
  .strip-inner{width:100%;justify-content:space-between;flex-wrap:wrap;white-space:normal;padding-inline:var(--gutter)}
  .strip-inner[aria-hidden=true]{display:none}
  .service-card:hover{transform:none}
  .service-card:hover .card-image>img{transform:none}
}
@media print{
  .utility,.site-header,.hero-buttons,.project-form,.footer-preview,.round-arrow,.outline-circle{display:none!important}
  .section{padding-block:35px}
  .service-grid{grid-template-columns:repeat(2,1fr)}
  .project-feature{background:#f2f2f2;color:#111}
  .project-feature-copy>p,.project-metric>span{color:#333}
  .contact-grid{display:block}
  .shell{width:92%}
}

/* ============================================================
   V3 additions: sectors served, technique matrix, project meta,
   contextual CTAs, where-we-work band
   ============================================================ */

/* Sectors served */
.sectors-section{background:var(--card);border-block:1px solid var(--line)}
.sector-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.sector-card{min-width:0;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);padding:28px 24px 26px;transition:box-shadow .35s,transform .35s,border-color .35s}
.sector-card:hover{box-shadow:0 26px 50px -30px #3a352c4d;transform:translateY(-4px);border-color:var(--line-dark)}
html.no-motion .sector-card:hover{transform:none}
.sector-icon{width:52px;height:52px;border:1px solid var(--line-dark);display:grid;place-items:center;color:var(--red);margin-bottom:20px}
.sector-icon .icon{width:24px;height:24px}
.sector-en{font-size:11px;font-weight:500;letter-spacing:1.6px;color:var(--muted)}
.sector-card h3{font-size:20px;line-height:1.6;margin-block:8px 10px}
.sector-card p{font-size:14px;line-height:1.95;color:var(--muted);font-weight:300}
html[lang=en] .sector-card p{font-weight:400}
.sector-grid .sector-card.reveal:nth-child(2){--d:.1s}
.sector-grid .sector-card.reveal:nth-child(3){--d:.2s}
.sector-grid .sector-card.reveal:nth-child(4){--d:.3s}

/* Technique matrix */
.methods-block{margin-top:clamp(56px,6vw,84px);border-top:1px solid var(--line-dark);padding-top:44px}
.methods-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:36px}
.methods-heading h3{font-size:clamp(24px,2.4vw,32px);font-weight:600}
.methods-heading p{color:var(--muted);font-size:15px;max-width:420px}
.method-groups{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.method-group{min-width:0}
.method-group h4{margin:0 0 14px;font-size:15px;font-weight:600;display:flex;align-items:center;gap:10px}
.method-group h4 .latin{font-size:11px;color:var(--red);letter-spacing:1px}
ul.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chip{font-size:12.5px;line-height:1.7;padding:6px 12px;border:1px solid var(--line-dark);background:var(--card);color:var(--ink);font-weight:400}

/* Unified project meta line */
.row-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;color:var(--muted);margin-top:8px;letter-spacing:.3px}
.row-meta span+span::before{content:'/';padding-inline-end:8px;color:#b4b0a4}

/* Contextual CTA after sections */
.section-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:56px;border:1px solid var(--line);background:var(--card);padding:22px 28px}
.projects-section .section-cta{background:var(--paper-2)}
.capabilities-section .section-cta{margin-top:44px}
.section-cta p{font-size:15.5px;font-weight:400}

/* Where we work band */
.locations-section{background:var(--charcoal);color:#fff;padding-block:clamp(56px,7vw,84px)}
.locations-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:40px}
.locations-head .small-label{color:#9aa1a6}
.locations-head h2{font-size:clamp(28px,3vw,42px);margin-top:8px}
.locations-head p{color:#c3cacd;font-size:15.5px;max-width:430px;font-weight:300}
html[lang=en] .locations-head p{font-weight:400}
.loc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.loc-item{min-width:0;border-top:1px solid #ffffff2b;padding-top:22px}
.loc-item .latin{font-size:11px;letter-spacing:2px;color:#ff8a8d}
.loc-item h3{font-size:19px;margin-block:10px 8px;display:flex;align-items:center;gap:10px}
.loc-item .icon{width:18px;height:18px;color:var(--red)}
.loc-item p{font-size:13.5px;color:#c3cacd;line-height:1.9;font-weight:300}
html[lang=en] .loc-item p{font-weight:400}
.loc-grid .loc-item.reveal:nth-child(2){--d:.12s}
.loc-grid .loc-item.reveal:nth-child(3){--d:.24s}

/* V3 responsive */
@media(max-width:1150px){
  .sector-grid{grid-template-columns:repeat(2,1fr)}
  .method-groups{grid-template-columns:repeat(2,1fr);gap:26px}
}
@media(max-width:950px){
  .methods-heading{display:block}
  .methods-heading p{margin-top:12px;max-width:none}
  .locations-head{display:block}
  .locations-head p{margin-top:14px;max-width:none}
  .loc-grid{grid-template-columns:1fr;gap:22px}
}
@media(max-width:700px){
  .sector-grid{grid-template-columns:1fr;gap:18px}
  .sector-card{padding:22px 20px}
  .method-groups{grid-template-columns:1fr;gap:24px}
  .methods-block{padding-top:34px}
  .section-cta{flex-direction:column;align-items:stretch;gap:18px;margin-top:40px;padding:20px}
  .section-cta .button{justify-content:space-between}
}
@media(prefers-reduced-motion:reduce){
  .sector-card:hover{transform:none}
}
@media print{
  .section-cta{display:none!important}
  .sector-grid,.method-groups{grid-template-columns:repeat(2,1fr)}
  .locations-section{background:#f2f2f2;color:#111}
  .loc-item p,.locations-head p{color:#333}
}

/* V3 hero: full-bleed cover */
.hero-cover{position:relative;background:var(--charcoal);color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 60%;transform:scale(1.08);will-change:transform}
html.no-motion .hero-bg img{transform:none}
.hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#14171ab3,transparent 30%),linear-gradient(270deg,#14171aeb 0%,#14171a9e 45%,#14171a45 78%,#14171a73 100%)}
html[dir=ltr] .hero-bg::after{background:linear-gradient(0deg,#14171ab3,transparent 30%),linear-gradient(90deg,#14171aeb 0%,#14171a9e 45%,#14171a45 78%,#14171a73 100%)}
.hero-stage{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:end;gap:60px;padding-block:clamp(90px,12vw,170px) clamp(60px,8vw,110px)}
.hero-cover .hero-copy{max-width:640px}
.hero-cover .eyebrow{color:#e8e6e0}
.hero-cover .hero-lead{color:#e3e1da}
.hero-cover h1{color:#fff}
.hero-cover h1 em{color:#fff}
.hero-cover .text-link{color:#fff}
.hero-cover .text-link:hover{color:#ff8a8d}
.hero-note{display:flex;gap:16px;align-items:start;max-width:300px;padding-bottom:6px}
.hero-note.reveal{--d:.45s}
.note-plus{width:34px;height:34px;border:1px solid #ffffff59;display:grid;place-items:center;flex-shrink:0;color:#fff}
.note-plus .icon{width:15px;height:15px}
.hero-note p{font-size:14.5px;line-height:1.9;color:#e3e1da}
.hero-note .latin{display:block;margin-top:14px;font-size:11px;letter-spacing:2.4px;color:#b8bdc1}
.hero-bottom{position:relative;z-index:1;border-top:1px solid #ffffff2e}
.hero-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:16px;font-size:12.5px;color:#cfd3d6}
.hero-bottom-inner .latin{font-size:11px;letter-spacing:2.2px;color:#b8bdc1}
.hero-tagline{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:center}
.discover{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:13px;color:#fff;transition:color .2s}
.discover:hover{color:#ff8a8d}
.discover .icon{width:16px;height:16px}
@media(max-width:950px){
  .hero-stage{flex-direction:column;align-items:start;gap:44px;padding-block:70px 50px}
  .hero-note{max-width:none;padding-bottom:0}
}
@media(max-width:700px){
  .hero-stage{padding-block:56px 40px}
  .hero-bottom-inner{flex-wrap:wrap;gap:10px}
}
@media(prefers-reduced-motion:reduce){
  .hero-bg img{transform:none}
}

/* Approved deviations from the prototype.
   ---------------------------------------
   Everything above this line is the approved stylesheet, byte for byte. This
   block is the only place it is departed from, so a diff against the prototype
   shows exactly one addition, here, with its reason.

   Approved by the owner in review: a horizontal scroll on a phone is a bug in
   the prototype rather than a design feature.

   The page scrolled sideways at every width below about 440px, in every engine.
   Two things caused it, and both had to go:

   1. .capability-picture carries min-height:330px together with
      aspect-ratio:1.2 below 700px. A definite height plus a ratio makes the
      width follow: 330 x 1.2 is 396px, inside a column that is 344px at a
      380px viewport. Releasing the minimum height lets the width govern and
      the height follow it instead. Nothing changes at 440px and above, where
      the ratio was already governing and the minimum was not binding.

   2. The attachments field is a file input, and a file input's intrinsic width
      is its button plus its status text, which came to 413px. That set a floor
      on the whole document that no container could shrink. Giving it an
      explicit width lets it take the width it is given. min-width:0 is needed
      as well, because the automatic minimum size of a flex item is its
      min-content width and max-width alone does not lower it.

   Measured after: clean at 1440, 1024, 700, 500, 460, 420, 380 and 360.
   Still 36px over at 320, from .project-visual, which is below the narrowest
   width the approved design lays out for and narrower than any phone in use.
   Left alone rather than deviate further. */

@media(max-width:700px){
  .capability-picture{min-height:0}
}

input[type=file]{width:100%;min-width:0}

/* Approved addition: an optional hero video.
   The owner can put a video in the heroVideo slot. It sits over the hero
   picture, invisible until it is actually playing, so the page paints exactly
   as approved first and falls back to the picture wherever the video does not
   run. The gradient on .hero-bg::after still covers it, so the copy keeps its
   contrast. */
.hero-bg .hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 60%;opacity:0;transition:opacity .8s ease;pointer-events:none}
.hero-bg .hero-video.is-playing{opacity:1}
html.no-motion .hero-bg .hero-video{display:none}
@media(prefers-reduced-motion:reduce){
  .hero-bg .hero-video{display:none}
}