/* ConfrontTek — site theme (Workable-inspired).
   Light, airy, deep pine-green (#004038) + peach/cream. Font: Mulish.
   Self-contained, shared across every page. */

/* ============================ TOKENS ============================ */
:root {
  --green:        #004038;
  --green-deep:   #00302A;
  --green-700:    #0A5A4A;
  --green-bright: #15A87C;
  --mint:         #D7F0E6;
  --mint-2:       #EAF6F1;

  --peach:        #FCEDE2;
  --peach-2:      #F9E1D2;
  --cream:        #FBF7F1;
  --white:        #FFFFFF;

  --head:         #11332C;
  --text:         #3D3E45;
  --muted:        #6E707A;

  --line:         rgba(0,64,56,.12);
  --line-2:       rgba(0,64,56,.18);

  --on-green:       #EAF5F0;
  --on-green-mut:   rgba(234,245,240,.74);
  --on-green-faint: rgba(234,245,240,.5);
  --ongreen-line:   rgba(255,255,255,.14);
  --ongreen-line-2: rgba(255,255,255,.22);

  --shadow-card: 0 1px 2px rgba(0,48,42,.04), 0 16px 36px -22px rgba(0,48,42,.22);
  --shadow-lift: 0 1px 2px rgba(0,48,42,.05), 0 28px 56px -26px rgba(0,48,42,.32);
  --shadow-green: 0 24px 60px -28px rgba(0,48,42,.55);

  --ease: cubic-bezier(.22,.61,.36,1);
  --container: 72rem;
}

/* ============================ RESET ============================ */
*,*::before,*::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 5.5rem; }
body {
  font-family: 'Mulish', ui-sans-serif, system-ui, -apple-system, sans-serif;
  background: var(--white);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 1.0625rem;
  overflow-x: hidden;
}
img,svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
ul,ol { list-style: none; padding: 0; }
summary { list-style: none; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
:focus-visible { outline: 2px solid var(--green-bright); outline-offset: 3px; border-radius: 4px; }

.font-display { font-family: 'Mulish', ui-sans-serif, system-ui, sans-serif; }
.mono { font-family: 'Mulish', ui-sans-serif, system-ui, sans-serif; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:.6rem; left:.6rem; z-index:200; background:var(--green); color:#fff; font-weight:700; padding:.55rem 1rem; border-radius:.6rem; transform:translateY(-300%); transition:transform .3s var(--ease); }
.skip-link:focus { transform:translateY(0); }

/* ============================ LAYOUT ============================ */
.container { width:100%; max-width:var(--container); margin-inline:auto; padding-inline:clamp(1.25rem,4vw,2.75rem); }
.section { padding-block: clamp(4rem,8vw,7rem); position:relative; }
.section-paper { background:var(--white); color:var(--text); }
.section-cream { background:var(--cream); color:var(--text); }
.section-ink   { background:var(--green); color:var(--on-green); }
.section-ink-soft { background:var(--green-deep); color:var(--on-green); }
.grain::after { content:none; }  /* Workable look is clean, no grain */

/* ============================ TYPE PRIMITIVES ============================ */
.eyebrow {
  display:inline-flex; align-items:center; gap:.55rem;
  font-weight:800; font-size:.78rem; letter-spacing:.13em; text-transform:uppercase; color:var(--green-bright);
}
.section-ink .eyebrow, .section-ink-soft .eyebrow, .hero .eyebrow, .subhero .eyebrow { color:#6FE3BD; }
.eyebrow::before { content:""; width:1.5rem; height:2px; border-radius:2px; background:currentColor; }

.h-display { font-family:'Mulish',sans-serif; font-weight:800; line-height:1.05; letter-spacing:-.02em; font-size:clamp(2.5rem,5.4vw,4.4rem); color:var(--green); }
.h-section { font-family:'Mulish',sans-serif; font-weight:800; line-height:1.1; letter-spacing:-.02em; font-size:clamp(1.9rem,3.8vw,3rem); color:var(--green); }
.h-card    { font-family:'Mulish',sans-serif; font-weight:700; line-height:1.18; letter-spacing:-.01em; color:var(--head); }
.lead { font-size:clamp(1.06rem,1.4vw,1.25rem); line-height:1.55; color:var(--muted); }
.section-ink .lead, .section-ink-soft .lead, .hero .lead, .subhero .lead { color:var(--on-green-mut); }
.section-ink .h-section, .section-ink-soft .h-section, .subhero h1, .subhero .h-section { color:#fff; }
.accent { color:var(--green-bright); }
.section-ink .accent, .section-ink-soft .accent, .subhero .accent { color:#6FE3BD; }
.serif-italic { font-style:normal; font-weight:800; }

/* ============================ BUTTONS ============================ */
.btn { display:inline-flex; align-items:center; gap:.55rem; font-weight:700; font-size:1rem;
  padding:.85rem 1.6rem; border-radius:.7rem; transition:transform .3s var(--ease), background-color .3s var(--ease), box-shadow .3s var(--ease), color .3s var(--ease); white-space:nowrap; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:var(--green); color:#fff; box-shadow:0 10px 24px -12px rgba(0,64,56,.6); }
.btn-primary:hover { background:var(--green-700); }
.btn-ghost-dark { background:transparent; color:#fff; border:1px solid var(--ongreen-line-2); }
.btn-ghost-dark:hover { background:rgba(255,255,255,.10); }
.btn-ghost-light { background:var(--white); color:var(--green); border:1px solid var(--line-2); }
.btn-ghost-light:hover { background:var(--cream); }
/* invert primary on green/dark sections */
.section-ink .btn-primary, .section-ink-soft .btn-primary, .subhero .btn-primary, .cta-band .btn-primary {
  background:#fff; color:var(--green); box-shadow:0 12px 28px -14px rgba(0,0,0,.5); }
.section-ink .btn-primary:hover, .section-ink-soft .btn-primary:hover, .subhero .btn-primary:hover, .cta-band .btn-primary:hover {
  background:var(--mint); }
.link-arrow { display:inline-flex; align-items:center; gap:.45rem; font-weight:700; color:var(--green-bright); transition:gap .3s var(--ease), color .3s var(--ease); }
.section-ink .link-arrow, .section-ink-soft .link-arrow, .subhero .link-arrow { color:#6FE3BD; }
.link-arrow:hover { gap:.8rem; color:var(--green); }
.section-ink .link-arrow:hover { color:#fff; }

/* ============================ HEADER ============================ */
.site-header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.85); backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%); border-bottom:1px solid var(--line); }
.site-header .container { max-width:70rem; }
.site-header .bar { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; height:4.5rem; gap:1rem; }
.brand { justify-self:start; display:inline-flex; }
.brand-logo { height:1.8rem; width:auto; display:block; }
.nav { justify-self:center; display:flex; align-items:center; gap:1.5rem; }
.nav-right { justify-self:end; display:flex; align-items:center; }
.nav-link { color:var(--text); font-weight:600; font-size:.95rem; transition:color .3s var(--ease); position:relative; }
.nav-link::after { content:""; position:absolute; left:0; right:100%; bottom:-4px; height:2px; border-radius:2px; background:var(--green-bright); transition:right .3s var(--ease); }
.nav-link:hover { color:var(--green); }
.nav-link:hover::after { right:0; }
.nav-cta { background:var(--green); color:#fff; font-weight:700; font-size:.9rem; padding:.55rem 1.3rem; border-radius:.6rem; transition:background-color .3s var(--ease), transform .3s var(--ease); white-space:nowrap; }
.nav-cta:hover { background:var(--green-700); transform:translateY(-1px); }

.dropdown { position:relative; }
.dropdown-btn { display:inline-flex; align-items:center; gap:.35rem; color:var(--text); font-weight:600; font-size:.95rem; transition:color .3s var(--ease); }
.dropdown-btn:hover { color:var(--green); }
.dropdown-caret { width:1rem; height:1rem; transition:transform .3s var(--ease); }
.dropdown:hover .dropdown-caret, .dropdown.open .dropdown-caret { transform:rotate(180deg); }
.dropdown-panel { position:absolute; left:50%; top:100%; transform:translate(-50%,10px); padding-top:.9rem; visibility:hidden; opacity:0; transition:opacity .3s var(--ease), transform .3s var(--ease), visibility .3s; }
.dropdown:hover .dropdown-panel, .dropdown:focus-within .dropdown-panel, .dropdown.open .dropdown-panel { visibility:visible; opacity:1; transform:translate(-50%,0); }
.dropdown-inner { background:var(--white); border:1px solid var(--line); border-radius:1rem; padding:.5rem; box-shadow:var(--shadow-lift); overflow:hidden; }
.dropdown-panel.wide .dropdown-inner { width:30rem; display:grid; grid-template-columns:1fr 1fr; gap:.15rem; }
.dropdown-panel:not(.wide) .dropdown-inner { width:21rem; }
.dropdown-item { display:flex; gap:.85rem; align-items:flex-start; padding:.8rem; border-radius:.7rem; transition:background-color .25s var(--ease); opacity:0; transform:translateX(-10px); }
.dropdown:hover .dropdown-item, .dropdown:focus-within .dropdown-item, .dropdown.open .dropdown-item { opacity:1; transform:translateX(0); transition:opacity .4s var(--ease), transform .4s var(--ease), background-color .25s var(--ease); }
.dropdown:hover .dropdown-item:nth-child(2), .dropdown.open .dropdown-item:nth-child(2) { transition-delay:.06s; }
.dropdown-item:hover { background:var(--mint-2); }
.dropdown-ico { width:2.3rem; height:2.3rem; flex:none; border-radius:.6rem; display:flex; align-items:center; justify-content:center; background:var(--mint); color:var(--green); }
.dropdown-ico svg { width:1.25rem; height:1.25rem; }
.dropdown-item .t { display:flex; align-items:center; gap:.35rem; color:var(--head); font-weight:700; font-size:.95rem; }
.dropdown-item .d { display:block; color:var(--muted); font-size:.82rem; margin-top:.1rem; line-height:1.35; }
/* compact link list (industries / use cases dropdowns) */
.dropdown-link { display:flex; align-items:center; gap:.6rem; padding:.6rem .8rem; border-radius:.6rem; color:var(--head); font-weight:600; font-size:.92rem; transition:background-color .25s var(--ease), color .25s var(--ease); opacity:0; transform:translateX(-8px); }
.dropdown:hover .dropdown-link, .dropdown:focus-within .dropdown-link, .dropdown.open .dropdown-link { opacity:1; transform:translateX(0); transition:opacity .35s var(--ease), transform .35s var(--ease), background-color .25s var(--ease); }
.dropdown-link:hover { background:var(--mint-2); color:var(--green); }
.dropdown-link svg { width:1.05rem; height:1.05rem; color:var(--green-bright); flex:none; }

/* mobile menu */
.mobile-toggle { display:none; justify-self:end; }
.menu-btn { width:2.75rem; height:2.75rem; display:flex; align-items:center; justify-content:center; border-radius:.6rem; color:var(--green); }
.menu-btn:hover { background:var(--mint-2); }
[data-mobile-menu] .menu-icon-close { display:none; }
[data-mobile-menu][open] .menu-icon-open { display:none; }
[data-mobile-menu][open] .menu-icon-close { display:block; }
.mobile-panel { position:fixed; left:0; right:0; top:4.5rem; z-index:90; max-height:calc(100vh - 4.5rem); overflow:auto; background:var(--white); border-top:1px solid var(--line); box-shadow:var(--shadow-lift); padding:1rem 1.25rem 1.75rem; }
.mobile-panel .label { font-weight:800; font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--green-bright); padding:.85rem .85rem .35rem; }
.mobile-panel a { display:block; padding:.7rem .85rem; border-radius:.55rem; color:var(--head); font-weight:600; font-size:1.05rem; }
.mobile-panel a:hover { background:var(--mint-2); color:var(--green); }
.mobile-divider { height:1px; background:var(--line); margin:.6rem 0; }

/* ============================ HERO (light) ============================ */
.hero { background:linear-gradient(180deg, var(--peach) 0%, #FDF4EC 45%, var(--white) 100%); color:var(--text); position:relative; overflow:hidden; padding-block:clamp(3rem,6vw,5.5rem) clamp(3.5rem,7vw,6rem); }
.hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2.5rem,5vw,4.5rem); align-items:center; }
.tag { display:inline-flex; align-items:center; gap:.55rem; font-weight:700; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--green); border:1px solid var(--line-2); background:var(--white); padding:.5rem .9rem; border-radius:999px; }
.hero h1 { margin-top:1.5rem; max-width:15ch; color:var(--green); }
.hero .lead { margin-top:1.4rem; max-width:34rem; color:var(--muted); }
.hero-cta { margin-top:2rem; display:flex; flex-wrap:wrap; gap:.9rem; }
.hero-foot { margin-top:2.2rem; display:flex; align-items:center; gap:.9rem; color:var(--muted); font-size:.92rem; max-width:34rem; }
.hero .accent { color:var(--green-bright); }

.live-dot { width:.55rem; height:.55rem; border-radius:999px; background:var(--green-bright); box-shadow:0 0 0 0 rgba(21,168,124,.4); animation:pulse 2.2s var(--ease) infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(21,168,124,.4);} 70%{box-shadow:0 0 0 9px rgba(21,168,124,0);} 100%{box-shadow:0 0 0 0 rgba(21,168,124,0);} }
.eq { display:inline-flex; align-items:flex-end; gap:3px; height:1.1rem; }
.eq span { width:3px; border-radius:2px; background:var(--green-bright); height:30%; animation:eq 1.1s ease-in-out infinite; }
.eq span:nth-child(2){ animation-delay:.15s; } .eq span:nth-child(3){ animation-delay:.30s; }
.eq span:nth-child(4){ animation-delay:.45s; } .eq span:nth-child(5){ animation-delay:.60s; }
@keyframes eq { 0%,100%{ height:25%; } 50%{ height:100%; } }

/* hero switchboard panel (light card) */
.switchboard { background:var(--white); border:1px solid var(--line); border-radius:1.4rem; padding:1.1rem; box-shadow:var(--shadow-lift); }
.switchboard-head { display:flex; align-items:center; gap:.6rem; padding:.4rem .65rem 1rem; color:var(--green); font-weight:700; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; }
.switchboard-head .eq { margin-left:auto; }
.call-feed { display:flex; flex-direction:column; gap:.85rem; }
.call-feed-live { display:block; position:relative; height:23rem; }
.call-feed-live .call-card { position:absolute; left:0; right:0; top:0; transition:transform .7s var(--ease), opacity .7s var(--ease); }
.call-feed-live .call-card[data-pos="0"]{ transform:translateY(0) scale(1); opacity:1; z-index:3; }
.call-feed-live .call-card[data-pos="1"]{ transform:translateY(7.4rem) scale(.965); opacity:.7; z-index:2; }
.call-feed-live .call-card[data-pos="2"]{ transform:translateY(14.8rem) scale(.93); opacity:.4; z-index:1; }
.call-card { background:var(--cream); border:1px solid var(--line); border-radius:1rem; padding:1.05rem 1.15rem; }
.call-row { display:flex; align-items:center; gap:.8rem; }
.call-ico { width:2.4rem; height:2.4rem; border-radius:999px; flex:none; display:flex; align-items:center; justify-content:center; background:var(--mint); color:var(--green); }
.call-ico svg { width:1.2rem; height:1.2rem; }
.call-time { font-weight:600; font-size:.74rem; color:var(--muted); }
.call-title { font-weight:700; color:var(--head); margin-top:.1rem; }
.call-meta { margin-left:auto; font-weight:700; font-size:.74rem; color:var(--green-bright); white-space:nowrap; }
.call-result { margin-top:.9rem; display:inline-flex; align-items:center; gap:.45rem; font-size:.84rem; font-weight:700; color:var(--green); background:var(--mint); border-radius:999px; padding:.4rem .85rem; }

/* ============================ PROBLEM / STAT BAND ============================ */
.band { display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.stat-row { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:2.5rem; }
.stat .n { font-family:'Mulish',sans-serif; font-weight:800; font-size:clamp(2.4rem,4vw,3.3rem); line-height:1; color:var(--green); letter-spacing:-.02em; }
.stat .n em { font-style:normal; color:var(--green-bright); }
.stat .k { margin-top:.5rem; font-size:.95rem; color:var(--muted); line-height:1.4; }
.section-ink .stat .n { color:#fff; } .section-ink .stat .n em { color:#6FE3BD; } .section-ink .stat .k { color:var(--on-green-mut); }
.divider-line { position:relative; height:1px; background:var(--line); overflow:hidden; }
.divider-line::after { content:""; position:absolute; top:0; left:-30%; width:30%; height:100%; background:linear-gradient(90deg, transparent, var(--green-bright), transparent); animation:scan 3.2s linear infinite; }
@keyframes scan { to { left:130%; } }

/* ============================ SECTION HEADERS ============================ */
.sec-head { max-width:42rem; }
.sec-head.center { margin-inline:auto; text-align:center; }
.sec-head .h-section { margin-top:.8rem; }
.sec-head .lead { margin-top:.9rem; }

/* ============================ BENTO / PRODUCT ============================ */
.bento { margin-top:2.75rem; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.card { background:var(--white); border:1px solid var(--line); border-radius:1.25rem; padding:1.6rem; box-shadow:var(--shadow-card); transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lift); }
.card .h-card { font-size:1.16rem; margin-top:1.05rem; }
.card p { margin-top:.45rem; font-size:.95rem; color:var(--muted); line-height:1.55; }
.feat-ico { width:3rem; height:3rem; border-radius:.8rem; display:flex; align-items:center; justify-content:center; background:var(--mint); color:var(--green); }
.feat-ico svg { width:1.45rem; height:1.45rem; }
.bento-hero { grid-column:span 2; grid-row:span 2; display:flex; flex-direction:column; justify-content:space-between; gap:2rem;
  background:linear-gradient(155deg, var(--green) 0%, #00564A 100%); color:var(--on-green); border:none; position:relative; overflow:hidden; box-shadow:var(--shadow-green); }
.bento-hero::before { content:""; position:absolute; width:22rem; height:22rem; right:-7rem; top:-7rem; border-radius:999px; background:radial-gradient(circle, rgba(111,227,189,.3), transparent 70%); }
.bento-hero .h-card { color:#fff; font-size:clamp(1.5rem,2.4vw,2rem); position:relative; }
.bento-hero p { color:var(--on-green-mut); position:relative; }
.bento-hero .feat-ico { background:rgba(255,255,255,.14); color:#fff; }
.mini-call { position:relative; background:rgba(255,255,255,.08); border:1px solid var(--ongreen-line-2); border-radius:.85rem; padding:.85rem 1rem; display:flex; align-items:center; gap:.75rem; }
.mini-call .call-ico { width:2rem; height:2rem; background:rgba(255,255,255,.16); color:#fff; }
.mini-call .t { font-weight:700; font-size:.92rem; color:#fff; }
.mini-call .b { margin-left:auto; font-weight:700; font-size:.72rem; color:var(--green); background:#fff; border-radius:999px; padding:.3rem .7rem; }
.note-line { margin-top:1rem; background:var(--cream); border:1px solid var(--line); border-radius:1rem; padding:1rem 1.25rem; text-align:center; font-size:.95rem; color:var(--muted); }

/* ============================ STEPS ============================ */
.steps { margin-top:3.25rem; display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; }
.step { position:relative; }
.step-num { font-family:'Mulish',sans-serif; font-weight:800; font-size:1.4rem; width:3.4rem; height:3.4rem; border-radius:.9rem; display:flex; align-items:center; justify-content:center; color:#6FE3BD; background:rgba(255,255,255,.08); border:1px solid var(--ongreen-line-2); }
.step h3 { font-size:1.25rem; font-weight:700; margin-top:1.2rem; color:#fff; }
.step p { margin-top:.55rem; color:var(--on-green-mut); }
.step:not(:last-child)::after { content:""; position:absolute; top:1.7rem; left:4rem; right:-1.25rem; height:1px; background:linear-gradient(90deg, var(--ongreen-line-2), transparent); }
@media (max-width:767px){ .step:not(:last-child)::after{ display:none; } }

/* ============================ INDUSTRIES / GRID CARDS ============================ */
.grid-4 { margin-top:2.75rem; display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
@media (max-width:900px){ .grid-3 { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .grid-3 { grid-template-columns:1fr; } }
.ind-card { display:block; }
.ind-card .h-card { font-size:1.08rem; }
.ind-card:hover .h-card { color:var(--green); }
.more-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem; }

/* ============================ USE CASES (scroll-spy) ============================ */
.uc-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2.5rem,5vw,4.5rem); align-items:start; }
.uc-sticky { position:sticky; top:6.5rem; }
.stepper { margin-top:2.25rem; }
.stepper-item { display:flex; align-items:center; gap:.85rem; padding:.65rem 0; color:var(--muted); font-weight:600; transition:color .3s var(--ease); }
.stepper-item:hover { color:var(--head); }
.stepper-dot { width:.7rem; height:.7rem; border-radius:999px; background:var(--line-2); flex:none; transition:background-color .3s var(--ease), box-shadow .3s var(--ease); }
.stepper-item[aria-current="true"] .stepper-dot { background:var(--green-bright); box-shadow:0 0 0 4px rgba(21,168,124,.18); }
.stepper-item[aria-current="true"] { color:var(--green); font-weight:700; }
.uc-cards { display:flex; flex-direction:column; gap:1.25rem; }
.uc-card { background:var(--white); border:1px solid var(--line); border-radius:1.25rem; overflow:hidden; box-shadow:var(--shadow-card); transition:box-shadow .35s var(--ease), transform .35s var(--ease); }
.uc-card:hover { box-shadow:var(--shadow-lift); transform:translateY(-3px); }
.uc-top { background:var(--mint-2); padding:1.5rem; }
.uc-chip { background:var(--white); border:1px solid var(--line); border-radius:.9rem; padding:1rem 1.1rem; }
.uc-chip .t1 { font-weight:600; font-size:.78rem; color:var(--muted); }
.uc-chip .t2 { font-weight:700; color:var(--head); margin-top:.25rem; font-size:.95rem; }
.uc-chip .t3 { margin-top:.7rem; display:inline-flex; font-size:.8rem; font-weight:700; color:var(--green); background:var(--mint); border-radius:999px; padding:.3rem .75rem; }
.uc-body { padding:1.5rem; }
.uc-body .h-card { font-size:1.3rem; }
.uc-body p { margin-top:.5rem; color:var(--muted); }
.uc-body .link-arrow { margin-top:1rem; }

/* ============================ STAFFING ============================ */
.staff-cards { margin-top:2.75rem; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.staff-card { background:rgba(255,255,255,.05); border:1px solid var(--ongreen-line-2); border-radius:1.25rem; padding:1.75rem; transition:transform .35s var(--ease), background-color .35s var(--ease); }
.staff-card:hover { transform:translateY(-4px); background:rgba(255,255,255,.09); }
.staff-card .h-card { font-size:1.3rem; color:#fff; }
.staff-card p { margin-top:.7rem; color:var(--on-green-mut); }
.staff-card .k { font-weight:800; font-size:.74rem; letter-spacing:.13em; text-transform:uppercase; color:#6FE3BD; }
.staff-card .eyebrow { color:#6FE3BD; }
.credential { margin-top:1.5rem; background:rgba(255,255,255,.05); border:1px solid var(--ongreen-line-2); border-radius:1.5rem; padding:clamp(2rem,4vw,2.75rem); text-align:center; }
.credential .big { font-family:'Mulish',sans-serif; font-weight:800; font-size:clamp(1.4rem,2.4vw,2rem); color:#fff; max-width:38rem; margin-inline:auto; line-height:1.25; letter-spacing:-.01em; }
.credential .sub { margin-top:1rem; color:var(--on-green-mut); max-width:40rem; margin-inline:auto; }
.clients-label { margin-top:1.75rem; font-weight:800; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--on-green-faint); }
.clients { margin-top:1.1rem; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.9rem 2.75rem; }
.client-mark { display:inline-flex; align-items:baseline; gap:.45rem; font-family:'Mulish',sans-serif; font-weight:800; font-size:clamp(1.15rem,1.9vw,1.5rem); color:var(--on-green-mut); letter-spacing:-.01em; transition:color .3s var(--ease); }
.client-mark:hover { color:#fff; }
.staff-tags { margin-top:2.25rem; text-align:center; font-weight:700; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--on-green-faint); }
.staff-honest { margin-top:2.5rem; max-width:44rem; margin-inline:auto; text-align:center; }

/* ============================ FAQ ============================ */
.faq { margin-top:2.75rem; display:flex; flex-direction:column; gap:.75rem; max-width:46rem; margin-inline:auto; }
.faq-item { background:var(--white); border:1px solid var(--line); border-radius:1rem; overflow:hidden; transition:box-shadow .3s var(--ease); }
.faq-item[open] { box-shadow:var(--shadow-card); border-color:var(--line-2); }
.faq-item summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.1rem 1.4rem; font-weight:700; color:var(--head); }
.faq-chevron { flex:none; color:var(--green-bright); transition:transform .3s var(--ease); }
.faq-item[open] .faq-chevron { transform:rotate(180deg); }
.faq-item p { padding:0 1.4rem 1.3rem; color:var(--muted); }
.faq-item p a { color:var(--green-bright); font-weight:700; }

/* ============================ CONTACT ============================ */
.contact-wrap { max-width:44rem; margin-inline:auto; text-align:center; position:relative; }
.contact-form { margin-top:2.25rem; max-width:34rem; margin-inline:auto; }
.form-pill { background:rgba(255,255,255,.1); border:1px solid var(--ongreen-line-2); border-radius:.8rem; padding:.45rem; display:flex; align-items:center; gap:.5rem; transition:box-shadow .3s var(--ease), border-color .3s var(--ease); }
.form-pill:focus-within { border-color:#6FE3BD; box-shadow:0 0 0 3px rgba(111,227,189,.25); }
.form-input { flex:1; min-width:0; background:transparent; border:0; outline:none; color:#fff; font-size:1rem; padding:.7rem 1rem; }
.form-input::placeholder { color:var(--on-green-faint); }
.form-success { margin-top:1.5rem; display:none; align-items:center; justify-content:center; gap:.5rem; font-weight:700; font-size:1.1rem; color:#6FE3BD; }
.contact-channels { margin-top:2.25rem; display:flex; flex-wrap:wrap; justify-content:center; gap:.75rem 2rem; color:var(--on-green-mut); }
.contact-channels a { display:inline-flex; align-items:center; gap:.5rem; font-weight:600; transition:color .3s var(--ease); }
.contact-channels a:hover { color:#fff; }
.contact-channels svg { width:1.2rem; height:1.2rem; color:#6FE3BD; }
.fineprint { margin-top:1.1rem; font-size:.88rem; color:var(--on-green-faint); }

/* ============================ TWO-SOLUTION CHOOSER ============================ */
.pick-grid { margin-top:2.75rem; display:grid; grid-template-columns:repeat(2,1fr); gap:1.25rem; }
.pick-card { position:relative; display:flex; flex-direction:column; border-radius:1.5rem; padding:clamp(1.75rem,3vw,2.4rem); overflow:hidden; transition:transform .35s var(--ease), box-shadow .35s var(--ease); min-height:21rem; }
.pick-card:hover { transform:translateY(-5px); }
.pick-ai { background:linear-gradient(155deg, var(--green) 0%, #00564A 100%); color:var(--on-green); box-shadow:var(--shadow-green); }
.pick-staff { background:var(--cream); color:var(--text); border:1px solid var(--line); box-shadow:var(--shadow-card); }
.pick-staff:hover { box-shadow:var(--shadow-lift); }
.pick-card::after { content:""; position:absolute; width:18rem; height:18rem; right:-6rem; top:-6rem; border-radius:999px; pointer-events:none; }
.pick-ai::after { background:radial-gradient(circle, rgba(111,227,189,.28), transparent 70%); }
.pick-staff::after { background:radial-gradient(circle, var(--peach-2), transparent 70%); opacity:.6; }
.pick-tag { position:relative; font-weight:800; font-size:.74rem; letter-spacing:.13em; text-transform:uppercase; display:inline-flex; align-items:center; gap:.5rem; }
.pick-ai .pick-tag { color:#6FE3BD; }
.pick-staff .pick-tag { color:var(--green-bright); }
.pick-card .h-card { position:relative; font-size:clamp(1.5rem,2.4vw,2rem); margin-top:1rem; }
.pick-ai .h-card { color:#fff; }
.pick-card .pick-lead { position:relative; margin-top:.85rem; flex:1; }
.pick-ai .pick-lead { color:var(--on-green-mut); }
.pick-staff .pick-lead { color:var(--muted); }
.pick-list { position:relative; margin-top:1.25rem; display:flex; flex-wrap:wrap; gap:.5rem; }
.pick-chip { font-size:.82rem; font-weight:700; border-radius:999px; padding:.35rem .85rem; }
.pick-ai .pick-chip { background:rgba(255,255,255,.12); color:#fff; }
.pick-staff .pick-chip { background:var(--mint); color:var(--green); }
.pick-cta { position:relative; margin-top:1.6rem; display:inline-flex; align-items:center; gap:.5rem; font-weight:700; transition:gap .3s var(--ease); }
.pick-ai .pick-cta { color:#6FE3BD; }
.pick-staff .pick-cta { color:var(--green-bright); }
.pick-card:hover .pick-cta { gap:.85rem; }
@media (max-width:767px){ .pick-grid { grid-template-columns:1fr; } }

/* slim industries/use-cases teaser */
.teaser-grid { margin-top:2.5rem; display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.teaser { display:flex; align-items:center; justify-content:space-between; gap:1rem; background:var(--cream); border:1px solid var(--line); border-radius:1.25rem; padding:1.6rem 1.75rem; transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.teaser:hover { transform:translateY(-3px); box-shadow:var(--shadow-card); }
.teaser .h-card { font-size:1.3rem; }
.teaser p { margin-top:.3rem; color:var(--muted); font-size:.95rem; }
.teaser .link-arrow { margin-top:.6rem; }
@media (max-width:767px){ .teaser-grid { grid-template-columns:1fr; } }

/* ============================ BREADCRUMB ============================ */
.breadcrumb { padding-top:1.5rem; }
.breadcrumb ol { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; font-weight:600; font-size:.8rem; }
.breadcrumb a { color:var(--on-green-faint); transition:color .3s var(--ease); }
.breadcrumb a:hover { color:#6FE3BD; }
.breadcrumb .sep { color:var(--on-green-faint); opacity:.6; }
.breadcrumb [aria-current="page"] { color:var(--on-green-mut); }

/* ============================ INNER-PAGE HERO (green band) ============================ */
.subhero { background:linear-gradient(160deg, var(--green) 0%, #00564A 100%); color:var(--on-green); position:relative; overflow:hidden; padding-block:clamp(2.25rem,4vw,3.5rem) clamp(3.5rem,7vw,5rem); }
.subhero::before { content:""; position:absolute; width:26rem; height:26rem; right:-8rem; top:-10rem; border-radius:999px; background:radial-gradient(circle, rgba(111,227,189,.22), transparent 70%); pointer-events:none; }
.subhero .inner { position:relative; max-width:46rem; }
.subhero h1 { margin-top:1.3rem; font-size:clamp(2.2rem,4.6vw,3.6rem); }
.subhero .lead { margin-top:1.3rem; max-width:38rem; }
.subhero-cta { margin-top:2rem; display:flex; flex-wrap:wrap; gap:.9rem; }

/* ============================ CHECK LIST ============================ */
.checklist { margin-top:2.25rem; display:flex; flex-direction:column; gap:.8rem; }
.check-item { display:flex; align-items:flex-start; gap:.9rem; border-radius:1rem; padding:1.05rem 1.25rem; transition:transform .3s var(--ease); }
.check-item p { font-size:1.02rem; line-height:1.5; }
.check-tick { flex:none; width:1.6rem; height:1.6rem; border-radius:999px; display:flex; align-items:center; justify-content:center; font-size:.85rem; font-weight:800; margin-top:.1rem; }
/* on white */
.section-paper .check-item, .section-cream .check-item { background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow-card); }
.section-paper .check-item:hover, .section-cream .check-item:hover { transform:translateX(4px); box-shadow:var(--shadow-lift); }
.section-paper .check-item p, .section-cream .check-item p { color:var(--head); }
.section-paper .check-tick, .section-cream .check-tick { background:var(--mint); color:var(--green); }
/* on green */
.section-ink .check-item { background:rgba(255,255,255,.05); border:1px solid var(--ongreen-line-2); }
.section-ink .check-item p { color:#fff; }
.section-ink .check-tick { background:rgba(255,255,255,.16); color:#6FE3BD; }

/* generic statement */
.statement { max-width:44rem; font-size:clamp(1.2rem,1.9vw,1.5rem); line-height:1.4; color:var(--head); font-weight:700; letter-spacing:-.01em; }
.section-ink .statement { color:#fff; }

/* ============================ CTA BAND ============================ */
.cta-band { background:linear-gradient(160deg, var(--green) 0%, #00564A 100%); border-radius:1.75rem; padding:clamp(2.25rem,5vw,3.5rem); text-align:center; position:relative; overflow:hidden; box-shadow:var(--shadow-green); }
.cta-band::before { content:""; position:absolute; width:26rem; height:26rem; left:50%; top:-14rem; margin-left:-13rem; border-radius:999px; background:radial-gradient(circle, rgba(111,227,189,.2), transparent 70%); pointer-events:none; }
.cta-band .h-section { position:relative; color:#fff; }
.cta-band .lead { position:relative; margin:1rem auto 0; max-width:38rem; color:var(--on-green-mut); }
.cta-band .btn { position:relative; margin-top:1.8rem; }
.cta-band .cta-sub { position:relative; margin-top:1.1rem; font-size:.9rem; color:var(--on-green-faint); }
.cta-band .cta-sub a { color:#6FE3BD; font-weight:600; }

/* ============================ CAREERS ============================ */
.role-group-label { font-weight:800; font-size:.76rem; letter-spacing:.13em; text-transform:uppercase; color:var(--green-bright); }
.role-grid { margin-top:1.5rem; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.role-card { background:var(--white); border:1px solid var(--line); border-radius:1.25rem; padding:1.5rem; display:flex; flex-direction:column; gap:.6rem; box-shadow:var(--shadow-card); transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.role-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lift); }
.role-card.internal { background:linear-gradient(155deg, var(--green), #00564A); border:none; box-shadow:var(--shadow-green); }
.role-card.internal .role-title { color:#fff; } .role-card.internal .role-desc { color:var(--on-green-mut); }
.role-card.internal .role-meta { color:#6FE3BD; }
.role-title { font-family:'Mulish',sans-serif; font-weight:700; font-size:1.2rem; color:var(--head); }
.role-meta { font-weight:700; font-size:.78rem; letter-spacing:.03em; color:var(--green-bright); }
.role-desc { color:var(--muted); font-size:.95rem; line-height:1.55; flex:1; }
.apply-btn { margin-top:.4rem; align-self:flex-start; display:inline-flex; align-items:center; gap:.5rem; background:var(--green); color:#fff; font-weight:700; font-size:.9rem; padding:.6rem 1.3rem; border-radius:.6rem; transition:background-color .3s var(--ease), transform .3s var(--ease); }
.apply-btn:hover { background:var(--green-700); transform:translateY(-2px); }
.role-card.internal .apply-btn { background:#fff; color:var(--green); }
.role-card.internal .apply-btn:hover { background:var(--mint); }
.apply-note { display:flex; align-items:flex-start; gap:.9rem; max-width:44rem; background:var(--cream); border:1px solid var(--line); border-radius:1.1rem; padding:1.1rem 1.3rem; box-shadow:var(--shadow-card); }
.apply-note .ico { flex:none; width:2.4rem; height:2.4rem; border-radius:.6rem; background:var(--mint); color:var(--green); display:flex; align-items:center; justify-content:center; }
.apply-note .ico svg { width:1.3rem; height:1.3rem; }
.apply-note p { color:var(--head); }
.apply-note a { color:var(--green-bright); font-weight:700; }
@media (max-width:900px){ .role-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .role-grid { grid-template-columns:1fr; } }

.split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,4vw,4rem); align-items:center; }
@media (max-width:860px){ .split { grid-template-columns:1fr; } }

/* ============================ FOOTER ============================ */
.site-footer { background:var(--green-deep); color:var(--on-green-mut); position:relative; }
.footer-grid { display:grid; grid-template-columns:1.7fr 1fr 1fr 1fr; gap:2.5rem 2rem; padding-block:clamp(3.5rem,6vw,4.5rem) 2.5rem; }
.footer-logo { height:2rem; width:auto; filter:brightness(0) invert(1); opacity:.95; }
.footer-blurb { margin-top:1.2rem; max-width:24rem; font-size:.94rem; line-height:1.6; }
.footer-contact { margin-top:1.5rem; display:flex; flex-direction:column; gap:.35rem; font-size:.9rem; line-height:1.5; }
.footer-contact a { color:#fff; font-weight:600; }
.footer-contact a:hover { color:#6FE3BD; }
.footer-contact .addr { color:var(--on-green-mut); }
.footer-col h4 { font-weight:800; font-size:.74rem; letter-spacing:.13em; text-transform:uppercase; color:#6FE3BD; }
.footer-col ul { margin-top:1.1rem; display:flex; flex-direction:column; gap:.7rem; }
.footer-col a { color:var(--on-green-mut); font-size:.94rem; transition:color .3s var(--ease), padding-left .3s var(--ease); }
.footer-col a:hover { color:#fff; padding-left:.25rem; }
.footer-bottom { border-top:1px solid var(--ongreen-line); padding-block:1.6rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem 2rem; font-size:.85rem; }
.footer-bottom .f-loc { font-weight:700; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--on-green-faint); }
@media (max-width:760px){ .footer-grid { grid-template-columns:1fr 1fr; } .footer-grid > :first-child { grid-column:1 / -1; } }
@media (max-width:460px){ .footer-grid { grid-template-columns:1fr; } }

/* ============================ REVEAL ============================ */
.reveal-init { opacity:0; transform:translateY(24px); }
.reveal-in { opacity:1; transform:none; transition:opacity .7s var(--ease), transform .7s var(--ease); }
.hidden { display:none !important; }
.flex { display:flex !important; }

/* ============================ RESPONSIVE ============================ */
@media (max-width:1023px){
  .hero-grid { grid-template-columns:1fr; }
  .switchboard { max-width:30rem; }
  .band { grid-template-columns:1fr; }
  .bento { grid-template-columns:repeat(2,1fr); }
  .grid-4 { grid-template-columns:repeat(2,1fr); }
  .uc-grid { grid-template-columns:1fr; }
  .uc-sticky { position:static; }
  .stepper { display:none; }
}
@media (max-width:900px){
  .nav, .nav-right { display:none; }
  .site-header .bar { grid-template-columns:1fr auto; }
  .mobile-toggle { display:block; }
}
@media (max-width:767px){
  .stat-row { grid-template-columns:1fr; gap:1.75rem; }
  .bento { grid-template-columns:1fr; }
  .bento-hero { grid-column:span 1; grid-row:auto; }
  .grid-4 { grid-template-columns:1fr; }
  .steps { grid-template-columns:1fr; }
  .staff-cards { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .call-feed-live { height:auto; display:flex; flex-direction:column; gap:.85rem; }
  .call-feed-live .call-card { position:static; transform:none !important; opacity:1 !important; }
  .dropdown-panel.wide .dropdown-inner { width:18rem; grid-template-columns:1fr; }
}

@media (prefers-reduced-motion:reduce){
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .divider-line::after, .eq span, .live-dot { animation:none !important; }
}

/* ============================ MEGA MENU ============================ */
.dropdown-panel.mega { left:50%; transform:translate(-50%,12px); }
.dropdown:hover .dropdown-panel.mega, .dropdown:focus-within .dropdown-panel.mega, .dropdown.open .dropdown-panel.mega { transform:translate(-50%,0); }
.mega-inner { background:var(--white); border:1px solid var(--line); border-radius:1.25rem; box-shadow:var(--shadow-lift); padding:.85rem; max-width:calc(100vw - 2rem); }
.mega-grid { display:grid; gap:.1rem; grid-template-columns:repeat(2,1fr); }
.mega-2 { width:36rem; }
.mega-4 { width:39rem; }
.mega-8 { width:46rem; }
.mega-head { grid-column:1 / -1; padding:.5rem .8rem .25rem; font-weight:800; font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--green-bright); }
.mega-item { display:flex; gap:.8rem; align-items:flex-start; padding:.7rem .8rem; border-radius:.8rem; transition:background-color .25s var(--ease); opacity:0; transform:translateY(7px); }
.dropdown:hover .mega-item, .dropdown:focus-within .mega-item, .dropdown.open .mega-item { opacity:1; transform:none; transition:opacity .4s var(--ease), transform .4s var(--ease), background-color .25s var(--ease); }
.mega-item:nth-child(2){ transition-delay:.03s; } .mega-item:nth-child(3){ transition-delay:.06s; } .mega-item:nth-child(4){ transition-delay:.09s; }
.mega-item:nth-child(5){ transition-delay:.12s; } .mega-item:nth-child(6){ transition-delay:.15s; } .mega-item:nth-child(7){ transition-delay:.18s; }
.mega-item:nth-child(8){ transition-delay:.21s; } .mega-item:nth-child(9){ transition-delay:.24s; }
.mega-item:hover { background:var(--mint-2); }
.mega-ico { width:2.3rem; height:2.3rem; flex:none; border-radius:.6rem; display:flex; align-items:center; justify-content:center; background:var(--mint); color:var(--green); }
.mega-ico svg { width:1.2rem; height:1.2rem; }
.mega-item .t { display:flex; align-items:center; gap:.3rem; color:var(--head); font-weight:700; font-size:.93rem; line-height:1.2; }
.mega-item .d { display:block; color:var(--muted); font-size:.8rem; margin-top:.12rem; line-height:1.3; }
.mega-foot { grid-column:1 / -1; margin-top:.2rem; border-top:1px solid var(--line); padding:.8rem .8rem .35rem; }
.mega-foot a { display:inline-flex; align-items:center; gap:.45rem; color:var(--green-bright); font-weight:700; font-size:.88rem; transition:gap .3s var(--ease); }
.mega-foot a:hover { gap:.75rem; color:var(--green); }
@media (max-width:1100px){ .mega-8 { width:40rem; } .mega-4 { width:34rem; } .mega-2 { width:32rem; } }

/* IG-style multi-column services menu (Technology / Staffing / Consulting) */
.mega-cols { display:grid; grid-template-columns:repeat(3,minmax(11rem,1fr)); gap:.15rem 1.25rem; width:44rem; }
.mega-col-head { font-weight:800; font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--green-bright); padding:.55rem .7rem .4rem; }
.mega-col-head a { color:inherit; }
.mega-link { display:block; padding:.5rem .7rem; border-radius:.6rem; color:var(--head); font-weight:600; font-size:.92rem; line-height:1.3; transition:background-color .2s var(--ease), color .2s var(--ease); }
.mega-link:hover { background:var(--mint-2); color:var(--green); }
@media (max-width:1100px){ .mega-cols { width:40rem; } }

/* ============================ LEGAL PAGES ============================ */
.legal { max-width:48rem; margin-inline:auto; }
.legal h2 { font-size:1.3rem; color:var(--head); font-weight:800; margin-top:2.4rem; margin-bottom:.7rem; }
.legal h2:first-of-type { margin-top:0; }
.legal p { color:var(--text); margin-bottom:1rem; }
.legal ul { margin:0 0 1rem 1.3rem; list-style:disc; }
.legal li { margin-bottom:.4rem; color:var(--text); }
.legal a { color:var(--green-bright); font-weight:600; }
.legal .updated { color:var(--muted); font-size:.92rem; margin-bottom:2rem; }

/* ============================ HERO ART (talent network) ============================ */
.hero-art { position:relative; border-radius:1.75rem; padding:clamp(1.25rem,3vw,2.25rem);
  background:radial-gradient(125% 115% at 72% 4%, var(--mint-2) 0%, #fff 62%);
  border:1px solid var(--line); box-shadow:var(--shadow-lift); }
.hero-art svg { display:block; width:100%; height:auto; }
.ca-dot { animation:caPulse 3.4s ease-in-out infinite; }
@keyframes caPulse { 0%,100% { opacity:.35; } 50% { opacity:1; } }
.ca-ring { transform-box:fill-box; transform-origin:center; animation:caRing 3.8s ease-out infinite; }
@keyframes caRing { 0% { transform:scale(.7); opacity:.6; } 70% { opacity:0; } 100% { transform:scale(1.5); opacity:0; } }

/* ============================ SOCIAL PROOF (logo strip) ============================ */
.social-proof { background:var(--cream); border-bottom:1px solid var(--line); padding-block:clamp(1.75rem,3vw,2.5rem); }
.social-label { text-align:center; font-weight:800; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:1.25rem; }
.proof-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1rem 3.25rem; }
.proof-mark { font-family:'Mulish',sans-serif; font-weight:800; font-size:clamp(1.05rem,1.8vw,1.45rem); color:var(--muted); letter-spacing:-.01em; opacity:.72; transition:opacity .3s var(--ease), color .3s var(--ease); white-space:nowrap; }
.proof-mark:hover { opacity:1; color:var(--green); }

/* ============================ NO DARK — light theme (overrides everything dark) ============================ */
/* Every previously pine-green/dark surface is now light. Green is an accent only (text, buttons, marks). */

/* Section + panel backgrounds */
.section-ink      { background:var(--mint-2); color:var(--text); }
.section-ink-soft { background:var(--cream);  color:var(--text); }
.subhero          { background:linear-gradient(160deg, var(--mint-2) 0%, var(--cream) 55%, var(--white) 100%); color:var(--text); }
.cta-band         { background:linear-gradient(160deg, var(--mint) 0%, var(--mint-2) 100%); border:1px solid var(--line); box-shadow:var(--shadow-card); }
.pick-ai          { background:var(--mint-2); color:var(--text); border:1px solid var(--line); box-shadow:var(--shadow-card); }

/* Type colors on now-light sections */
.section-ink .eyebrow, .section-ink-soft .eyebrow, .subhero .eyebrow { color:var(--green-bright); }
.section-ink .lead, .section-ink-soft .lead, .subhero .lead { color:var(--muted); }
.section-ink .h-section, .section-ink-soft .h-section, .subhero h1, .subhero .h-section { color:var(--green); }
.section-ink .accent, .section-ink-soft .accent, .subhero .accent { color:var(--green-bright); }
.section-ink .link-arrow, .section-ink-soft .link-arrow, .subhero .link-arrow { color:var(--green-bright); }
.section-ink .link-arrow:hover, .subhero .link-arrow:hover { color:var(--green); }

/* Buttons: normal green primary on light (undo white-invert); ghost-dark -> light */
.section-ink .btn-primary, .section-ink-soft .btn-primary, .subhero .btn-primary, .cta-band .btn-primary {
  background:var(--green); color:#fff; box-shadow:0 10px 24px -12px rgba(0,64,56,.6); }
.section-ink .btn-primary:hover, .section-ink-soft .btn-primary:hover, .subhero .btn-primary:hover, .cta-band .btn-primary:hover {
  background:var(--green-700); }
.btn-ghost-dark { background:var(--white); color:var(--green); border:1px solid var(--line-2); }
.btn-ghost-dark:hover { background:var(--cream); }

/* Stat band */
.section-ink .stat .n { color:var(--green); }
.section-ink .stat .n em { color:var(--green-bright); }
.section-ink .stat .k { color:var(--muted); }

/* Checklists */
.section-ink .check-item { background:var(--white); border:1px solid var(--line); }
.section-ink .check-item p { color:var(--text); }
.section-ink .check-tick { background:var(--mint); color:var(--green); }

/* How-it-works steps */
.step h3 { color:var(--head); }
.step p  { color:var(--muted); }
.step-num { color:var(--green); background:var(--mint); border:1px solid var(--line); }
.step:not(:last-child)::after { background:linear-gradient(90deg, var(--line-2), transparent); }

/* Staff / value cards */
.staff-card { background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow-card); }
.staff-card:hover { background:var(--white); box-shadow:var(--shadow-lift); }
.staff-card .h-card { color:var(--head); }
.staff-card p { color:var(--muted); }
.staff-card .k, .staff-card .eyebrow { color:var(--green-bright); }

/* pick-ai card children */
.pick-ai .pick-tag { color:var(--green-bright); }
.pick-ai .h-card   { color:var(--green); }
.pick-ai .pick-lead { color:var(--muted); }
.pick-ai .pick-chip { background:var(--mint); color:var(--green); }
.pick-ai .pick-cta { color:var(--green-bright); }
.pick-ai::after { background:radial-gradient(circle, rgba(21,168,124,.14), transparent 70%); }

/* Credential / clients block */
.credential { background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow-card); }
.credential .big { color:var(--head); }
.credential .sub { color:var(--muted); }
.clients-label { color:var(--green-bright); }
.client-mark { color:var(--muted); }
.client-mark:hover { color:var(--green); }
.staff-tags { color:var(--green-bright); }

/* Contact form */
.form-pill { background:var(--white); border:1px solid var(--line-2); }
.form-input { color:var(--text); }
.form-input::placeholder { color:var(--muted); }
.form-success { color:var(--green-bright); }

/* CTA band */
.cta-band .h-section { color:var(--green); }
.cta-band .lead { color:var(--muted); }
.cta-band .cta-sub { color:var(--muted); }
.cta-band .cta-sub a { color:var(--green-bright); }
.cta-band::before { background:radial-gradient(circle, rgba(21,168,124,.12), transparent 70%); }


/* Platform logo strip (grayed monochrome) + contact-channel contrast on light */
.logo-cloud-item { height:2rem; width:auto; filter:grayscale(1); opacity:.5; transition:opacity .3s var(--ease); }
.logo-cloud-item:hover { opacity:.8; }
.contact-channels { color:var(--muted); }
.contact-channels a { color:var(--text); }
.contact-channels a:hover { color:var(--green); }
.contact-channels svg { color:var(--green-bright); }
