@charset "UTF-8";

:root { --ink:#111814; --ink-2:#18211c; --paper:#f1eee6; --white:#fbfaf7; --lime:#c7ef63; --muted:#9da69f; --line:rgba(17,24,20,.16); --serif:Georgia,"Times New Roman",serif; --sans:Inter,Arial,Helvetica,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6; overflow-x:hidden; }
body.menu-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button,input,select,textarea { font:inherit; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:1000; background:var(--lime); padding:.7rem 1rem; color:var(--ink); }
.skip-link:focus { top:1rem; }
.noise { position:fixed; inset:0; z-index:999; pointer-events:none; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E"); }

.site-header { height:92px; position:absolute; inset:0 0 auto; z-index:20; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 clamp(1.25rem,4vw,5rem); color:white; border-bottom:1px solid rgba(255,255,255,.18); }
.brand { display:flex; align-items:center; gap:.8rem; width:max-content; }
.brand-mark { width:42px; aspect-ratio:1; display:grid; place-items:center; border:1px solid currentColor; transform:rotate(45deg); }
.brand-mark span { font-family:var(--serif); font-size:1.5rem; transform:rotate(-45deg); }
.brand-copy { display:flex; flex-direction:column; line-height:1.05; letter-spacing:.13em; }
.brand-copy strong { font-size:.88rem; }
.brand-copy small { font-size:.53rem; margin-top:.4rem; opacity:.7; }
.main-nav { display:flex; align-items:center; gap:clamp(1.5rem,3vw,3rem); font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.11em; }
.main-nav a { position:relative; }
.main-nav a::after { content:""; position:absolute; height:1px; left:0; right:100%; bottom:-.45rem; background:var(--lime); transition:right .25s; }
.main-nav a:hover::after,.main-nav a:focus-visible::after { right:0; }
.header-cta { justify-self:end; border:1px solid rgba(255,255,255,.35); padding:.72rem 1rem; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; transition:.25s; }
.header-cta:hover { background:var(--lime); border-color:var(--lime); color:var(--ink); }
.menu-toggle { display:none; color:white; background:none; border:0; width:44px; height:44px; padding:0; }
.menu-toggle span { width:24px; height:1px; background:currentColor; display:block; margin:6px auto; transition:.25s; }

.hero { min-height:100svh; position:relative; color:white; display:flex; align-items:flex-end; isolation:isolate; }
.hero-media,.hero-shade,.hero-grid { position:absolute; inset:0; }
.hero-media { z-index:-3; background:url("images/hero.webp") center 56%/cover no-repeat; transform:scale(1.01); }
.hero-shade { z-index:-2; background:linear-gradient(90deg,rgba(7,12,9,.88) 0%,rgba(7,12,9,.54) 50%,rgba(7,12,9,.18) 100%),linear-gradient(0deg,rgba(7,12,9,.75) 0%,transparent 55%); }
.hero-grid { z-index:-1; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.28) 1px,transparent 1px); background-size:25vw 25vw; mask-image:linear-gradient(to bottom,transparent 25%,black); }
.hero-content { width:min(1180px,calc(100% - 3rem)); margin:0 auto; padding:180px 0 clamp(7rem,13vh,10rem); }
.eyebrow,.section-kicker { font-size:.67rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.eyebrow { color:var(--lime); display:flex; align-items:center; gap:.9rem; }
.eyebrow::before { content:""; width:36px; height:1px; background:currentColor; }
.hero h1,.section-heading h2,.statement h2,.vision h2,.contact h2 { font-family:var(--serif); font-weight:400; line-height:.94; letter-spacing:-.055em; margin:1.3rem 0 1.6rem; }
.hero h1 { font-size:clamp(3.5rem,8.5vw,8.5rem); max-width:1100px; }
em { color:var(--lime); font-weight:400; }
.hero-lead { max-width:570px; color:rgba(255,255,255,.75); font-size:clamp(1rem,1.4vw,1.18rem); line-height:1.75; }
.hero-actions { margin-top:2.4rem; display:flex; align-items:center; gap:2rem; }
.button { min-height:54px; display:inline-flex; align-items:center; justify-content:space-between; gap:2.5rem; padding:0 1.5rem; border:0; cursor:pointer; font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; transition:.25s; }
.button span { font-size:1rem; transition:transform .25s; }
.button:hover span { transform:translateX(5px); }
.button-light { background:var(--white); color:var(--ink); }
.button-light:hover { background:var(--lime); }
.text-link { font-size:.73rem; text-transform:uppercase; letter-spacing:.1em; border-bottom:1px solid rgba(255,255,255,.4); padding-bottom:.3rem; }
.text-link span { color:var(--lime); margin-left:.5rem; }
.hero-side { position:absolute; right:clamp(1rem,3vw,3rem); top:50%; transform:translateY(-50%); writing-mode:vertical-rl; display:flex; align-items:center; gap:1rem; font-size:.55rem; letter-spacing:.24em; opacity:.65; }
.hero-side i { width:1px; height:70px; background:rgba(255,255,255,.5); }
.scroll-cue { position:absolute; bottom:2rem; left:clamp(1.5rem,4vw,5rem); display:flex; align-items:center; gap:.8rem; font-size:.56rem; letter-spacing:.2em; opacity:.75; }
.scroll-cue span { width:44px; height:1px; background:white; position:relative; overflow:hidden; }
.scroll-cue span::after { content:""; position:absolute; inset:0; background:var(--lime); animation:scrollLine 2.2s infinite; }
@keyframes scrollLine { from{transform:translateX(-100%)} 55%,100%{transform:translateX(100%)} }

.section-pad { padding:clamp(5rem,10vw,9rem) clamp(1.25rem,5vw,6rem); }
.section-kicker { display:flex; align-items:center; gap:.75rem; color:#58635b; }
.section-kicker span { color:var(--ink); }
.statement { background:var(--paper); }
.statement>.section-kicker { width:min(1280px,100%); margin:0 auto 3.5rem; }
.statement-grid { width:min(1280px,100%); margin:auto; display:grid; grid-template-columns:1.25fr .75fr; gap:10vw; align-items:start; }
.statement h2 { font-size:clamp(3rem,6vw,6.3rem); margin:0; }
.statement h2 em,.section-heading h2 em,.vision h2 em,.contact h2 em { color:#82974a; }
.statement-copy { padding-top:1rem; color:#4d5750; font-size:1.04rem; }
.statement-copy p:first-child { color:var(--ink); font-size:1.25rem; }
.underlined { display:inline-flex; gap:2rem; margin-top:1.5rem; padding-bottom:.3rem; color:var(--ink); font-size:.73rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; border-bottom:1px solid var(--ink); }

.ticker { overflow:hidden; background:var(--lime); padding:1.25rem 0; transform:rotate(-1.2deg) scale(1.03); position:relative; z-index:2; }
.ticker-track { display:flex; align-items:center; width:max-content; gap:2rem; animation:ticker 24s linear infinite; font-family:var(--serif); font-size:clamp(1.5rem,3vw,3.2rem); line-height:1; white-space:nowrap; }
.ticker-track i { font-family:var(--sans); font-size:.65em; font-style:normal; }
@keyframes ticker { to{transform:translateX(-50%)} }

.services { background:var(--ink); color:white; }
.section-heading { display:grid; grid-template-columns:1fr 1.1fr .8fr; gap:3rem; align-items:end; width:min(1280px,100%); margin:0 auto clamp(3.5rem,7vw,6rem); }
.section-heading .section-kicker { color:var(--muted); align-self:start; }
.section-heading .section-kicker span { color:var(--lime); }
.section-heading h2 { font-size:clamp(3rem,5.7vw,6rem); margin:0; }
.section-heading p { color:var(--muted); margin:0 0 .7rem; }
.service-list { width:min(1280px,100%); margin:auto; border-top:1px solid rgba(255,255,255,.16); }
.service-item { min-height:180px; display:grid; grid-template-columns:80px 1fr 80px; gap:2rem; align-items:center; border-bottom:1px solid rgba(255,255,255,.16); transition:.3s; }
.service-item:hover { padding-left:1rem; background:rgba(255,255,255,.025); }
.service-no { color:var(--lime); font-size:.65rem; letter-spacing:.15em; }
.service-item>div { display:grid; grid-template-columns:.8fr 1.2fr; gap:4rem; align-items:center; }
.service-item h3 { font-family:var(--serif); font-size:clamp(1.8rem,3.1vw,3.6rem); line-height:1; font-weight:400; margin:0; }
.service-item p { color:var(--muted); max-width:580px; margin:0; }
.service-icon { justify-self:end; width:54px; aspect-ratio:1; display:grid; place-items:center; border:1px solid rgba(255,255,255,.25); border-radius:50%; color:var(--lime); font-size:1.4rem; }

.field-work { background:#0d120f; color:white; padding:clamp(5rem,10vw,9rem) clamp(1.25rem,5vw,6rem); }
.field-head { width:min(1280px,100%); margin:0 auto clamp(3.5rem,6vw,5.5rem); display:grid; grid-template-columns:.7fr 1.25fr .75fr; gap:clamp(2rem,5vw,6rem); align-items:end; }
.field-head .section-kicker { color:var(--muted); align-self:start; }
.field-head .section-kicker span { color:var(--lime); }
.field-head h2 { font-family:var(--serif); font-size:clamp(3.2rem,5.7vw,6.2rem); font-weight:400; letter-spacing:-.055em; line-height:.94; margin:0; }
.field-head h2 em { color:var(--lime); }
.field-head>p { color:var(--muted); max-width:460px; margin:0 0 .65rem; }
.field-gallery { width:min(1280px,100%); margin:auto; display:grid; grid-template-columns:1.45fr .55fr; grid-template-rows:1fr 1fr; gap:1rem; min-height:720px; }
.field-card { position:relative; margin:0; overflow:hidden; min-height:340px; background:var(--ink-2); }
.field-card-wide { grid-row:1/3; }
.field-card img { width:100%; height:100%; object-fit:cover; filter:saturate(.7) contrast(1.08); transition:transform 1s ease,filter .4s ease; }
.field-card-wide img { object-position:center; }
.field-card::after { content:""; position:absolute; inset:25% 0 0; background:linear-gradient(transparent,rgba(7,11,8,.88)); pointer-events:none; }
.field-card::before { content:"ZER GROUP / SAHA"; position:absolute; z-index:2; top:1.4rem; left:1.5rem; color:rgba(255,255,255,.8); font-size:.52rem; font-weight:700; letter-spacing:.18em; }
.field-card:hover img { transform:scale(1.035); filter:saturate(.95) contrast(1.05); }
.field-card figcaption { position:absolute; z-index:2; left:clamp(1.2rem,3vw,2.5rem); right:clamp(1.2rem,3vw,2.5rem); bottom:clamp(1.2rem,3vw,2.3rem); color:white; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:.25rem 1rem; }
.field-card figcaption span { color:var(--lime); font-size:.62rem; letter-spacing:.15em; }
.field-card figcaption strong { font-family:var(--serif); font-size:clamp(1.2rem,1.8vw,1.9rem); font-weight:400; text-transform:capitalize; }
.field-card figcaption small { grid-column:2; color:rgba(255,255,255,.62); font-size:.72rem; }

.vision { display:grid; grid-template-columns:1fr 1fr; min-height:900px; background:#17201b; color:white; }
.vision-image { min-height:700px; overflow:hidden; }
.vision-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.72); transition:transform 1.1s ease; }
.vision-image:hover img { transform:scale(1.035); }
.vision-copy { display:flex; flex-direction:column; justify-content:center; }
.vision h2 { font-size:clamp(3.2rem,5.3vw,6rem); }
.vision-copy>p { color:var(--muted); max-width:630px; }
.principles { margin-top:3.5rem; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.18); }
.principles div { padding:1.4rem .6rem 0 0; display:flex; flex-direction:column; border-right:1px solid rgba(255,255,255,.18); }
.principles div+div { padding-left:1rem; }
.principles span { font-size:.58rem; color:var(--lime); }
.principles strong { font-family:var(--serif); font-size:1.4rem; font-weight:400; margin:.55rem 0 .3rem; }
.principles small { color:var(--muted); font-size:.7rem; }

.perspective { background:var(--paper); }
.perspective .section-heading,.process .section-heading,.faq .section-heading { grid-template-columns:1fr 1.9fr; }
.image-collage { width:min(1280px,100%); margin:auto; display:grid; grid-template-columns:1.55fr .9fr; grid-template-rows:auto auto; gap:2.5rem 4rem; }
.image-collage figure { margin:0; }
.collage-large { grid-row:1/3; }
.collage-large img { height:740px; }
.collage-small img { height:380px; }
.image-collage img { width:100%; object-fit:cover; filter:saturate(.75); }
.image-collage figcaption { padding-top:1rem; display:flex; gap:1rem; align-items:center; text-transform:uppercase; font-size:.68rem; letter-spacing:.13em; }
.image-collage figcaption span { color:#718345; }
.image-collage blockquote { margin:auto 0 0; font-family:var(--serif); font-size:clamp(1.5rem,2.5vw,2.6rem); line-height:1.35; font-style:italic; }

.process { background:#dfe2d6; }
.process-steps { width:min(1280px,100%); padding:0; margin:0 auto; list-style:none; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.process-steps li { padding:2rem 1.6rem 0 0; border-right:1px solid var(--line); min-height:300px; display:flex; flex-direction:column; justify-content:space-between; }
.process-steps li+li { padding-left:1.6rem; }
.process-steps>li>span { font-size:.63rem; color:#6d7e43; }
.process-steps h3 { font-family:var(--serif); font-size:2rem; font-weight:400; margin:0 0 .75rem; }
.process-steps p { color:#586159; font-size:.9rem; }

.faq { background:var(--paper); }
.faq-list { width:min(1280px,100%); margin:auto; border-top:1px solid var(--line); }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.6rem 0; font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.9rem); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary span { font-family:var(--sans); font-weight:300; transition:.25s; }
.faq details[open] summary span { transform:rotate(45deg); }
.faq details p { max-width:780px; color:#5c665f; margin:-.4rem 0 2rem; }

.contact { background:var(--lime); display:grid; grid-template-columns:1fr .75fr; gap:10vw; }
.contact .section-kicker { color:#526131; }
.contact h2 { font-size:clamp(3.2rem,6vw,6.5rem); }
.contact h2 em { color:var(--ink); font-style:italic; }
.phone-link { display:inline-flex; flex-direction:column; position:relative; margin-top:2rem; font-family:var(--serif); font-size:clamp(1.4rem,2.4vw,2.7rem); }
.phone-link small { font-family:var(--sans); font-size:.57rem; font-weight:700; letter-spacing:.2em; margin-bottom:.25rem; }
.phone-link span { position:absolute; right:-2rem; bottom:.3rem; font-family:var(--sans); font-size:1rem; }
.contact-form { align-self:center; background:var(--white); padding:clamp(1.5rem,4vw,3.5rem); box-shadow:0 24px 60px rgba(17,24,20,.14); }
.contact-form label { display:block; text-transform:uppercase; font-size:.62rem; font-weight:800; letter-spacing:.12em; margin-bottom:1.7rem; }
.contact-form input,.contact-form select,.contact-form textarea { display:block; width:100%; border:0; border-bottom:1px solid #b9beb9; background:transparent; padding:.8rem 0; color:var(--ink); outline:none; text-transform:none; letter-spacing:normal; resize:vertical; border-radius:0; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color:var(--ink); }
.button-accent { width:100%; background:var(--ink); color:white; }
.button-accent:hover { background:#28332c; }
.form-note { color:#747b76; font-size:.68rem; text-align:center; margin:1rem 0 0; }

.footer { background:#0d120f; color:white; padding:5rem clamp(1.25rem,5vw,6rem) 1.5rem; }
.footer-top { width:min(1280px,100%); margin:auto; display:grid; grid-template-columns:1fr 1fr auto; gap:4rem; padding-bottom:5rem; }
.brand-footer { color:white; }
.footer-top>p { margin:0; color:#8f9992; font-family:var(--serif); font-size:1.5rem; line-height:1.35; }
.footer-links { display:grid; grid-template-columns:1fr 1fr; gap:.6rem 3rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.footer-links a:hover { color:var(--lime); }
.footer-bottom { width:min(1280px,100%); margin:auto; border-top:1px solid rgba(255,255,255,.15); padding-top:1.3rem; display:flex; justify-content:space-between; color:#778079; font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; }
.footer-bottom a { color:white; }
.whatsapp-float { position:fixed; z-index:50; right:1.3rem; bottom:1.3rem; display:flex; align-items:center; gap:.55rem; background:#24d366; color:#08120b; height:52px; padding:0 1rem; border-radius:30px; box-shadow:0 10px 35px rgba(0,0,0,.24); font-size:.75rem; transition:.25s; }
.whatsapp-float:hover { transform:translateY(-3px); }
.whatsapp-float span { font-size:1.25rem; }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .75s ease,transform .75s ease; }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width:980px) {
  .site-header { grid-template-columns:1fr auto; height:78px; }
  .menu-toggle { display:block; justify-self:end; z-index:2; }
  .header-cta { display:none; }
  .main-nav { position:fixed; inset:0; background:var(--ink); flex-direction:column; justify-content:center; gap:2rem; font-family:var(--serif); font-size:2rem; transform:translateX(100%); transition:transform .35s ease; }
  .menu-open .main-nav { transform:none; }
  .menu-open .menu-toggle span:first-child { transform:translateY(3.5px) rotate(45deg); }
  .menu-open .menu-toggle span:last-child { transform:translateY(-3.5px) rotate(-45deg); }
  .statement-grid,.section-heading,.perspective .section-heading,.process .section-heading,.faq .section-heading,.contact { grid-template-columns:1fr; }
  .section-heading { align-items:start; }
  .section-heading p { max-width:620px; }
  .service-item>div { grid-template-columns:1fr; gap:.7rem; }
  .field-head { grid-template-columns:1fr 1.5fr; }
  .field-head>p { grid-column:2; }
  .field-gallery { min-height:780px; }
  .vision { grid-template-columns:1fr; }
  .vision-image { min-height:520px; }
  .image-collage { grid-template-columns:1fr 1fr; gap:2rem; }
  .collage-large { grid-row:auto; }
  .collage-large img,.collage-small img { height:450px; }
  .image-collage blockquote { grid-column:1/-1; }
  .process-steps { grid-template-columns:1fr 1fr; }
  .process-steps li { border-bottom:1px solid var(--line); }
  .contact { gap:4rem; }
  .footer-top { grid-template-columns:1fr 1fr; }
  .footer-links { grid-column:1/-1; }
}

@media (max-width:640px) {
  .brand-mark { width:36px; }
  .hero-content { width:calc(100% - 2.5rem); padding-bottom:7rem; }
  .hero h1 { font-size:clamp(3.3rem,16vw,5.2rem); }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:1.2rem; }
  .hero-side { display:none; }
  .section-pad { padding:4.5rem 1.25rem; }
  .statement-grid { gap:2rem; }
  .ticker { padding:.85rem 0; }
  .service-item { grid-template-columns:36px 1fr; gap:1rem; padding:1.5rem 0; }
  .service-icon { display:none; }
  .field-work { padding:4.5rem 1.25rem; }
  .field-head { grid-template-columns:1fr; gap:1.5rem; }
  .field-head>p { grid-column:auto; }
  .field-gallery { grid-template-columns:1fr; grid-template-rows:none; min-height:0; gap:.75rem; }
  .field-card,.field-card-wide { grid-row:auto; min-height:420px; }
  .vision { min-height:0; }
  .vision-image { min-height:420px; }
  .principles { grid-template-columns:1fr; }
  .principles div { border-right:0; border-bottom:1px solid rgba(255,255,255,.18); padding:1rem 0; }
  .principles div+div { padding-left:0; }
  .image-collage { grid-template-columns:1fr; }
  .collage-large img,.collage-small img { height:430px; }
  .image-collage blockquote { grid-column:auto; }
  .process-steps { grid-template-columns:1fr; }
  .process-steps li { min-height:230px; padding-right:0; border-right:0; }
  .process-steps li+li { padding-left:0; }
  .contact-form { padding:1.5rem; }
  .footer-top { grid-template-columns:1fr; padding-bottom:3rem; }
  .footer-links { grid-column:auto; }
  .footer-bottom { flex-direction:column; gap:.6rem; }
  .whatsapp-float b { display:none; }
  .whatsapp-float { width:52px; padding:0; justify-content:center; }
}

@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.ticker-track,.scroll-cue span::after{animation:none}.reveal{opacity:1;transform:none;transition:none}*{transition-duration:.01ms!important} }