/* ============================================================
   ROÇEV — site.css  (logo-renk teması, açık koyu zemin)
   Bricolage Grotesque (başlık) + Sora (metin) + Space Mono (etiket)
   ============================================================ */
:root{
  --ink:#141824;
  --ink-2:#191E2C;
  --ink-3:#1F2536;
  --card:#232A3D;
  --card-2:#283045;
  --line:rgba(240,240,248,.10);
  --line-2:rgba(240,240,248,.18);
  --cream:#F3F1EC;
  --muted:rgba(243,241,236,.68);
  --muted-2:rgba(243,241,236,.46);
  --orange:#FF7A2E;
  --orange-2:#FF9A5A;
  --blue:#5468FF;
  --blue-2:#8A99FF;
  --danger:#FF6A4D;
  --safe:#37D9A0;
  --wa:#25D366;
  --max:1300px;
  --radius:14px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--ink); color:var(--cream); font-family:'Sora',system-ui,-apple-system,sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; line-height:1.6;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
::selection{background:var(--orange); color:#0c0f17;}
.grot{font-family:'Bricolage Grotesque','Sora',sans-serif;}
.mono{font-family:'Space Mono',ui-monospace,monospace;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}
@media (max-width:600px){ .wrap{padding:0 20px;} }

/* ---------- buttons ---------- */
.btn-primary,.btn-ghost,.btn-wa{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 26px; border-radius:100px; font-size:15px; font-weight:600; transition:.22s cubic-bezier(.2,.7,.2,1); border:1px solid transparent; cursor:pointer;}
.btn-primary{background:var(--orange); color:#0c0f17;}
.btn-primary:hover{background:var(--orange-2); transform:translateY(-2px); box-shadow:0 12px 30px rgba(255,122,46,.30);}
.btn-ghost{border-color:var(--line-2); color:var(--cream); background:transparent;}
.btn-ghost:hover{border-color:var(--cream); transform:translateY(-2px);}
.btn-wa{background:var(--wa); color:#0c0f17;}
.btn-wa:hover{transform:translateY(-2px); box-shadow:0 12px 30px rgba(37,211,102,.28);}
.btn-primary svg,.btn-ghost svg,.btn-wa svg,.btn-dark svg,.btn-outline-dark svg{width:17px; height:17px; flex:0 0 auto;}
a[href^="https://wa.me/"]>svg{display:none}
a[href^="https://wa.me/"]::before{content:"";display:inline-block;width:18px;height:18px;flex:0 0 auto;background:url("../assets/icons/whatsapp-svgrepo-com.svg") center/contain no-repeat}
.header-cta-icon[href^="https://wa.me/"]::before,.header-cta-btn[href^="https://wa.me/"]::before{width:20px;height:20px}
.quote-v2[href^="https://wa.me/"]::before{width:20px;height:20px}
.footer-brand .socials a[href^="https://wa.me/"]::before{width:18px;height:18px}
.sticky-cta-btn[href^="https://wa.me/"]::before{width:17px;height:17px}

/* Shared arrow asset: prevents platform-specific text/emoji rendering. */
.trend-arrow{display:inline-block;width:1.05em;height:1.05em;flex:0 0 auto;background:currentColor;-webkit-mask:url("../assets/icons/arrow-trend-up.svg") center/contain no-repeat;mask:url("../assets/icons/arrow-trend-up.svg") center/contain no-repeat;vertical-align:-.12em}
.scroll-top-btn svg{display:none}
.scroll-top-btn::before{content:"";display:block;width:19px;height:19px;background:currentColor;-webkit-mask:url("../assets/icons/arrow-trend-up.svg") center/contain no-repeat;mask:url("../assets/icons/arrow-trend-up.svg") center/contain no-repeat;transform:rotate(-45deg)}

/* ---------- header ---------- */
#siteHeader{position:sticky; top:0; z-index:100; background:rgba(20,24,36,.72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line); transition:padding .3s ease;}
#siteHeader{display:flex; align-items:center; gap:24px; max-width:var(--max); margin:0 auto; padding:14px 32px;}
@media (min-width:1301px){ #siteHeader{padding-left:32px;padding-right:32px;} }
#siteHeader.shrink{padding-top:9px; padding-bottom:9px;}
.brand{display:flex; align-items:center; gap:12px; position:relative;}
.brand::before{content:''; position:absolute; inset:-16px -22px; z-index:-1; pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.65) 0%, rgba(255,255,255,.32) 38%, rgba(255,255,255,0) 72%);
  filter:blur(14px); transition:inset .3s ease, opacity .3s ease;}
.brand img{position:relative; height:86px; width:auto; transition:height .3s ease;}
.brand-label{position:relative; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:16px; letter-spacing:-.01em; color:var(--cream); white-space:nowrap; transition:font-size .3s ease;}
#siteHeader.shrink .brand::before{inset:-10px -16px;}
#siteHeader.shrink .brand img{height:66px;}
#siteHeader.shrink .brand-label{font-size:14px;}
@media (max-width:600px){ .brand-label{font-size:12.5px;} }
.header-right{display:flex; align-items:center; gap:12px; margin-left:auto;}
.header-cta-icon{display:flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:50%; border:1px solid var(--line-2); color:var(--cream); flex-shrink:0; transition:.25s;}
.header-cta-icon:hover{background:var(--wa); border-color:var(--wa); color:#0c0f17; transform:translateY(-2px);}
.header-cta-icon svg{width:20px; height:20px;}
.header-cta-btn{padding:12px 22px;}
.nav-trigger{display:flex; align-items:center; gap:11px; background:none; border:1px solid var(--line-2); border-radius:100px; cursor:pointer; padding:10px 16px; color:var(--cream); transition:.2s;}
.nav-trigger:hover{border-color:var(--cream);}
.nav-trigger .dots{display:grid; grid-template-columns:repeat(3,4px); gap:3px;}
.nav-trigger .dots span{width:4px; height:4px; border-radius:50%; background:var(--cream);}
.nav-trigger .lbl{font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;}
@media (max-width:820px){ .header-cta-btn{display:none;} }
@media (max-width:600px){ .nav-trigger .lbl{display:none;} .brand::before{inset:-10px -14px;} .brand img{height:50px;} #siteHeader.shrink .brand img{height:42px;} #siteHeader{padding:12px 20px;} }

/* ---------- eyebrow / kicker ---------- */
.eyebrow{display:inline-flex; align-items:center; gap:9px; padding:8px 15px; border:1px solid rgba(255,122,46,.42); border-radius:100px; color:var(--orange-2); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase;}
.eyebrow .dot{width:7px; height:7px; border-radius:50%; background:var(--orange); box-shadow:0 0 0 0 rgba(255,122,46,.6); animation:pulse 2.4s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,122,46,.5);}70%{box-shadow:0 0 0 9px rgba(255,122,46,0);}100%{box-shadow:0 0 0 0 rgba(255,122,46,0);}}
.kicker{font-family:'Space Mono',monospace; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--orange-2); display:inline-flex; align-items:center; gap:10px;}
.kicker::before{content:""; width:26px; height:1px; background:var(--orange);}

/* ============ PAGE HERO (inner pages) ============ */
.page-hero{position:relative; overflow:hidden; padding:72px 0 64px; border-bottom:1px solid var(--line);
  background:
    radial-gradient(70% 90% at 85% 0%, rgba(255,122,46,.14), transparent 55%),
    radial-gradient(60% 80% at 5% 10%, rgba(84,104,255,.12), transparent 55%),
    var(--ink);}
.page-hero .wrap-inner{max-width:var(--max); margin:0 auto; padding:0 32px;}
.breadcrumb{font-family:'Space Mono',monospace; font-size:12px; letter-spacing:.04em; color:var(--muted-2); display:flex; gap:10px; margin-bottom:22px;}
.breadcrumb a:hover{color:var(--orange);}
.page-hero h1{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(34px,5vw,64px); line-height:1.02; letter-spacing:-.03em; margin:18px 0 0; max-width:760px;}
.page-hero p{font-size:clamp(15.5px,1.4vw,18px); color:var(--muted); margin:22px 0 0; max-width:620px; line-height:1.6;}
.pill-cloud{display:flex; flex-wrap:wrap; gap:10px; margin-top:28px;}
.pill-cloud a,.pill-cloud span{padding:9px 16px; border:1px solid var(--line-2); border-radius:100px; font-size:13.5px; color:var(--muted); transition:.2s;}
.pill-cloud a:hover{border-color:var(--orange); color:var(--orange);}

/* ============ MARQUEE ============ */
.marquee-wrap{background:var(--orange); overflow:hidden; padding:15px 0;}
.marquee{display:flex; width:max-content; animation:scrollX 36s linear infinite;}
.marquee span{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:19px; letter-spacing:-.01em; color:#12131a; padding-right:26px; white-space:nowrap; display:flex; align-items:center; gap:26px;}
.marquee span::after{content:"◆"; font-size:11px; opacity:.5;}
@keyframes scrollX{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ============ SECTION SHELL ============ */
.section{padding:100px 0;}
.section.bg-panel{background:var(--ink-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.section-head{max-width:var(--max); margin:0 auto; padding:0 32px;}
.section-head.center{text-align:center;}
.section-head.center .kicker{justify-content:center;}
.section-head .big-title,.big-title{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(28px,4.2vw,52px); line-height:1.04; letter-spacing:-.03em; margin:16px 0 0;}
.section-head .section-sub,.section-sub{font-size:15.5px; color:var(--muted); margin:16px auto 0; max-width:560px; line-height:1.6;}
.sec-head{max-width:var(--max); margin:0 auto; padding:0 32px; display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap;}
.sec-head h2{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(28px,4.2vw,52px); line-height:1.02; letter-spacing:-.03em; margin:14px 0 0; max-width:620px;}
.sec-head .more{font-family:'Space Mono',monospace; font-size:13px; color:var(--muted); padding-bottom:8px; border-bottom:1px solid var(--line-2); transition:.2s; white-space:nowrap;}
.sec-head .more:hover{color:var(--orange); border-color:var(--orange);}

/* ============ SERVICES GRID (home) ============ */
.svc-grid{max-width:var(--max); margin:48px auto 0; padding:0 32px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.svc-card{position:relative; padding:30px 28px; background:var(--ink-2); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:.3s cubic-bezier(.2,.7,.2,1); min-height:248px; display:flex; flex-direction:column;}
.svc-card::before{content:""; position:absolute; left:0; top:0; height:3px; width:0; background:var(--orange); transition:width .35s ease;}
.svc-card:hover{transform:translateY(-6px); border-color:var(--line-2); background:var(--ink-3);}
.svc-card:hover::before{width:100%;}
.svc-card .no{font-family:'Space Mono',monospace; font-size:12px; color:var(--orange); letter-spacing:.08em;}
.svc-card .ic{width:46px; height:46px; margin-top:20px; border:1px solid var(--line-2); border-radius:11px; display:flex; align-items:center; justify-content:center; color:var(--blue-2); transition:.3s;}
.svc-card:hover .ic{border-color:var(--orange); color:var(--orange);}
.svc-card .ic svg{width:23px; height:23px;}
.svc-card h3{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:21px; line-height:1.18; letter-spacing:-.02em; margin:20px 0 0;}
.svc-card p{font-size:14px; line-height:1.62; color:var(--muted); margin:11px 0 0;}
.svc-card .go{margin-top:auto; padding-top:16px; font-family:'Space Mono',monospace; font-size:12px; color:var(--muted-2); display:inline-flex; align-items:center; gap:7px; transition:.2s;}
.svc-card:hover .go{color:var(--cream);}
.svc-card .go svg{width:13px; height:13px; transition:transform .25s;}
.svc-card:hover .go svg{transform:translateX(4px);}
@media (max-width:900px){ .svc-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .svc-grid{grid-template-columns:1fr; padding:0 20px;} }

/* ============ PROCESS FLOW (animated) ============ */
.flow-track{position:relative; max-width:var(--max); margin:52px auto 0; padding:0 32px; display:flex; align-items:center; justify-content:space-between; height:14px;}
.flow-line{position:absolute; left:32px; right:32px; top:50%; height:2px; margin-top:-1px; overflow:hidden;
  background-image:repeating-linear-gradient(90deg, var(--orange) 0 10px, transparent 10px 22px);
  background-size:32px 2px; animation:flowDash 1.1s linear infinite;}
@keyframes flowDash{ to{ background-position:-32px 0; } }
.flow-packet{position:absolute; top:50%; left:0; width:7px; height:7px; margin-top:-3.5px; border-radius:50%;
  background:var(--orange); box-shadow:0 0 10px 2px rgba(255,122,46,.7); animation:flowRun 3.6s cubic-bezier(.4,.05,.3,.95) infinite;}
.flow-packet.p2{animation-delay:1.8s; opacity:.7;}
@keyframes flowRun{ 0%{ left:0%; opacity:0; } 6%{ opacity:1; } 94%{ opacity:1; } 100%{ left:100%; opacity:0; } }
.flow-node{position:relative; width:14px; height:14px; z-index:2;}
.flow-node .dot{position:absolute; inset:0; border-radius:50%; background:var(--orange); box-shadow:0 0 0 4px var(--ink-2);}
.flow-node .ring{position:absolute; inset:-8px; border-radius:50%; border:1px solid var(--orange); opacity:0; animation:flowPulse 3.6s ease-out infinite;}
.flow-node:nth-child(2) .ring{animation-delay:.15s;}
.flow-node:nth-child(3) .ring{animation-delay:1.35s;}
.flow-node:nth-child(4) .ring{animation-delay:2.55s;}
@keyframes flowPulse{ 0%{ transform:scale(.4); opacity:.9; } 70%{ opacity:0; } 100%{ transform:scale(1.8); opacity:0; } }
@media (max-width:860px){ .flow-track{display:none;} }

/* ============ PROCESS ============ */
.proc-grid{max-width:var(--max); margin:20px auto 0; padding:0 32px; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line);}
.proc{position:relative; padding:32px 24px; border-left:1px solid var(--line);}
.proc:first-child{border-left:none;}
.proc .pn{font-family:'Space Mono',monospace; font-size:13px; color:var(--orange); letter-spacing:.08em;}
.proc .bar{height:2px; background:var(--line-2); margin:18px 0 20px; position:relative; overflow:hidden; border-radius:2px;}
.proc .bar i{position:absolute; left:0; top:0; height:100%; background:var(--orange);}
.proc h3{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:19px; letter-spacing:-.01em;}
.proc p{font-size:13.5px; line-height:1.6; color:var(--muted); margin:9px 0 0;}
@media (max-width:860px){ .proc-grid{grid-template-columns:1fr 1fr; padding:0 20px;} .proc:nth-child(3){border-left:none;} }
@media (max-width:520px){ .proc-grid{grid-template-columns:1fr;} .proc{border-left:none; border-top:1px solid var(--line);} .proc:first-child{border-top:none;} }

/* ============ SPLIT (why / about / services detail) ============ */
.split{max-width:var(--max); margin:0 auto; padding:0 32px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; align-items:center;}
.split.reverse .split-copy{order:2;}
.split.reverse .svc-visual{order:1;}
.split-copy h2, .split-copy .big-title{margin-top:14px;}
.split-copy>p{font-size:15.5px; line-height:1.7; color:var(--muted); margin-top:20px; max-width:540px;}
.split-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px;}
.mini-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:26px;}
.mini-tile{padding:18px 18px; background:var(--ink-2); border:1px solid var(--line); border-radius:12px;}
.mini-tile strong{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:15px; display:block;}
.mini-tile span{font-size:13px; color:var(--muted); margin-top:6px; display:block; line-height:1.5;}
.arrow-list{list-style:none; margin-top:24px; display:flex; flex-direction:column; gap:2px;}
.arrow-list li{display:flex; gap:14px; padding:15px 0; border-top:1px solid var(--line); font-size:14.5px; color:var(--muted); line-height:1.5;}
.arrow-list .arrow{color:var(--orange); font-weight:700;}
/* generic visual box */
.svc-visual{position:relative; min-height:340px; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--ink-3);
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:38px 38px;
  display:flex; align-items:center; justify-content:center;}
.svc-visual::before{content:""; position:absolute; inset:0; background:radial-gradient(60% 60% at 32% 30%, rgba(84,104,255,.20), transparent 60%), radial-gradient(60% 60% at 74% 78%, rgba(255,122,46,.20), transparent 60%);}
.svc-visual .blob{position:relative; width:180px; height:180px; display:flex; align-items:center; justify-content:center;}
.svc-visual .blob svg{width:120px; height:120px; stroke:var(--orange); fill:none; filter:drop-shadow(0 0 18px rgba(255,122,46,.5));}
.svc-visual .blob.b-2 svg{fill:var(--orange); stroke:none;}
@media (max-width:900px){ .split{grid-template-columns:1fr; gap:36px;} .split.reverse .split-copy{order:1;} .split.reverse .svc-visual{order:2;} .mini-grid{grid-template-columns:1fr 1fr;} .split{padding:0 20px;} }
@media (max-width:480px){ .mini-grid{grid-template-columns:1fr;} }

/* ============ TYPE GRID (atık türleri) ============ */
.type-grid{max-width:var(--max); margin:44px auto 0; padding:0 32px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.type-card{padding:26px 24px; background:var(--ink-2); border:1px solid var(--line); border-radius:var(--radius); transition:.3s;}
.type-card:hover{transform:translateY(-5px); border-color:var(--line-2); background:var(--ink-3);}
.icon-badge{width:48px; height:48px; border-radius:12px; background:rgba(255,122,46,.12); border:1px solid rgba(255,122,46,.3); display:flex; align-items:center; justify-content:center; color:var(--orange);}
.icon-badge svg{width:24px; height:24px;}
.type-tag{display:inline-block; margin-top:18px; padding:4px 11px; border-radius:100px; font-family:'Space Mono',monospace; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase;}
.type-tag.danger{background:rgba(255,106,77,.14); color:var(--danger); border:1px solid rgba(255,106,77,.3);}
.type-tag.safe{background:rgba(55,217,160,.12); color:var(--safe); border:1px solid rgba(55,217,160,.3);}
.type-card h4{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:18px; letter-spacing:-.01em; margin:14px 0 0;}
.type-card p{font-size:13.5px; line-height:1.55; color:var(--muted); margin:10px 0 0;}
.type-card ul{list-style:none; margin:14px 0 0; display:flex; flex-wrap:wrap; gap:7px;}
.type-card ul li{font-size:12px; color:var(--muted-2); padding:5px 10px; border:1px solid var(--line); border-radius:100px;}
@media (max-width:900px){ .type-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .type-grid{grid-template-columns:1fr; padding:0 20px;} }

/* ============ FAQ ============ */
.faq-list{max-width:900px; margin:36px auto 0; padding:0 32px;}
.faq-item{border-top:1px solid var(--line);}
.faq-item summary{list-style:none; cursor:pointer; padding:22px 40px 22px 0; font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:17px; position:relative; transition:color .2s;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; position:absolute; right:4px; top:50%; transform:translateY(-50%); font-size:24px; color:var(--orange); transition:transform .25s;}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg);}
.faq-item summary:hover{color:var(--orange);}
.faq-item p{font-size:14.5px; line-height:1.65; color:var(--muted); padding:0 40px 22px 0;}
@media (max-width:600px){ .faq-list{padding:0 20px;} }

/* ============ CARD GRIDS (about) ============ */
.card-grid-2{max-width:var(--max); margin:0 auto; padding:0 32px; display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.card-grid-4{max-width:var(--max); margin:44px auto 0; padding:0 32px; display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.glass-card{padding:28px 26px; background:var(--ink-3); border:1px solid var(--line); border-radius:var(--radius); transition:.3s;}
.glass-card:hover{transform:translateY(-5px); border-color:var(--line-2);}
.glass-card h3{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:20px; margin:18px 0 0; letter-spacing:-.01em;}
.glass-card h4{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:16.5px; margin:16px 0 0; letter-spacing:-.01em;}
.glass-card p{font-size:14px; line-height:1.62; color:var(--muted); margin:10px 0 0;}
@media (max-width:860px){ .card-grid-4{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .card-grid-2,.card-grid-4{grid-template-columns:1fr; padding:0 20px;} }

/* ============ CONTACT ============ */
.contact-grid{max-width:var(--max); margin:0 auto; padding:0 32px; display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:22px; align-items:start;}
.info-card,.form-card{background:var(--ink-2); border:1px solid var(--line); border-radius:var(--radius); padding:32px 30px;}
.info-card h3,.form-card h3{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:22px; letter-spacing:-.01em;}
.info-card>p,.form-card>p{font-size:14px; color:var(--muted); margin-top:8px;}
.info-row{display:flex; gap:16px; align-items:flex-start; margin-top:24px;}
.info-row .ic{width:44px; height:44px; flex-shrink:0; border-radius:11px; background:rgba(255,122,46,.12); border:1px solid rgba(255,122,46,.3); display:flex; align-items:center; justify-content:center; color:var(--orange);}
.info-row .ic svg{width:21px; height:21px;}
.info-row strong{font-size:13px; color:var(--muted-2); font-weight:600; display:block; margin-bottom:3px;}
.info-row a,.info-row span{font-size:15px; color:var(--cream); line-height:1.5;}
.info-row a:hover{color:var(--orange);}
/* form */
.form-row-2{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.field{margin-top:16px; display:flex; flex-direction:column;}
.field label{font-size:12.5px; color:var(--muted); margin-bottom:7px;}
.field input,.field select,.field textarea{background:var(--ink); border:1px solid var(--line-2); border-radius:10px; padding:13px 15px; color:var(--cream); font-family:inherit; font-size:14.5px; transition:.2s;}
.field textarea{min-height:120px; resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,122,46,.14);}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-2);}
.hp-field{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
.form-note{font-size:12px; color:var(--muted-2); margin-top:14px; text-align:center;}
.form-success-msg,.form-error-msg{display:none; align-items:center; gap:10px; padding:14px 16px; border-radius:10px; font-size:14px; margin-bottom:16px;}
.form-success-msg{background:rgba(55,217,160,.12); border:1px solid rgba(55,217,160,.35); color:var(--safe);}
.form-error-msg{background:rgba(255,106,77,.12); border:1px solid rgba(255,106,77,.35); color:var(--danger);}
.form-success-msg.show,.form-error-msg.show{display:flex;}
@media (max-width:860px){ .contact-grid{grid-template-columns:1fr; padding:0 20px;} }
@media (max-width:480px){ .form-row-2{grid-template-columns:1fr;} }

/* ============ MAP ============ */
.map-panel{max-width:var(--max); margin:36px auto 0; padding:0 32px;}
.map-frame{border:1px solid var(--line-2); border-radius:var(--radius); overflow:hidden; height:400px;}
.map-frame iframe{width:100%; height:100%; border:0; filter:grayscale(.2) contrast(1.05);}
.map-caption{display:flex; gap:14px; align-items:flex-start; margin-top:18px; color:var(--muted); }
.map-caption svg{color:var(--orange); flex-shrink:0; stroke:currentColor; fill:none;}
.map-caption strong{color:var(--cream); font-size:14.5px; display:block;}
.map-caption span{font-size:13px; display:block; margin-top:4px;}
@media (max-width:600px){ .map-panel{padding:0 20px;} }

/* ============ CTA PANEL / BAND ============ */
.cta-panel{padding:90px 0;}
.cta-card{max-width:960px; margin:0 auto; text-align:center; position:relative; overflow:hidden; background:linear-gradient(120deg,var(--orange),#FF9A5A); color:#12131a; border-radius:22px; padding:64px 40px;}
.cta-card::after{content:""; position:absolute; inset:0; opacity:.12; background-image:linear-gradient(#12131a 1px,transparent 1px),linear-gradient(90deg,#12131a 1px,transparent 1px); background-size:44px 44px;}
.cta-card h2{position:relative; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(28px,4vw,46px); line-height:1.02; letter-spacing:-.03em;}
.cta-card p{position:relative; font-size:16px; margin:16px auto 28px; max-width:520px; opacity:.85;}
.cta-card .btn-primary{position:relative; background:#12131a; color:var(--cream);}
.cta-card .btn-primary:hover{background:#000; box-shadow:0 12px 30px rgba(0,0,0,.3);}
/* home CTA band variant */
.cta-band{position:relative; overflow:hidden; background:linear-gradient(120deg,var(--orange),#FF9A5A); color:#12131a;}
.cta-band .grid-bg{position:absolute; inset:0; opacity:.12; background-image:linear-gradient(#12131a 1px,transparent 1px),linear-gradient(90deg,#12131a 1px,transparent 1px); background-size:50px 50px;}
.cta-inner{position:relative; max-width:var(--max); margin:0 auto; padding:78px 32px; display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;}
.cta-inner h2{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(30px,4.4vw,54px); line-height:.98; letter-spacing:-.03em;}
.cta-inner p{font-size:16px; margin-top:16px; max-width:440px; opacity:.85;}
.cta-actions{display:flex; flex-direction:column; gap:12px; min-width:280px;}
.cta-actions a{justify-content:center; padding:17px 26px;}
.btn-dark{background:#12131a; color:var(--cream);}
.btn-dark:hover{transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,0,0,.3);}
.btn-outline-dark{border:1px solid rgba(18,19,26,.4); color:#12131a; background:transparent;}
.btn-outline-dark:hover{border-color:#12131a; background:rgba(18,19,26,.06);}
@media (max-width:600px){ .cta-card{padding:48px 24px;} .cta-inner{padding:56px 20px;} }

/* ============ FOOTER ============ */
footer{background:var(--ink-2); border-top:1px solid var(--line); padding:64px 0 28px;}
.footer-top{max-width:var(--max); margin:0 auto; padding:0 32px; display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px;}
.footer-brand img{height:46px; width:auto; margin-bottom:18px;}
.footer-brand p{font-size:13.5px; line-height:1.7; color:var(--muted); max-width:300px;}
.footer-brand .socials{display:flex; gap:10px; margin-top:20px;}
.footer-brand .socials a{width:38px; height:38px; border:1px solid var(--line-2); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--muted); transition:.22s;}
.footer-brand .socials a:hover{background:var(--orange); border-color:var(--orange); color:#12131a;}
.footer-brand .socials svg{width:17px; height:17px;}
.footer-col .lbl{font-family:'Space Mono',monospace; font-size:11px; letter-spacing:.16em; color:var(--muted-2); text-transform:uppercase; display:block; margin-bottom:18px;}
.footer-col a,.footer-col span{display:block; font-size:14px; color:var(--muted); margin-bottom:12px; line-height:1.5; transition:.2s;}
.footer-col a:hover{color:var(--orange);}
.footer-bottom{max-width:var(--max); margin:52px auto 0; padding:22px 32px 0; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-family:'Space Mono',monospace; font-size:11px; letter-spacing:.03em; color:var(--muted-2);}

/* Light footer shared by every page */
footer{background:#e8eddf;color:#0d1719;border-top-color:#a7b0a7;}
.footer-brand p,.footer-col a,.footer-col span{color:#52605a;}
.footer-col .lbl{color:#71817c;}
.footer-col a:hover{color:#0d1719;}
.footer-brand .socials a{color:#52605a;border-color:#a7b0a7;}
.footer-brand .socials a:hover{background:#d3ff4f;border-color:#d3ff4f;color:#0d1719;}
.footer-bottom{color:#71817c;border-top-color:#a7b0a7;}
@media (max-width:860px){ .footer-top{grid-template-columns:1fr 1fr; padding:0 20px;} .footer-brand{grid-column:1/-1;} }
@media (max-width:520px){ .footer-top{grid-template-columns:1fr;} .footer-bottom{padding:22px 20px 0;} }

/* ============ NAV OVERLAY ============ */
.nav-overlay{position:fixed; inset:0; z-index:200; background:var(--ink); display:grid; grid-template-columns:1fr 1fr; opacity:0; pointer-events:none; transition:opacity .4s ease;}
.nav-overlay.open{opacity:1; pointer-events:all;}
.nav-overlay::before{content:""; position:absolute; inset:0; opacity:.4; background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:70px 70px;}
.nav-overlay .close-btn{position:fixed; top:20px; right:32px; z-index:210; display:flex; align-items:center; gap:10px; background:none; border:1px solid var(--line-2); border-radius:100px; padding:10px 16px; cursor:pointer; color:var(--cream);}
.nav-overlay .close-btn .lbl{font-size:11px; letter-spacing:.14em; text-transform:uppercase;}
.nav-cell{position:relative; border-top:1px solid var(--line); border-left:1px solid var(--line); display:flex; align-items:center; padding:0 clamp(28px,5vw,64px); min-height:22vh; transition:background .25s;}
.nav-cell:nth-child(odd){border-left:none;}
.nav-cell:hover{background:var(--ink-2);}
.nav-cell a{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:clamp(26px,4.4vw,50px); letter-spacing:-.02em; transition:color .2s;}
.nav-cell:hover a{color:var(--orange);}
@media (max-width:700px){ .nav-overlay{grid-template-columns:1fr;} .nav-cell{border-left:none !important; min-height:15vh;} }

/* ============ STICKY MOBILE CTA + SCROLL TOP ============ */
.sticky-cta{display:none;}
@media (max-width:760px){
  body{padding-bottom:62px;}
  .sticky-cta{position:fixed; bottom:0; left:0; right:0; z-index:150; display:flex; background:var(--ink-2); border-top:1px solid var(--line);}
  .sticky-cta-btn{flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:17px 10px; font-weight:600; font-size:14px;}
  .sticky-cta-btn svg{width:16px; height:16px;}
  .sticky-cta-btn.call{background:var(--wa); color:#12131a;}
  .sticky-cta-btn.quote{color:var(--cream); border-left:1px solid var(--line);}
}
.scroll-top-btn{position:fixed; right:22px; bottom:26px; z-index:140; width:46px; height:46px; border-radius:50%; background:var(--ink-3); border:1px solid var(--line-2); color:var(--cream); display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; pointer-events:none; transform:translateY(12px); transition:.28s;}
.scroll-top-btn.show{opacity:1; pointer-events:all; transform:translateY(0);}
.scroll-top-btn:hover{background:var(--orange); border-color:var(--orange); color:#12131a;}
@media (max-width:760px){ .scroll-top-btn{bottom:80px; right:16px; width:42px; height:42px;} }

/* ============ REVEAL ============ */
.reveal{opacity:0; transform:translateY(24px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1; transform:translateY(0);}
.reveal.d1{transition-delay:.08s;} .reveal.d2{transition-delay:.16s;} .reveal.d3{transition-delay:.24s;}
@media (prefers-reduced-motion:reduce){ *{animation:none !important;} .reveal{opacity:1; transform:none; transition:none;} }