/* ============================================================
   GigCraft Technologies — shared stylesheet
   Signature concept: "Signal Channels" — each practice area
   carries its own fixed accent color everywhere it appears
   (nav chips, service pages, tags, icons). On the Services page
   a live rail tracks scroll position and repaints the accent
   across the whole page in real time — dynamic color driven by
   real content structure, not decoration.
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;background:var(--paper);color:var(--ink-3);line-height:1.65;overflow-x:hidden;}

:root{
  --ink:        #14181F;
  --ink-2:      #3A4150;
  --ink-3:      #68707E;
  --ink-4:      #9AA0AB;
  --paper:      #F8F7F4;
  --paper-2:    #F0EDE8;
  --paper-3:    #E8E3DC;
  --border:     #E2DDD6;
  --border-2:   #C8C0B4;
  --r:          10px;
  --shadow:     0 1px 3px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.06);
  --shadow-md:  0 4px 6px rgba(0,0,0,.05), 0 10px 32px rgba(0,0,0,.08);

  /* signal channels — one fixed hue per practice area, used everywhere */
  --sig-routing:   #1D4ED8;
  --sig-sdaccess:  #7C3AED;
  --sig-wireless:  #0891B2;
  --sig-security:  #DC2626;
  --sig-video:     #B45309;
  --sig-dc:        #059669;

  /* live accent — rewritten by script.js while scrolling the services
     page; every component below reads color from this variable */
  --accent: var(--sig-routing);
  --accent-soft: #EFF3FE;
  --accent-transition: background .5s ease, border-color .5s ease, color .5s ease;
}

h1,h2,h3,h4{font-family:'Playfair Display',serif;color:var(--ink);line-height:1.15;letter-spacing:-.01em;}
p{color:var(--ink-3);}

.container{max-width:1140px;margin:0 auto;padding:0 28px;}
section{padding:92px 0;}

::selection{background:var(--accent);color:#fff;}

/* respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
}

/* ============================== NAV ============================== */
nav{position:fixed;top:0;left:0;right:0;z-index:300;background:rgba(248,247,244,0.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);transition:var(--accent-transition);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:104px;}
.nav-logo img{height:88px;width:auto;display:block;}
.nav-links{display:flex;align-items:center;gap:34px;list-style:none;}
.nav-links a{font-size:14px;font-weight:500;color:var(--ink-2);text-decoration:none;letter-spacing:.01em;transition:color .2s;position:relative;padding:4px 0;}
.nav-links a::after{content:'';position:absolute;left:0;bottom:-4px;height:2px;width:0;background:var(--accent);transition:width .25s ease, background .4s ease;}
.nav-links a:hover::after,.nav-links a.active::after{width:100%;}
.nav-links a:hover,.nav-links a.active{color:var(--ink);}
.nav-cta{background:var(--ink)!important;color:white!important;padding:9px 22px;border-radius:6px;font-size:13px!important;font-weight:600!important;transition:background .3s ease!important;}
.nav-cta::after{display:none;}
.nav-cta:hover{background:var(--accent)!important;}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;}
.nav-toggle span{width:22px;height:2px;background:var(--ink);display:block;}

/* ============================== BUTTONS ============================== */
.btn-primary{background:var(--ink);color:white;padding:13px 28px;border-radius:6px;font-weight:600;font-size:14px;text-decoration:none;transition:all .25s ease;border:none;cursor:pointer;letter-spacing:.01em;display:inline-flex;align-items:center;gap:8px;}
.btn-primary:hover{background:var(--accent);transform:translateY(-1px);}
.btn-outline{background:transparent;color:var(--ink-2);padding:13px 28px;border-radius:6px;font-weight:500;font-size:14px;text-decoration:none;border:1px solid var(--border-2);transition:all .25s ease;display:inline-flex;align-items:center;gap:8px;}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);}
.btn-primary-dark{background:white;color:var(--ink);padding:13px 28px;border-radius:6px;font-weight:600;font-size:14px;text-decoration:none;transition:all .2s;border:none;cursor:pointer;}
.btn-primary-dark:hover{background:#EFF6FF;color:var(--sig-routing);transform:translateY(-1px);}
.btn-outline-dark{background:transparent;color:rgba(255,255,255,.8);padding:13px 28px;border-radius:6px;font-weight:500;font-size:14px;text-decoration:none;border:1px solid rgba(255,255,255,.25);transition:all .2s;}
.btn-outline-dark:hover{border-color:rgba(255,255,255,.5);color:white;}

/* ============================== SECTION COMMON ============================== */
.eyebrow{font-size:11px;font-weight:600;color:var(--accent);letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;transition:var(--accent-transition);}
.section-title{font-size:clamp(26px,3.5vw,38px);font-weight:700;margin-bottom:16px;color:var(--ink);}
.section-sub{font-size:15px;color:var(--ink-3);line-height:1.75;}

/* ============================== PAGE HERO (interior pages) ============================== */
.page-hero{min-height:56vh;display:flex;align-items:center;padding-top:104px;position:relative;overflow:hidden;background:#0F1420;}
.page-hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,#0A0F1B 0%,#101B30 55%,#0A1424 100%);}
.page-hero .container{position:relative;z-index:1;padding-top:56px;padding-bottom:56px;}
.page-hero-label{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.7);font-size:12px;font-weight:500;letter-spacing:.1em;padding:6px 16px;border-radius:4px;margin-bottom:26px;text-transform:uppercase;}
.page-hero-label span{width:5px;height:5px;border-radius:50%;background:#60A5FA;display:block;}
.page-hero h1{font-size:clamp(32px,4.2vw,50px);font-weight:700;color:#EAF1FB;line-height:1.12;margin-bottom:18px;letter-spacing:-.02em;max-width:720px;}
.page-hero p{font-size:16px;color:rgba(255,255,255,.72);line-height:1.75;max-width:520px;}

/* ============================== HOME HERO ============================== */
#hero{min-height:100vh;display:flex;align-items:center;padding-top:104px;position:relative;overflow:hidden;background:#0F1420;}
.hero-bg{position:absolute;inset:0;background-image:url('https://images.unsplash.com/photo-1558494949-ef010cbdcc31?w=1600&q=80&auto=format&fit=crop');background-size:cover;background-position:center;opacity:0.10;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,#0A0F1B 0%,#101B30 55%,#0A1424 100%);opacity:0.94;}
.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr 0.95fr;gap:64px;align-items:center;}
.hero-label{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.7);font-size:12px;font-weight:500;letter-spacing:.1em;padding:6px 16px;border-radius:4px;margin-bottom:28px;text-transform:uppercase;}
.hero-label span{width:5px;height:5px;border-radius:50%;background:#60A5FA;display:block;animation:pulse-dot 1.8s ease-in-out infinite;}
.hero h1{font-size:clamp(36px,4.5vw,56px);font-weight:700;color:#BAD8F7;line-height:1.1;margin-bottom:22px;letter-spacing:-.02em;}
.hero h1 em{font-style:normal;color:#E0F2FE;}
.hero-sub{font-size:16px;color:rgba(255,255,255,.82);line-height:1.75;max-width:460px;margin-bottom:38px;}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:48px;}
.hero-stats{display:flex;gap:0;border:1px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden;}
.hero-stat{flex:1;padding:20px 24px;border-right:1px solid rgba(255,255,255,.1);}
.hero-stat:last-child{border-right:none;}
.hero-stat .num{font-family:'Playfair Display',serif;font-size:26px;font-weight:700;color:white;line-height:1;}
.hero-stat .lbl{font-size:11px;color:rgba(255,255,255,.4);margin-top:5px;letter-spacing:.04em;}

/* animated network graphic in home hero */
.hero-graphic{position:relative;aspect-ratio:1/0.92;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);overflow:hidden;}
.hero-graphic svg{width:100%;height:100%;display:block;}
.hg-node{fill:#0F1B2D;stroke:rgba(255,255,255,.35);stroke-width:1.4;}
.hg-node-core{fill:#132038;stroke:#60A5FA;stroke-width:1.6;}
.hg-line{stroke:rgba(255,255,255,.16);stroke-width:1.2;fill:none;}
.hg-packet{fill:#60A5FA;filter:drop-shadow(0 0 5px rgba(96,165,250,.9));}
.hg-label{font-family:'Inter',sans-serif;font-size:9.5px;fill:rgba(255,255,255,.55);letter-spacing:.03em;}
@keyframes travel1{0%{offset-distance:0%;opacity:0;}6%{opacity:1;}94%{opacity:1;}100%{offset-distance:100%;opacity:0;}}
.p1{offset-path:path('M40,150 C90,90 150,90 195,150');animation:travel1 3.4s linear infinite;}
.p2{offset-path:path('M355,150 C305,210 250,210 205,150');animation:travel1 3.4s linear infinite .55s;}
.p3{offset-path:path('M197,40 C137,70 137,120 197,148');animation:travel1 3.9s linear infinite 1.1s;}
.p4{offset-path:path('M197,262 C257,232 257,182 197,152');animation:travel1 3.9s linear infinite 1.65s;}
.p5{offset-path:path('M105,270 C140,220 170,190 197,150');animation:travel1 4.3s linear infinite 2.1s;}
.p6{offset-path:path('M290,32 C260,80 225,115 200,150');animation:travel1 4.3s linear infinite .2s;}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(1.5);}}
@keyframes core-pulse{0%,100%{r:15;opacity:.9;}50%{r:19;opacity:.5;}}
.hg-core-pulse{fill:none;stroke:#60A5FA;stroke-width:1;animation:core-pulse 2.6s ease-in-out infinite;}

/* ============================== HOME: PRACTICE STRIP ============================== */
#practice-strip{background:var(--paper-2);padding:56px 0;}
.ps-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.ps-item{background:var(--paper);padding:22px 16px;text-align:center;text-decoration:none;transition:background .25s ease;position:relative;}
.ps-item::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--chip);transform:scaleX(0);transform-origin:left;transition:transform .3s ease;}
.ps-item:hover::before{transform:scaleX(1);}
.ps-item:hover{background:white;}
.ps-item i{font-size:22px;color:var(--chip);display:block;margin-bottom:10px;}
.ps-item span{font-size:12px;font-weight:600;color:var(--ink-2);line-height:1.3;display:block;}

/* ============================== SERVICES GRID (home teaser) ============================== */
#services-teaser{background:var(--paper);}
.services-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:48px;gap:32px;flex-wrap:wrap;}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.svc-card{background:var(--paper-2);padding:32px 28px;transition:background .2s;border:none;position:relative;}
.svc-card:hover{background:white;}
.svc-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--chip);}
.svc-num{font-size:11px;font-weight:600;color:var(--ink-4);letter-spacing:.08em;margin-bottom:20px;}
.svc-icon-wrap{width:40px;height:40px;margin-bottom:16px;color:var(--chip);}
.svc-icon-wrap i{font-size:24px;}
.svc-title{font-family:'Playfair Display',serif;font-size:18px;font-weight:600;color:var(--ink);margin-bottom:10px;line-height:1.3;}
.svc-desc{font-size:13.5px;color:var(--ink-3);line-height:1.65;}
.svc-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:16px;}
.tag{background:var(--paper-2);border:1px solid var(--border);border-radius:3px;padding:3px 9px;font-size:11px;color:var(--ink-3);font-weight:500;}

/* ============================== SERVICES PAGE: alternating channel rows ============================== */
#svc-rows{background:var(--paper);}
.svc-row{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;padding:88px 0;border-bottom:1px solid var(--border);}
.svc-row:last-child{border-bottom:none;}
.svc-row.flip .svc-row-visual{order:2;}
.svc-row.flip .svc-row-copy{order:1;}
.svc-row-copy .eyebrow-chip{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:6px 14px;border-radius:20px;margin-bottom:20px;}
.svc-row-copy .eyebrow-chip .dot{width:6px;height:6px;border-radius:50%;}
.svc-row-title{font-size:clamp(24px,2.8vw,32px);margin-bottom:16px;}
.svc-row-desc{font-size:15px;line-height:1.8;margin-bottom:24px;}
.svc-row-details{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:26px;}
.svc-row-details li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--ink-2);}
.svc-row-details li i{margin-top:2px;font-size:14px;flex-shrink:0;}
.svc-row-tags{display:flex;flex-wrap:wrap;gap:7px;}
.svc-row-tags .tag{border-radius:20px;padding:5px 13px;}
.svc-row-visual{border-radius:16px;aspect-ratio:1/0.82;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);}
.svc-row-visual svg{width:88%;height:88%;}
.svc-row-num{position:absolute;top:20px;left:24px;font-family:'Playfair Display',serif;font-size:13px;font-weight:700;letter-spacing:.06em;opacity:.55;}

/* moving-picture keyframes used across service visuals */
@keyframes dash-flow{to{stroke-dashoffset:-120;}}
@keyframes ring-expand{0%{r:20;opacity:.9;stroke-width:2.4;}100%{r:78;opacity:0;stroke-width:.2;}}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:.25;}}
@keyframes sweep{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
@keyframes bar-bounce{0%,100%{transform:scaleY(.35);}50%{transform:scaleY(1);}}
@keyframes float-y{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
@keyframes fade-packet{0%{opacity:0;}10%,85%{opacity:1;}100%{opacity:0;}}

/* ============================== SPECTRUM RAIL (dynamic color nav, services page) ============================== */
.spectrum-rail{position:fixed;right:26px;top:50%;transform:translateY(-50%);z-index:250;display:flex;flex-direction:column;gap:16px;}
.spectrum-rail a{width:11px;height:11px;border-radius:50%;background:var(--border-2);display:block;position:relative;transition:background .3s ease, transform .3s ease;}
.spectrum-rail a::after{content:attr(data-label);position:absolute;right:22px;top:50%;transform:translateY(-50%);white-space:nowrap;font-size:11px;font-weight:600;color:var(--ink);background:white;border:1px solid var(--border);padding:4px 10px;border-radius:5px;opacity:0;pointer-events:none;transition:opacity .2s ease;box-shadow:var(--shadow);}
.spectrum-rail a:hover::after{opacity:1;}
.spectrum-rail a.active{background:var(--accent);transform:scale(1.3);}
@media(max-width:900px){.spectrum-rail{display:none;}}

/* ============================== VENDORS ============================== */
#vendors{background:var(--paper-2);}
.vendors-inner{display:grid;grid-template-columns:1fr 2fr;gap:64px;align-items:start;}
.vendor-groups{display:flex;flex-direction:column;gap:32px;}
.vg-cat{font-size:11px;font-weight:600;color:var(--ink-4);letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.vendor-chips{display:flex;flex-wrap:wrap;gap:8px;}
.vc{display:flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--border);border-radius:5px;padding:8px 14px;font-size:13px;font-weight:500;color:var(--ink-2);transition:all .25s ease;}
.vc:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);transform:translateY(-2px);}
.vc i{font-size:15px;color:var(--ink-4);}

/* ============================== PROJECTS ============================== */
#projects{background:var(--paper);}
.projects-head{text-align:center;margin-bottom:52px;}
.projects-head .section-sub{margin:0 auto;max-width:520px;}
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.proj-card{background:var(--paper-2);border:1px solid var(--border);border-radius:var(--r);padding:32px;transition:all .3s ease;position:relative;overflow:hidden;}
.proj-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--accent-soft),transparent 60%);opacity:0;transition:opacity .3s ease;}
.proj-card:hover::before{opacity:1;}
.proj-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--border-2);}
.proj-delivered{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:#059669;background:#ECFDF5;border:1px solid #A7F3D0;padding:3px 10px;border-radius:3px;margin-bottom:20px;position:relative;}
.proj-client{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;color:var(--ink);margin-bottom:6px;position:relative;}
.proj-loc{font-size:12px;color:var(--ink-4);margin-bottom:14px;display:flex;align-items:center;gap:5px;position:relative;}
.proj-loc i{font-size:13px;}
.proj-desc{font-size:13.5px;color:var(--ink-3);line-height:1.65;position:relative;}
.proj-sector{display:inline-block;margin-top:16px;font-size:11px;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:3px;padding:3px 9px;position:relative;transition:var(--accent-transition);}

/* project process / timeline (projects page) */
.process-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:64px;position:relative;}
.process-strip::before{content:'';position:absolute;top:19px;left:8%;right:8%;height:1px;background:var(--border-2);}
.proc-step{text-align:center;position:relative;padding:0 12px;}
.proc-num{width:38px;height:38px;border-radius:50%;background:var(--paper);border:1px solid var(--border-2);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-weight:700;font-size:14px;color:var(--ink);margin:0 auto 16px;position:relative;z-index:1;}
.proc-title{font-size:13.5px;font-weight:600;color:var(--ink);margin-bottom:6px;}
.proc-desc{font-size:12.5px;color:var(--ink-4);}

/* ============================== TEAM ============================== */
#team{background:var(--paper-2);}
.team-head{margin-bottom:52px;}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.team-card{background:var(--paper);border:1px solid var(--border);border-radius:var(--r);padding:32px 28px;transition:all .25s ease;}
.team-card:hover{background:white;box-shadow:var(--shadow);transform:translateY(-3px);}
.avatar{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:18px;font-weight:700;margin-bottom:20px;color:white;}
.av-slate{background:#334155;}
.av-blue{background:#1E40AF;}
.av-indigo{background:#3730A3;}
.team-name{font-family:'Playfair Display',serif;font-size:20px;font-weight:700;color:var(--ink);margin-bottom:3px;}
.team-title{font-size:12px;font-weight:600;color:var(--sig-routing);letter-spacing:.04em;margin-bottom:2px;}
.team-role{font-size:13px;color:var(--ink-3);margin-bottom:16px;}
.team-certs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px;}
.cert{font-size:11px;font-weight:500;padding:4px 10px;border-radius:3px;border:1px solid;}
.cert-amber{background:#FFFBEB;border-color:#FDE68A;color:#92400E;}
.cert-slate{background:#F1F5F9;border-color:#CBD5E1;color:#334155;}
.cert-green{background:#F0FDF4;border-color:#BBF7D0;color:#166534;}
.team-contact{border-top:1px solid var(--border);padding-top:16px;}
.tc-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-3);margin-bottom:6px;}
.tc-row i{font-size:14px;color:var(--ink-4);}

/* ============================== ABOUT: story / stats ============================== */
#story{background:var(--paper);}
.story-inner{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;}
.story-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px;}
.story-stat{background:var(--paper-2);border:1px solid var(--border);border-radius:var(--r);padding:22px;}
.story-stat .num{font-family:'Playfair Display',serif;font-size:28px;font-weight:700;color:var(--ink);}
.story-stat .lbl{font-size:12px;color:var(--ink-4);margin-top:4px;}
.story-visual{position:relative;aspect-ratio:1/1;border-radius:16px;background:#0F1420;overflow:hidden;}
.story-visual svg{width:100%;height:100%;}

/* ============================== CONTACT ============================== */
#contact{background:var(--paper-2);}
.contact-inner{display:grid;grid-template-columns:1fr 1.2fr;gap:72px;align-items:start;}
.contact-items{margin-top:32px;display:flex;flex-direction:column;gap:20px;}
.ci{display:flex;align-items:flex-start;gap:14px;}
.ci-icon{width:38px;height:38px;background:var(--paper-3);border:1px solid var(--border-2);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ci-icon i{font-size:17px;color:var(--ink-2);}
.ci-label{font-size:10px;font-weight:600;color:var(--ink-4);letter-spacing:.08em;text-transform:uppercase;margin-bottom:3px;}
.ci-value{font-size:14px;color:var(--ink);font-weight:500;}
.contact-form{background:white;border:1px solid var(--border);border-radius:var(--r);padding:36px;box-shadow:var(--shadow);}
.form-title{font-family:'Playfair Display',serif;font-size:20px;font-weight:700;color:var(--ink);margin-bottom:24px;}
.form-group{margin-bottom:18px;}
.form-group label{display:block;font-size:11px;font-weight:600;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase;margin-bottom:7px;}
.form-group input,.form-group textarea,.form-group select{width:100%;background:var(--paper);border:1px solid var(--border);border-radius:6px;padding:11px 14px;font-size:14px;color:var(--ink);font-family:'Inter',sans-serif;outline:none;transition:border .2s;}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--sig-routing);background:white;}
.form-group textarea{resize:vertical;min-height:100px;}
.form-success-msg{background:#ECFDF5;border:1px solid #A7F3D0;color:#059669;font-size:14px;font-weight:500;padding:12px 16px;border-radius:6px;margin-bottom:18px;}
.form-error-msg{display:block;color:#DC2626;font-size:12px;margin-top:5px;}
.form-error-msg:empty{display:none;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.submit-btn{width:100%;background:var(--ink);color:white;border:none;padding:13px;border-radius:6px;font-size:14px;font-weight:600;font-family:'Inter',sans-serif;cursor:pointer;transition:background .2s;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.02em;}
.submit-btn:hover{background:var(--sig-routing);}
.map-embed{border-radius:var(--r);overflow:hidden;border:1px solid var(--border);margin-top:24px;height:220px;}
.map-embed iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.2);}

/* ============================== CTA BANNER ============================== */
.cta-banner{background:#0F1420;padding:72px 0;position:relative;overflow:hidden;}
.cta-banner-inner{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;}
.cta-banner h2{color:#EAF1FB;font-size:clamp(22px,3vw,30px);}
.cta-banner p{color:rgba(255,255,255,.65);margin-top:8px;max-width:420px;}

/* ============================== FOOTER ============================== */
footer{background:var(--ink);color:rgba(255,255,255,.5);padding:48px 0 28px;}
.footer-inner{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;margin-bottom:40px;}
.footer-logo img{height:110px;width:auto;filter:brightness(1.1) contrast(1.05);margin-bottom:10px;}
.footer-tagline{font-size:13px;max-width:260px;}
.footer-links{display:flex;gap:48px;flex-wrap:wrap;}
.fl-group h4{font-size:11px;font-weight:600;color:rgba(255,255,255,.4);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;}
.fl-group a{display:block;font-size:13px;color:rgba(255,255,255,.4);text-decoration:none;margin-bottom:9px;transition:color .2s;}
.fl-group a:hover{color:rgba(255,255,255,.8);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;}
.footer-copy{font-size:12px;}
.footer-email{font-size:12px;color:rgba(255,255,255,.4);}

/* ============================== WHATSAPP ============================== */
.wa-float{position:fixed;bottom:28px;right:28px;z-index:999;display:flex;flex-direction:column;align-items:flex-end;gap:10px;}
.wa-bubble{display:flex;align-items:center;gap:10px;background:white;border:1px solid var(--border);border-radius:8px;padding:10px 16px 10px 12px;box-shadow:var(--shadow-md);opacity:0;transform:translateY(8px);transition:all .3s ease;pointer-events:none;white-space:nowrap;}
.wa-bubble.show{opacity:1;transform:translateY(0);pointer-events:auto;}
.wa-bubble-av{width:34px;height:34px;border-radius:50%;background:#334155;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:white;flex-shrink:0;}
.wa-bubble-name{font-size:13px;font-weight:600;color:var(--ink);line-height:1.2;}
.wa-bubble-lbl{font-size:11px;color:var(--ink-4);}
.wa-btn{width:54px;height:54px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(37,211,102,.4);cursor:pointer;text-decoration:none;transition:transform .2s,box-shadow .2s;}
.wa-btn:hover{transform:scale(1.08);box-shadow:0 6px 24px rgba(37,211,102,.55);}
.wa-btn svg{width:28px;height:28px;fill:white;}

/* ============================== SCROLL REVEAL ============================== */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in-view{opacity:1;transform:translateY(0);}

/* ============================== RESPONSIVE ============================== */
@media(max-width:900px){
  .hero-inner,.contact-inner,.vendors-inner,.story-inner{grid-template-columns:1fr;}
  .hero-graphic,.vendors-inner>div:first-child{display:none;}
  .services-grid,.projects-grid,.team-grid{grid-template-columns:1fr;}
  .ps-grid{grid-template-columns:repeat(3,1fr);}
  .form-row{grid-template-columns:1fr 1fr;}
  .svc-row,.svc-row.flip{grid-template-columns:1fr;}
  .svc-row.flip .svc-row-visual{order:1;}
  .svc-row.flip .svc-row-copy{order:2;}
  .process-strip{grid-template-columns:1fr 1fr;gap:32px;}
  .process-strip::before{display:none;}
}
@media(max-width:768px){
  .nav-links{position:fixed;top:104px;left:0;right:0;background:var(--paper);flex-direction:column;align-items:flex-start;padding:24px 28px;border-bottom:1px solid var(--border);gap:18px;transform:translateY(-12px);opacity:0;pointer-events:none;transition:all .25s ease;}
  .nav-links.open{transform:translateY(0);opacity:1;pointer-events:auto;}
  .nav-toggle{display:flex;}
  section{padding:64px 0;}
  .services-head{flex-direction:column;}
  .ps-grid{grid-template-columns:repeat(2,1fr);}
  .form-row{grid-template-columns:1fr;}
  .cta-banner-inner{flex-direction:column;text-align:center;}
}