/* NineLine V1 effects — applied via Elementor "CSS Classes" on widgets/containers */
:root{--nl-navy:#0B1B2E;--nl-navy2:#0E2340;--nl-steel:#1F3651;--nl-sky:#9BC4E2;--nl-sky-soft:#D6E6F2;--nl-bg:#F4F6F8;--nl-paper:#fff;--nl-ink:#0A0F14;--nl-muted:#5C6B7A;--nl-line:#E5EAF0}

/* Nav glassmorphism */
.nl-nav{backdrop-filter:blur(14px);background:rgba(11,27,46,.72);border-bottom:1px solid rgba(155,196,226,.12)}
/* nav link colours now come from the Nav Menu widget's own controls (editable in Elementor) — 2026-06-19 */

/* Buttons: tactical square */
.nl-btn-primary .elementor-button{border-radius:2px;background:var(--nl-sky);color:var(--nl-navy);text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.nl-btn-primary .elementor-button:hover{background:#fff}
.nl-btn-ghost .elementor-button{border-radius:2px;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.25);text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.nl-btn-ghost .elementor-button:hover{border-color:#fff;background:rgba(255,255,255,.06)}

/* Hero composite: bg image set on the container in Elementor; these add overlay + grid + reticle */
.nl-hero{position:relative;min-height:100vh;background:var(--nl-navy);overflow:hidden}
.nl-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(11,27,46,.55) 0%,rgba(11,27,46,.55) 40%,rgba(11,27,46,.92) 100%);z-index:0;pointer-events:none}
.nl-hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background-image:linear-gradient(to right,rgba(155,196,226,.06) 1px,transparent 1px),linear-gradient(to bottom,rgba(155,196,226,.06) 1px,transparent 1px);background-size:96px 96px;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 60%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 60%,transparent 100%)}
.nl-hero>*{position:relative;z-index:2}
.nl-hero-headline{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;line-height:.9;letter-spacing:-.01em}
.nl-hero-headline .nl-accent{color:var(--nl-sky);font-style:italic;font-weight:500}

/* Hero stat bar */
.nl-statbar{border-top:1px solid rgba(155,196,226,.18);background:rgba(11,27,46,.5);backdrop-filter:blur(8px)}
/* statbar: full-bleed (edge-to-edge) bar pinned at the bottom of the hero — matches V1 .hero-bar */
.nl-statbar{width:100vw!important;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;margin-top:auto!important}
.nl-statbar > .e-con-inner{max-width:1240px;margin-left:auto!important;margin-right:auto!important;width:100%;padding-left:48px;padding-right:48px;box-sizing:border-box}
.nl-stat .nl-num{font-family:'Barlow Condensed',sans-serif;font-size:38px;font-weight:600;color:#fff;line-height:1}
.nl-stat .nl-num small{color:var(--nl-sky);font-size:.5em;vertical-align:top;margin-left:4px}
.nl-stat .nl-lbl{margin-top:8px;font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#9BB1C7}

/* Eyebrow / mono labels */
.nl-eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--nl-sky);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.nl-eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
.nl-eyebrow.nl-ink{color:var(--nl-steel)}

/* Services C·I·E hover inversion */
.nl-cie{background:var(--nl-paper);transition:background .25s,color .25s;min-height:520px}
.nl-cie:hover{background:var(--nl-navy);color:#E8EEF4}
.nl-cie:hover .elementor-heading-title,.nl-cie:hover p,.nl-cie:hover li{color:#fff!important}
.nl-cie:hover .nl-cie-tag{color:var(--nl-sky)!important}
.nl-cie ul{list-style:none;padding:0;margin:0;border-top:1px solid var(--nl-line)}
.nl-cie li{position:relative;padding:10px 0 12px 16px;border-bottom:1px solid var(--nl-line);font-size:13px;line-height:1.5}
.nl-cie li:last-child{border-bottom:none}
.nl-cie li::before{content:"";position:absolute;left:0;top:18px;width:6px;height:6px;background:var(--nl-steel)}
.nl-cie:hover li::before{background:var(--nl-sky)}
.nl-cie li b{display:block;font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:15px;text-transform:uppercase;color:var(--nl-navy);margin-bottom:2px}
.nl-cie:hover li b{color:#fff}

/* Expertise split image edge gradient */
.nl-exp-img{position:relative;background-size:cover;background-position:center;min-height:560px}
.nl-exp-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,transparent 70%,rgba(11,27,46,.85) 100%)}

/* Team member row (photo is a container background-image set in Elementor; navy is only a fallback) */
.nl-member-img{position:relative;min-height:440px;background-color:var(--nl-navy)}
.nl-badge{position:absolute;top:14px;left:14px;z-index:2;background:rgba(11,27,46,.78);backdrop-filter:blur(4px);color:var(--nl-sky);font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;padding:6px 9px;border:1px solid rgba(155,196,226,.25)}

/* Values grid */
.nl-value{background:var(--nl-paper,#fff);padding:40px 32px 44px;display:flex;flex-direction:column;min-height:300px;border:1px solid #E5EAF0}
.nl-value .nl-ord{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.18em;color:#5C6B7A}
.nl-value h4,.nl-value .elementor-heading-title{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase}
.nl-value .nl-ico{margin-bottom:auto}

/* Partners dark grid */
.nl-partner{display:flex;align-items:center;justify-content:center;min-height:120px;padding:36px 24px;border-right:1px solid rgba(155,196,226,.18);border-bottom:1px solid rgba(155,196,226,.18);color:#9BB1C7;font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;font-weight:600;font-size:18px;text-align:center;line-height:1.1;transition:color .2s,background .2s}
.nl-partner:hover{color:#fff;background:rgba(155,196,226,.05)}

/* ── Contact form (Elementor Pro Form) — full V1 port; Pro form ships UNSTYLED ── */
/* card */
.nl-form{background:var(--nl-paper,#fff);border:1px solid var(--nl-line,#E5EAF0);padding:36px}
/* labels (mono uppercase) */
.nl-form .elementor-field-label{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--nl-steel,#1F3651);margin-bottom:6px;font-weight:500}
/* fields: square, tinted, Inter */
.nl-form .elementor-field-textual,
.nl-form select.elementor-field,
.nl-form textarea.elementor-field{width:100%;border:1px solid var(--nl-line,#E5EAF0)!important;background:#FBFCFD!important;padding:12px 14px!important;font-family:'Inter',sans-serif!important;font-size:14px!important;color:var(--nl-ink,#0A0F14)!important;border-radius:0!important;box-shadow:none!important;transition:border-color .2s}
.nl-form .elementor-field-textual:focus,
.nl-form select.elementor-field:focus,
.nl-form textarea.elementor-field:focus{border-color:var(--nl-steel,#1F3651)!important;outline:none}
.nl-form .elementor-field-textual::placeholder,
.nl-form textarea::placeholder{color:#9AAABE}
.nl-form textarea.elementor-field{resize:vertical;min-height:110px}
/* spacing between field groups — Elementor spaces fields via field-group PADDING, not a flex gap.
   A column-gap makes 50%+50%+gap > 100% so the pair wraps to separate rows. Vertical rhythm only. */
.nl-form .elementor-form-fields-wrapper{row-gap:14px;column-gap:0}
/* acceptance / consent checkbox row */
.nl-form .elementor-field-type-acceptance .elementor-field-subgroup{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--nl-muted,#5C6B7A)}
.nl-form .elementor-field-type-acceptance input[type=checkbox]{width:auto;margin-top:3px}
/* submit button: full-width navy, uppercase */
.nl-form .elementor-button{width:100%;justify-content:center;gap:12px;background:var(--nl-navy,#0B1B2E)!important;color:#fff!important;border:none!important;padding:16px!important;border-radius:0!important;font-family:'Inter',sans-serif!important;font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;transition:background .2s}
.nl-form .elementor-button:hover{background:var(--nl-steel,#1F3651)!important}

/* Italic accent words (V1 h2 em): steel on light sections, sky on dark sections */
.nl-strip em, #services em, #team em, #values em, #contact em{color:var(--nl-steel,#1F3651);font-style:italic;font-weight:400}
#expertise em, #partners em{color:var(--nl-sky,#9BC4E2);font-style:italic;font-weight:400}

/* Links inherit surrounding text colour (V1: a{color:inherit}) — fixes default magenta links.
   Specific link colours (nav, footer, accent) come from their own rules/widgets. */
a{color:inherit;text-decoration:none}


/* ===== fixes 1-5 (2026-06-07): team layout, reticle, ghost btn, header overlay ===== */
/* FIX1 team: photo column fixed 320 (bg-image on container), body fills */
.nl-member-img{flex:0 0 320px!important;max-width:320px;width:320px;min-height:440px;overflow:hidden;background-size:cover!important;background-position:center top!important}
.nl-member-body{flex:1 1 auto;min-width:0}
@media(max-width:900px){.nl-member-img{flex-basis:auto!important;max-width:none!important;width:100%!important}}
/* FIX4 ghost button visible */
.nl-btn-ghost .elementor-button{background:transparent!important;border:1px solid rgba(255,255,255,.45)!important;color:#fff!important}
.nl-btn-ghost .elementor-button:hover{border-color:#fff!important;background:rgba(255,255,255,.08)!important}
/* FIX5 header overlays hero so the hero bg image runs behind the nav */
.nl-nav{position:fixed!important;top:0;left:0;right:0;z-index:999}
.nl-hero{padding-top:78px}
/* FIX2 hero targeting reticle (decorative) */
.nl-reticle{position:relative}
.nl-reticle::after{content:"";position:absolute;top:50%;right:0;transform:translateY(-50%);width:280px;height:280px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none'><circle cx='100' cy='100' r='98' stroke='%239BC4E2' stroke-width='1'/><circle cx='100' cy='100' r='68' stroke='%239BC4E2' stroke-width='1' stroke-dasharray='2 6'/><circle cx='100' cy='100' r='38' stroke='%239BC4E2' stroke-width='1'/><line x1='100' y1='0' x2='100' y2='40' stroke='%239BC4E2' stroke-width='1'/><line x1='100' y1='160' x2='100' y2='200' stroke='%239BC4E2' stroke-width='1'/><line x1='0' y1='100' x2='40' y2='100' stroke='%239BC4E2' stroke-width='1'/><line x1='160' y1='100' x2='200' y2='100' stroke='%239BC4E2' stroke-width='1'/><circle cx='100' cy='100' r='2' fill='%239BC4E2'/></svg>") no-repeat center/contain;opacity:.5;pointer-events:none;z-index:1}
@media(max-width:1100px){.nl-reticle::after{display:none}}

/* ===== restore V1 light-grey hairlines (#E5EAF0) on containers (2026-06-07) ===== */
/* Services: bordered band + vertical dividers between the 3 C·I·E cards (V1 .cie-wrap + .cie) */
.nl-cie{border:1px solid var(--nl-line)}
.nl-cie + .nl-cie{margin-left:-1px}
/* Team: hairline divider between member rows (V1 .team-stack gap) — row = .e-con with a direct .nl-member-img child */
#team .e-con:has(> .nl-member-img){border-top:1px solid var(--nl-line)}
#team .e-con:has(> .nl-member-img):last-of-type{border-bottom:1px solid var(--nl-line)}
/* Contact: divider above the EMAIL/HQ/ENTITY/FOLLOW info row (V1 .contact-info border-top) */
/* FIX 2026-06-08: ':has(.nl-info)' matched EVERY ancestor .e-con (continnr1, controww1, …) → stacked
   top borders in the contact section. The intended single divider already comes from '.nl-info{border-top}'
   below; keep only the specific direct-child mailto case. */
#contact .e-con:has(> a[href^="mailto"]){border-top:1px solid var(--nl-line);padding-top:32px;margin-top:8px}

/* ===== precise V1 borders (override earlier approximations) 2026-06-07 ===== */
/* services: band = top/bottom continuous + right dividers between cards, NO outer left/right */
.nl-cie{border:none!important;border-top:1px solid var(--nl-line)!important;border-bottom:1px solid var(--nl-line)!important;border-right:1px solid var(--nl-line)!important;margin-left:0!important}
.nl-cie:last-child{border-right:none!important}
/* strip top+bottom hairline (V1 .strip) */
.nl-strip{border-top:1px solid var(--nl-line);border-bottom:1px solid var(--nl-line)}
/* team: outer box + row dividers (V1 .team-stack border + 1px gaps) */
#team .e-con:has(> .nl-member-img){border:none!important;border-top:1px solid var(--nl-line)!important;border-left:1px solid var(--nl-line)!important;border-right:1px solid var(--nl-line)!important}
#team .e-con:has(> .nl-member-img):last-of-type{border-bottom:1px solid var(--nl-line)!important}
/* partners grid: add the grid's top+left so the hairline grid closes (cells already have right+bottom) */
#partners .e-con:has(> .nl-partner){border-top:1px solid rgba(155,196,226,.18);border-left:1px solid rgba(155,196,226,.18)}
/* expertise JTAC/UAS/DACAS definition row top divider (V1 .exp-meta) */
.nl-exp-meta{border-top:1px solid rgba(155,196,226,.2);padding-top:32px;margin-top:36px}
/* contact info divider (V1 .contact-info border-top) */
.nl-info{border-top:1px solid var(--nl-line);padding-top:32px;margin-top:40px;
  display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:24px!important}  /* V1 .contact-info = 2 columns (was 4) */
.nl-info > *{width:auto!important;max-width:none!important;flex-basis:auto!important}  /* let each cell fill its grid track */
/* hero action buttons in a row (V1 .hero-actions) */
.nl-hero-actions{display:flex!important;flex-direction:row!important;flex-wrap:wrap;gap:14px}

/* ===== mobile responsive parity with V1 (2026-06-07) ===== */
/* nav responsive is now handled by the Nav Menu widget itself (hamburger <=1024px) — 2026-06-19 */
/* hero stat bar: 2 columns on mobile (V1 .hero-bar-inner repeat(2,1fr) @900) */
@media(max-width:900px){
  .nl-statbar{flex-wrap:wrap!important}
  .nl-statbar > *{flex-basis:50%!important;max-width:50%!important;width:50%!important}
}
/* partners grid: 3-up <=1100, 2-up <=600 (V1) */
@media(max-width:1100px){#partners .e-con:has(> .nl-partner){flex-wrap:wrap!important} .nl-partner{flex-basis:33.333%!important;max-width:33.333%!important;width:33.333%!important}}
@media(max-width:600px){.nl-partner{flex-basis:50%!important;max-width:50%!important;width:50%!important}}

/* mobile: force row+wrap on grids that must stay multi-column (container defaults to column on mobile) */
@media(max-width:1100px){#partners .e-con:has(> .nl-partner){flex-direction:row!important;flex-wrap:wrap!important}}
@media(max-width:900px){.nl-statbar{flex-direction:row!important;flex-wrap:wrap!important}}

/* mobile grids: use flex-grow so cells fill 2-up/3-up despite gaps (fixes 50%+gap>100% wrap) */
@media(max-width:1100px){.nl-partner{flex:1 1 28%!important;max-width:none!important;width:auto!important}}
@media(max-width:600px){.nl-partner{flex:1 1 40%!important;max-width:none!important;width:auto!important}}
@media(max-width:900px){.nl-statbar > *{flex:1 1 40%!important;max-width:none!important;width:auto!important}}

/* allow stat/partner cells to shrink below content width so they pack 2-up on mobile */
@media(max-width:900px){.nl-statbar > *{min-width:0!important}}
@media(max-width:1100px){.nl-partner{min-width:0!important}}

/* statbar is a BOXED container → its stats live in .e-con-inner; target that for 2-up on mobile */
@media(max-width:900px){
  .nl-statbar > .e-con-inner{flex-direction:row!important;flex-wrap:wrap!important}
  .nl-statbar > .e-con-inner > *{flex:1 1 40%!important;max-width:none!important;width:auto!important;min-width:0!important}
}

/* mobile padding tightening to match V1's reduced mobile spacing */
@media(max-width:767px){
  #expertise .e-con:has(> .nl-exp-meta){padding:48px 24px!important}
  .nl-exp-meta{margin-top:24px;padding-top:24px}
  .nl-form{padding:24px!important}
}

/* ===== mobile menu retired 2026-06-19: the Nav Menu widget now provides its own hamburger + dropdown.
   (Old custom .nl-burger/.nl-mobile-menu + nineline-menu.js removed.) Only keep: hide the standalone
   "Get in touch" CTA when the burger shows (<=1024px = widget tablet breakpoint), since the dropdown
   already contains the Contact link. ===== */
@media(max-width:1024px){.nl-nav .elementor-element-b7c8d9e{display:none!important}}

/* ===== Testimonials carousel (2026-06-09) — native cards as slides, scroll-snap + JS controls ===== */
/* hook off the stable Elementor element-id class (container _css_classes is dropped on render by this Elementor build) */
.elementor-element-tstrow10{flex-wrap:nowrap!important;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.elementor-element-tstrow10::-webkit-scrollbar{display:none;}
.elementor-element-tstrow10>.e-con{scroll-snap-align:start;flex:0 0 calc((100% - 48px)/3)!important;width:auto!important;}
@media(max-width:1024px){.elementor-element-tstrow10>.e-con{flex-basis:calc((100% - 24px)/2)!important;}}
@media(max-width:640px){.elementor-element-tstrow10>.e-con{flex-basis:86%!important;}}
.nl-tst-ctrls{display:flex;align-items:center;gap:12px;margin-top:32px;}
.nl-tst-dots{display:flex;gap:8px;margin-right:auto;}
.nl-tst-dot{width:24px;height:24px;border-radius:50%;background:rgba(155,196,226,.55);background-clip:content-box;border:0;padding:8px;cursor:pointer;transition:background .2s;}
.nl-tst-dot.is-active{background:#9BC4E2;}
.nl-tst-arrow{width:44px;height:44px;border:1px solid rgba(155,196,226,.30);background:transparent;color:#9BC4E2;border-radius:2px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.nl-tst-arrow:hover{background:#9BC4E2;color:#0B1B2E;}
.nl-tst-arrow[disabled]{opacity:.3;cursor:default;}
.nl-tst-arrow svg{width:18px;height:18px;}