/* ===== Indwoke — Design tokens ===== */
:root{
  --blue: #244570;
  --blue-dark: #1a3255;
  --orange: #E85B25;
  --orange-dark: #c94a1b;
  --grey: #EAF0F6;
  --white: #FFFFFF;
  --graphite: #2B2F36;
  --ink: #1c2430;
  --muted: #5b6472;
  --line: #dfe6ee;

  --font-head: 'Space Grotesk', sans-serif;
  --font-body: 'Manrope', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;

  --container: 1180px;
  --radius: 14px;
  --shadow: 0 14px 40px -18px rgba(36,69,112,0.35);
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; overflow-x: hidden; }
body{
  margin:0;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
h1,h2,h3,h4{ font-family: var(--font-head); margin:0; color: var(--blue); line-height:1.15; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
section{ position:relative; }

.container{ max-width: var(--container); margin:0 auto; padding:0 24px; }
.section-pad{ padding: 120px 0; }
.eyebrow{
  font-family: var(--font-mono);
  font-size: 12.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--orange);
  font-weight: 700;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:18px;
}
.eyebrow::before{
  content:"";
  width:7px; height:7px; border-radius:50%;
  background: var(--orange);
  display:inline-block;
}
.section-head{
  max-width: 680px; margin: 0 auto 56px; text-align:center;
}
.section-head .eyebrow{ justify-content:center; }
.section-head h2{ font-size: clamp(28px, 3.4vw, 42px); margin-bottom: 16px; }
.section-head p{ color: var(--muted); font-size: 17px; margin:0 auto; }
.center{ text-align:center; margin-left:auto; margin-right:auto; }

/* Hand-drawn underline accent — reusable brand motif */
.swoosh{ position:relative; display:inline-block; }
.swoosh::after{
  content:""; position:absolute; left:-2%; right:-2%; bottom:-12px; height:16px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 24"><path d="M4 16 Q100 2 150 12 T296 15" stroke="%23E85B25" stroke-width="7" fill="none" stroke-linecap="round"/></svg>') no-repeat center / 100% 100%;
}
.swoosh.light::after{
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 24"><path d="M4 16 Q100 2 150 12 T296 15" stroke="%23ffffff" stroke-width="7" fill="none" stroke-linecap="round" opacity="0.9"/></svg>') no-repeat center / 100% 100%;
}
/* two-column feature intros keep left alignment */
.split > .col-copy .section-head{ text-align:left; margin:0 0 20px; }

.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family: var(--font-body); font-weight:700; font-size:15px;
  padding: 16px 30px; border-radius: 999px; border:2px solid transparent;
  cursor:pointer; transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  white-space:nowrap;
}
.btn .arrow{ display:inline-block; transition: transform .18s ease; }
.btn:hover .arrow{ transform: translateX(3px); }
.btn-primary{
  background: linear-gradient(135deg, var(--orange), var(--orange-dark)); color:#fff;
  box-shadow: 0 14px 30px -10px rgba(232,91,37,.6);
}
.btn-primary:hover{ box-shadow: 0 18px 36px -8px rgba(232,91,37,.7); transform: translateY(-2px); }
.btn-ghost{ border-color: rgba(255,255,255,.4); color:#fff; }
.btn-ghost:hover{ background: rgba(255,255,255,.1); }
.btn-outline{ border-color: var(--blue); color: var(--blue); }
.btn-outline:hover{ background: var(--blue); color:#fff; transform: translateY(-2px); box-shadow: 0 14px 28px -12px rgba(36,69,112,.5); }

/* ===== Header ===== */
.site-header{
  position: fixed; top:0; left:0; right:0; z-index: 100;
  background: transparent;
  transition: background .3s ease, box-shadow .3s ease;
  padding: 22px 0;
}
.site-header.scrolled{
  background: #fff; box-shadow: 0 1px 0 var(--line); padding: 0;
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height: 66px;
}
.site-header.scrolled .container{ height: 88px; }
.logo img{ height: 50px; position: relative; top:3px; transition: filter .3s ease; }
.site-header:not(.scrolled) .logo img{ filter: brightness(0) invert(1); }
.logo-invert{ filter: brightness(0) invert(1); }
.main-nav ul{ display:flex; gap: 36px; }
.main-nav a{
  font-weight:700; font-size:14.5px; color: #fff;
  position:relative; padding: 6px 0; text-transform:uppercase; letter-spacing:.02em;
  transition: color .3s ease;
}
.site-header.scrolled .main-nav a{ color: var(--ink); }
.main-nav a:hover{ color: var(--orange); }
.header-actions{ display:flex; align-items:center; gap:22px; }
.header-phone{
  display:flex; align-items:center; gap:10px; font-weight:700; font-size:14.5px; color:#fff;
  border: 1.5px solid rgba(255,255,255,.4); border-radius:999px; padding: 10px 20px 10px 10px;
  transition: color .3s ease, border-color .3s ease;
}
.site-header.scrolled .header-phone{ color: var(--blue); border-color: var(--line); }
.header-phone .ph-icon{
  width:32px; height:32px; border-radius:50%; background: rgba(255,255,255,.15); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:14px; transition: background .3s ease, color .3s ease;
}
.site-header.scrolled .header-phone .ph-icon{ background: var(--grey); color: var(--orange); }
.header-actions .btn{ padding: 13px 24px; font-size:14px; }
.nav-toggle{ display:none; background:none; border:none; cursor:pointer; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:""; display:block; width:24px; height:2px; background: #fff; margin:5px 0; position:relative;
  transition: background .3s ease;
}
.site-header.scrolled .nav-toggle span,
.site-header.scrolled .nav-toggle span::before,
.site-header.scrolled .nav-toggle span::after{ background: var(--blue); }

/* ===== Hero ===== */
.hero{
  position:relative; min-height: 96vh; display:flex; align-items:center;
  padding: 150px 0 90px; overflow:hidden; text-align:center; color:#fff;
}
.hero::before{
  content:""; position:absolute; left:0; right:0; top:-18%; height:136%; z-index:-2;
  background: var(--section-bg, none) center 30%/cover no-repeat;
  transform: translateY(var(--parallax, 0px));
  will-change: transform;
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(180deg, rgba(20,38,64,.90), rgba(24,44,72,.86) 55%, rgba(20,38,64,.94));
}
.hero .container{ max-width: 980px; position:relative; z-index:1; }
.hero-copy{ max-width: 760px; margin: 0 auto; }
.hero .eyebrow{ color: var(--orange); }
.hero .eyebrow::before{ background: var(--orange); }
.hero h1{ font-size: clamp(36px, 5vw, 64px); letter-spacing:-.01em; margin-bottom:34px; color:#fff; }
.hero h1 .line2{ position:relative; display:inline-block; }
.hero h1 .line2::after{
  content:""; position:absolute; left:-2%; right:-2%; bottom:-16px; height:20px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 24"><path d="M4 16 Q100 2 150 12 T296 15" stroke="%23E85B25" stroke-width="7" fill="none" stroke-linecap="round"/></svg>') no-repeat center / 100% 100%;
}
.hero h1 .accent{ color: var(--orange); }
.hero p.lede{ font-size: 19px; color: rgba(255,255,255,.82); max-width: 620px; margin:0 auto 34px; }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom: 34px; justify-content:center; }
.hero .btn-outline{ background:#fff; border-color:#fff; color: var(--blue); }
.hero .btn-outline:hover{ background:transparent; color:#fff; border-color:#fff; transform:translateY(-2px); box-shadow:none; }
.hero-flags{ display:flex; flex-wrap:wrap; gap: 22px; justify-content:center; margin-bottom: 64px; }
.hero-flags li{
  display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color: rgba(255,255,255,.85);
}
.hero-flags li::before{ content:"✓"; color:#4ade80; font-weight:800; }

.hero-visual{ position:relative; max-width: 1080px; margin: 0 auto; padding-bottom: 40px; text-align:left; }
.hero-card{
  background: linear-gradient(135deg, var(--blue), var(--blue-dark));
  border-radius: 26px;
  padding: 48px;
  color:#fff;
  box-shadow: 0 40px 70px -30px rgba(36,69,112,0.45);
  position:relative;
  overflow:hidden;
}
.hero-card::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(500px 260px at 90% 0%, rgba(232,91,37,.22), transparent 60%);
}
.hero-card-inner{ position:relative; z-index:1; }
.hero-card .tag{
  font-family: var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  background: rgba(255,255,255,.14); display:inline-block; padding:6px 12px; border-radius:999px; margin-bottom:22px;
}
.hero-card-grid{ display:grid; grid-template-columns: 1.3fr .7fr; gap:44px; align-items:center; }
.hero-card-grid > *{ min-width:0; }
.hero-card h3{ color:#fff; font-size:24px; margin-bottom:8px; }
.hero-card .sub{ color: rgba(255,255,255,.72); font-size:14px; margin-bottom:24px; }
.progress-track{
  height:10px; border-radius:999px; background: rgba(255,255,255,.18); overflow:hidden; margin-bottom:10px;
}
.progress-fill{ height:100%; width:22%; background: var(--orange); border-radius:999px; }
.progress-labels{ display:flex; justify-content:space-between; font-family: var(--font-mono); font-size:12px; color: rgba(255,255,255,.75); }
.hero-stat-row{ display:flex; flex-direction:column; gap:14px; }
.hero-stat{ background: rgba(255,255,255,.09); border-radius:14px; padding:16px 18px; }
.hero-stat .num{ font-family: var(--font-mono); font-size:26px; font-weight:700; color: var(--orange); }
.hero-stat .lbl{ font-size:12.5px; color: rgba(255,255,255,.7); margin-top:2px; }

/* ===== Marquee / logo strip removed for institutional feel — using claim strip ===== */
.claim-strip{ background: var(--blue); padding: 18px 0; }
.claim-strip .container{ display:flex; flex-wrap:wrap; gap: 26px 40px; justify-content:center; }
.claim-strip span{ color: rgba(255,255,255,.88); font-size:13.5px; font-weight:600; display:flex; align-items:center; gap:8px; }
.claim-strip span::before{ content:""; width:6px; height:6px; border-radius:50%; background: var(--orange); }

/* ===== Grey section ===== */
.bg-grey{ background: var(--grey); }
.bg-blue{ background: var(--blue); color:#fff; }
.bg-blue h2, .bg-blue h3{ color:#fff; }
.bg-graphite{
  background: var(--graphite); color:#fff; position:relative; overflow:hidden;
}
.bg-graphite::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(560px 320px at 90% 0%, rgba(232,91,37,.14), transparent 60%),
    radial-gradient(circle, rgba(255,255,255,.06) 1.4px, transparent 1.6px);
  background-size: 100% 100%, 24px 24px;
}
.bg-graphite .container{ position:relative; z-index:1; }
.bg-graphite h2, .bg-graphite h3{ color:#fff; }
.security-photo{ background: var(--graphite); }
.security-photo::before{
  position:absolute; left:0; right:0; top:-18%; height:136%;
  background:
    radial-gradient(560px 320px at 90% 0%, rgba(232,91,37,.16), transparent 60%),
    radial-gradient(circle, rgba(255,255,255,.06) 1.4px, transparent 1.6px),
    linear-gradient(120deg, rgba(20,25,32,.94), rgba(43,47,54,.88)),
    var(--section-bg, none) center/cover no-repeat;
  background-size: 100% 100%, 24px 24px, 100% 100%, cover;
  transform: translateY(var(--parallax, 0px));
  will-change: transform;
}

/* Two column feature */
.split{ display:grid; grid-template-columns: 1fr 1fr; gap:64px; align-items:center; }
.split.reverse .col-media{ order:2; }
.split > .col-copy, .split > .col-media{ min-width:0; }
.col-media{ position:relative; }
.col-media::before{
  content:""; position:absolute; width:88%; height:88%; top:-18px; left:-18px; z-index:0;
  background: linear-gradient(135deg, var(--orange), var(--blue)); border-radius: 26px; opacity:.16;
}
.col-media img{ border-radius: var(--radius); box-shadow: var(--shadow); position:relative; z-index:1; }
.pill-list{ margin-top:24px; display:flex; flex-direction:column; gap:14px; }
.pill-list li{ display:flex; gap:12px; align-items:flex-start; font-size:15px; color: var(--muted); }
.pill-list li b{ color: var(--ink); }
.dot-num{
  flex:none; width:30px; height:30px; border-radius:50%; background: var(--blue); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family: var(--font-mono); font-size:13px; font-weight:700;
}

/* ===== Card grid (methodology / expertise) ===== */
.card-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.icard{
  background:#fff; border:1px solid var(--line); border-radius: 18px;
  padding: 38px 30px; text-align:center; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.icard::before{
  content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:0; height:3px; background: linear-gradient(90deg, var(--blue), var(--orange));
  border-radius:0 0 4px 4px; transition: width .25s ease;
}
.icard{ position:relative; overflow:hidden; }
.icard:hover{ transform: translateY(-8px); box-shadow: 0 26px 48px -20px rgba(36,69,112,.4); border-color: transparent; }
.icard:hover::before{ width:64px; }
.icard .num{
  font-family: var(--font-mono); color:#fff; background: linear-gradient(135deg, var(--blue), var(--blue-dark));
  width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:700; margin: 0 auto 20px; box-shadow: 0 10px 22px -8px rgba(36,69,112,.5);
}
.icard h3{ font-size:19px; margin-bottom:12px; color: var(--ink); }
.icard p{ color: var(--muted); font-size:14.5px; }
.icon-box{
  width:58px; height:58px; border-radius:50%;
  background: linear-gradient(135deg, rgba(36,69,112,.1), rgba(232,91,37,.14));
  display:flex; align-items:center; justify-content:center; margin: 0 auto 20px; color: var(--orange);
  box-shadow: inset 0 0 0 1px rgba(36,69,112,.08);
}
.icon-box svg{ width:24px; height:24px; }
.step-label{
  display:inline-block; font-family: var(--font-mono); font-size:11.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; color: var(--orange); margin-bottom:10px;
}
.icard.text-left{ text-align:left; }
.icard.text-left .num, .icard.text-left .icon-box{ margin-left:0; margin-right:auto; }
.icard.text-left::before{ left:30px; transform:none; }

/* ===== Stat band ===== */
.stat-band{ background: var(--blue); color:#fff; padding: 76px 0; position:relative; overflow:hidden; }
.stat-band::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(600px 300px at 15% 20%, rgba(232,91,37,.22), transparent 60%),
    radial-gradient(circle, rgba(255,255,255,.10) 1.4px, transparent 1.6px);
  background-size: 100% 100%, 26px 26px;
}
.stat-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap: 30px; position:relative; z-index:1;}
.stat-grid .stat{ text-align:center; border-left:1px solid rgba(255,255,255,.16); padding-left: 24px; }
.stat-grid .stat:first-child{ border-left:none; padding-left:0; }
.stat .num{ font-family: var(--font-mono); font-size: 46px; font-weight:700; color: var(--orange); }
.stat .lbl{ font-size:13px; letter-spacing:.04em; text-transform:uppercase; font-weight:700; margin-top:8px; }
.stat .sub{ font-size:13px; color: rgba(255,255,255,.65); margin-top:4px; }

/* ===== Spec card (case-study study-design key/value list) ===== */
.spec-card{
  position:relative; z-index:1; border-radius: var(--radius); border:1px solid var(--line);
  box-shadow: 0 24px 46px -28px rgba(36,69,112,.3); overflow:hidden;
  background: linear-gradient(155deg, rgba(232,91,37,.18), rgba(234,240,246,.8) 58%, #fff 100%);
}
.spec-row{
  display:grid; grid-template-columns: 150px 1fr; column-gap:20px; align-items:center;
  padding: 17px 22px; border-top:1px solid rgba(255,255,255,.65);
}
.spec-row:first-child{ border-top:none; }
.spec-row:last-child{ background: var(--grey); }
.spec-label, .spec-value{ min-width:0; }
.spec-label{
  font-family: var(--font-mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.06em;
  color: var(--blue); font-weight:700;
}
.spec-value{ color: var(--ink); font-size:14.5px; }

/* ===== Table (protocol bank) ===== */
.table-wrap{ overflow-x:auto; border-radius: var(--radius); border:1px solid var(--line); box-shadow: 0 24px 46px -28px rgba(36,69,112,.3); }
table.data-table{ width:100%; border-collapse: collapse; font-size:14.5px; min-width:640px; }
table.data-table th{
  text-align:left; background: var(--grey); color: var(--blue); font-family: var(--font-mono);
  font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; padding: 16px 20px; font-weight:700;
}
table.data-table td{ padding: 16px 20px; border-top:1px solid var(--line); color: var(--ink); }
.badge{ display:inline-flex; align-items:center; gap:6px; font-family: var(--font-mono); font-size:11.5px; font-weight:700; padding:5px 11px; border-radius:999px; text-transform:uppercase; letter-spacing:.04em;}
.badge.live{ background:#fdece3; color:var(--orange-dark); }
.badge.ready{ background:#eaf6ee; color:#1f9d63; }

/* ===== Timeline / gameplan ===== */
.timeline{ display:flex; flex-direction:column; gap:0; position:relative; }
.timeline::before{ content:""; position:absolute; left:6px; top:12px; bottom:12px; width:2px; background: var(--line); }
.tl-item{ display:grid; grid-template-columns: 160px 1fr; gap: 32px; padding: 32px 0 32px 28px; border-top:1px solid var(--line); position:relative; }
.tl-item:first-child{ border-top:none; }
.tl-item::before{
  content:""; position:absolute; left:0; top:40px; width:14px; height:14px; border-radius:50%;
  background: var(--orange); box-shadow: 0 0 0 4px rgba(232,91,37,.18);
}
.tl-when{ font-family: var(--font-mono); font-size:13px; color: var(--orange); font-weight:700; }
.tl-badge{ display:inline-block; margin-top:8px; font-size:11px; font-family: var(--font-mono); background: var(--blue); color:#fff; padding:4px 10px; border-radius:999px; }
.tl-body h3{ font-size:21px; margin-bottom:4px; }
.tl-body .step{ color: var(--orange); font-family: var(--font-mono); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; display:block; margin-bottom:6px;}
.tl-body p{ color: var(--muted); font-size:15px; max-width:640px; }
.tl-body .audience{ margin-top:10px; font-size:13px; color: var(--blue); font-weight:600; }

/* ===== Values / who we are ===== */
.value-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: 26px; }
.value-card{ background:#fff; border-radius: var(--radius); padding:28px; border:1px solid var(--line); text-align:left; transition: transform .2s ease, box-shadow .2s ease; }
.value-card:hover{ transform: translateY(-5px); box-shadow: var(--shadow); }
.value-card h3{ font-size:18px; margin-bottom:8px; }
.value-card p{ color: var(--muted); font-size:14.5px; }

/* ===== Publication commitment ===== */
.commit-grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.commit-card{ border-radius: var(--radius); padding:30px; box-shadow: 0 20px 40px -26px rgba(36,69,112,.25); }
.commit-card.will{ background:#eaf6ee; border:1px solid #cfe9d7; }
.commit-card.never{ background:#fdeceb; border:1px solid #f3d0cb; }
.commit-card h3{ font-size:18px; margin-bottom:16px; color: var(--ink); }
.commit-card ul{ display:flex; flex-direction:column; gap:14px; }
.commit-card li{ display:flex; gap:10px; font-size:14.5px; color: var(--ink); }
.commit-card.will li::before{ content:"✓"; color:#1f9d63; font-weight:800; }
.commit-card.never li::before{ content:"✕"; color:#c0392b; font-weight:800; }

/* ===== Founders ===== */
.founder-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:26px; }
.founder-card{ background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:26px; display:flex; gap:18px; }
.founder-photo{ width:64px; height:64px; border-radius:50%; object-fit:cover; flex:none; background:var(--grey); }
.founder-card h3{ font-size:17px; margin-bottom:4px; }
.founder-card .role{ font-size:12.5px; color: var(--orange); font-weight:700; text-transform:uppercase; letter-spacing:.04em; margin-bottom:8px; }
.founder-card p{ font-size:14px; color: var(--muted); }

/* ===== CTA photo band (full-bleed, hero-style close) ===== */
.cta-photo{
  position:relative; padding: 120px 0; text-align:center; color:#fff; overflow:hidden;
}
.cta-photo::before{
  content:""; position:absolute; left:0; right:0; top:-18%; height:136%; z-index:-2;
  background: var(--section-bg, none) center/cover no-repeat;
  transform: translateY(var(--parallax, 0px));
  will-change: transform;
}
.cta-photo::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(120deg, rgba(20,38,64,.92), rgba(24,44,72,.85));
}
.cta-photo .container{ position:relative; z-index:1; max-width:760px; }
.cta-photo h2{ color:#fff; margin-bottom:18px; }
.cta-photo p{ color: rgba(255,255,255,.78); max-width:520px; margin: 0 auto 34px; font-size:17px; }
.cta-photo .btn-row{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ===== Footer ===== */
.site-footer{ background: var(--graphite); color: rgba(255,255,255,.8); padding: 80px 0 30px; }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 56px; }
.footer-brand img{ height:50px; margin-bottom:18px; }
.footer-brand p{ font-size:14px; color: rgba(255,255,255,.55); max-width: 280px; }
.footer-col h4{ color:#fff; font-family: var(--font-body); font-size:13px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:18px; }
.footer-col ul{ display:flex; flex-direction:column; gap:12px; }
.footer-col a{ font-size:14.5px; color: rgba(255,255,255,.65); }
.footer-col a:hover{ color: var(--orange); }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:13px; color: rgba(255,255,255,.45); }

/* ===== Reveal-on-scroll ===== */
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ===== Feature strip (Avada Business style) ===== */
.feature-strip-wrap{ padding: 0 0 20px; margin-top: -46px; position:relative; z-index:5; }
.feature-strip{
  display:grid; grid-template-columns: repeat(4,1fr); gap:4px;
  background:#fff; border-radius: 20px; box-shadow: 0 30px 60px -24px rgba(36,69,112,.28); padding: 10px;
  border: 1px solid var(--line);
}
.feature-card{ padding: 30px 24px; border-radius: 14px; text-align:center; transition: background .2s ease, transform .2s ease; }
.feature-card:hover{ background: var(--grey); transform: translateY(-4px); }
.feature-card .f-icon{
  width:50px; height:50px; border-radius:50%;
  background: linear-gradient(135deg, rgba(36,69,112,.1), rgba(232,91,37,.14)); color: var(--orange);
  display:flex; align-items:center; justify-content:center; margin: 0 auto 16px;
  box-shadow: inset 0 0 0 1px rgba(36,69,112,.08);
}
.feature-card .f-icon svg{ width:22px; height:22px; }
.feature-card h4{ font-family: var(--font-head); color: var(--ink); font-size:15.5px; margin-bottom:8px; }
.feature-card p{ font-size:13.5px; color: var(--muted); }

/* ===== Expertise card slider ===== */
.expertise-slider{ position:relative; }
.expertise-viewport{ overflow:hidden; border-radius: 26px; }
.expertise-track{ display:flex; transition: transform .5s cubic-bezier(.65,0,.35,1); }
.expertise-card{
  flex: 0 0 100%; min-width:0; display:grid; grid-template-columns: 1fr 1fr; gap:56px; align-items:center;
  background:#fff; border:1px solid var(--line); border-radius:26px; padding: 50px;
  box-shadow: 0 30px 60px -30px rgba(36,69,112,.25);
}
.expertise-card > .col-copy, .expertise-card > .col-media{ min-width:0; }
.module-index{
  font-family: var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color: var(--orange); font-weight:700; display:block; margin-bottom:14px;
}
.expertise-card h3{ font-size: clamp(22px,2.4vw,28px); margin-bottom:14px; }
.expertise-card p{ color: var(--muted); font-size:15.5px; }
.module-link{ display:inline-flex; align-items:center; gap:8px; margin-top:18px; font-weight:700; color: var(--blue); font-size:14.5px; transition: gap .2s ease, color .2s ease; }
.module-link:hover{ color: var(--orange); gap:12px; }
.expertise-card .col-media img{ border-radius: 18px; box-shadow: var(--shadow); }

.slider-nav{ display:flex; align-items:center; justify-content:center; gap:24px; margin-top: 34px; }
.slider-btn{
  width:48px; height:48px; border-radius:50%; border:1.5px solid var(--line); background:#fff;
  color: var(--blue); display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.slider-btn svg{ width:20px; height:20px; }
.slider-btn:hover{ background: var(--blue); border-color: var(--blue); color:#fff; transform: translateY(-2px); }
.slider-dots{ display:flex; gap:10px; }
.slider-dots .dot{
  width:10px; height:10px; border-radius:50%; background: var(--line); border:none; cursor:pointer;
  padding:0; transition: background .2s ease, transform .2s ease;
}
.slider-dots .dot.active{ background: var(--orange); transform: scale(1.2); }
.media-chip{
  position:absolute; bottom:-20px; right:-20px; z-index:2; background:#fff; border-radius:16px;
  padding: 14px 20px; box-shadow: 0 20px 40px -16px rgba(36,69,112,.4); text-align:left;
  border: 1px solid var(--line);
}
.media-chip .chip-num{ font-family: var(--font-mono); font-weight:700; font-size:22px; color: var(--orange); }
.media-chip .chip-lbl{ font-size:11.5px; color: var(--muted); font-weight:600; }
@media (max-width: 620px){ .media-chip{ right:8px; bottom:-16px; padding:10px 14px; } .media-chip .chip-num{ font-size:18px; }

.col-media::before {width:110%}}

/* ===== Tabs ===== */
.tabs{ max-width: 880px; margin: 0 auto; }
.tab-nav{ display:flex; justify-content:center; gap:10px; margin-bottom: 34px; flex-wrap:wrap; }
.tab-btn{
  font-family: var(--font-body); font-weight:700; font-size:14.5px; padding: 12px 24px;
  border-radius:999px; border:1px solid var(--line); background:#fff; color: var(--muted); cursor:pointer;
  transition: all .2s ease;
}
.tab-btn.active{ background: var(--blue); color:#fff; border-color: var(--blue); }
.tab-panel{ display:none; text-align:center; }
.tab-panel.active{ display:block; animation: fadeIn .3s ease; }
.tab-panel h3{ font-size: clamp(22px,2.6vw,30px); margin-bottom:14px; }
.tab-panel p{ color: var(--muted); font-size:16px; max-width:660px; margin:0 auto; }
@keyframes fadeIn{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none; } }

/* ===== Trust badges strip ===== */
.trust-strip{
  display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin: -18px auto 48px;
}
.trust-badge{
  font-size:13px; font-weight:700; color: var(--blue); background: var(--grey);
  border: 1px solid var(--line); border-radius:999px; padding: 9px 18px;
  display:inline-flex; align-items:center; gap:8px;
}
.trust-badge::before{ content:""; width:6px; height:6px; border-radius:50%; background:#1f9d63; display:inline-block; }

/* ===== Inline CTA banner (repeated conversion point) ===== */
.cta-inline{
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  margin-top: 48px; padding: 32px 36px; border-radius: 20px;
  background: linear-gradient(120deg, var(--grey), #fff);
  border: 1px solid var(--line);
}
.cta-inline h3{ font-size:19px; margin-bottom:6px; color: var(--ink); }
.cta-inline p{ color: var(--muted); font-size:14.5px; }
.bg-grey .cta-inline{ background: linear-gradient(120deg, #fff, var(--grey)); }

/* ===== Contact form ===== */
.contact-wrap{ max-width: 720px; margin: 0 auto; }
.contact-form{
  background:#fff; border:1px solid var(--line); border-radius: 22px; padding: 44px;
  box-shadow: 0 30px 60px -30px rgba(36,69,112,.25);
}
.form-row{ display:grid; grid-template-columns: 1fr 1fr; gap:20px; }
.form-row > .form-field{ min-width:0; }
.form-field{ margin-bottom:20px; }
.form-field label{
  display:block; font-size:13px; font-weight:700; color: var(--ink); margin-bottom:8px;
}
.form-field input, .form-field select, .form-field textarea{
  width:100%; border:1px solid var(--line); border-radius:10px; padding:13px 16px;
  font-family: var(--font-body); font-size:14.5px; color: var(--ink); background: var(--grey);
  transition: border-color .2s ease, background .2s ease;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{
  outline:none; border-color: var(--blue); background:#fff;
}
.form-field textarea{ resize: vertical; min-height:100px; }
.form-footer{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:6px; }
.form-note{ font-size:13.5px; color: var(--muted); }
.form-note a{ color: var(--blue); font-weight:700; }
.form-status{ margin-top:16px; font-size:14px; font-weight:600; }
.form-status.success{ color:#1f9d63; }
.form-status.error{ color:#c0392b; }

/* ===== Skill / analytics bars ===== */
.skill-bars{ display:flex; flex-direction:column; gap:20px; }
.skill-row{ display:flex; justify-content:space-between; font-size:14px; font-weight:700; color: var(--ink); margin-bottom:8px; }
.skill-track{ height:9px; border-radius:999px; background: #dfe6ee; overflow:hidden; }
.skill-fill{ height:100%; border-radius:999px; background: linear-gradient(90deg, var(--blue), var(--orange)); }

/* ===== Dark capability cards ===== */
.bg-graphite .icard.dark{ background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.1); }
.bg-graphite .icard.dark h3{ color:#fff; }
.bg-graphite .icard.dark p{ color: rgba(255,255,255,.6); }
.bg-graphite .icard.dark:hover{ border-color: var(--orange); }
.icon-box.dark{ background: rgba(255,255,255,.08); color: var(--orange); }
.capability-list{
  display:grid; grid-template-columns: repeat(2,1fr); gap: 14px 40px; max-width: 760px; margin: 0 auto;
}
.capability-list li{ font-size:15px; color: rgba(255,255,255,.82); display:flex; gap:10px; align-items:flex-start; }
.capability-list li::before{ content:"→"; color: var(--orange); font-weight:800; }

/* ===== Insights / resources cards ===== */
.insight-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:26px; }
.insight-card{ background:#fff; border:1px solid var(--line); border-radius: var(--radius); overflow:hidden; transition: transform .25s ease, box-shadow .25s ease; }
.insight-card:hover{ transform: translateY(-8px); box-shadow: 0 26px 48px -20px rgba(36,69,112,.4); }
.insight-media{ height:180px; overflow:hidden; position:relative; }
.insight-media img{ width:100%; height:100%; object-fit:cover; transition: transform .4s ease; }
.insight-card:hover .insight-media img{ transform: scale(1.06); }
.insight-media::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, transparent 60%, rgba(36,69,112,.35)); }
.insight-card .insight-tag{
  display:inline-block; margin: 20px 24px 0; font-family: var(--font-mono); font-size:11px; text-transform:uppercase;
  letter-spacing:.05em; color: var(--orange); font-weight:700;
}
.insight-card h3{ font-size:18px; margin: 10px 24px 8px; }
.insight-card p{ font-size:14px; color: var(--muted); margin: 0 24px 6px; }
.insight-card .module-link{ margin: 0 24px 22px; display:block; }

/* ===== Team grid ===== */
.team-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:26px; }
.team-card{ background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:34px 30px; text-align:center; transition: transform .25s ease, box-shadow .25s ease; }
.team-card:hover{ transform: translateY(-6px); box-shadow: var(--shadow); }
.team-photo{
  width:88px; height:88px; border-radius:50%; margin: 0 auto 18px;
  background: linear-gradient(135deg, var(--blue), var(--blue-dark)); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family: var(--font-head); font-weight:700; font-size:23px;
  box-shadow: 0 14px 28px -10px rgba(36,69,112,.5);
}
.team-card h3{ font-size:18px; margin-bottom:4px; }
.team-card .role{ font-size:12.5px; color: var(--orange); font-weight:700; text-transform:uppercase; letter-spacing:.04em; margin-bottom:12px; }
.team-card p{ font-size:14px; color: var(--muted); margin-bottom:16px; }
.team-social{ display:flex; justify-content:center; gap:10px; }
.team-social a{
  width:32px; height:32px; border-radius:50%; background: var(--grey); color: var(--blue);
  display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700;
}
.team-social a:hover{ background: var(--blue); color:#fff; }

/* ===== Big statement CTA ===== */
.statement{ font-size: clamp(34px, 5.4vw, 58px); line-height:1.12; margin-bottom:22px; }

/* ===== Newsletter ===== */
.newsletter{ background: var(--grey); padding: 54px 0; }
.newsletter-inner{ display:flex; justify-content:space-between; align-items:center; gap:30px; flex-wrap:wrap; }
.newsletter-inner h3{ font-size:22px; margin-bottom:6px; }
.newsletter-inner p{ color: var(--muted); font-size:14.5px; max-width:420px; }
.newsletter-form{ display:flex; gap:12px; flex-wrap:wrap; }
.newsletter-form input{
  border:1px solid var(--line); border-radius:999px; padding:14px 20px; font-family: var(--font-body);
  font-size:14.5px; min-width:260px; background:#fff;
}
.newsletter-form input:focus{ outline:2px solid var(--blue); }

/* ===== Responsive ===== */
@media (max-width: 980px){
  .hero .container{ grid-template-columns: 1fr; }
  .split{ grid-template-columns: 1fr; }
  .split.reverse .col-media{ order:0; }
  .card-grid{ grid-template-columns: repeat(2,1fr); }
  .stat-grid{ grid-template-columns: repeat(2,1fr); gap:28px 20px; }
  .stat-grid .stat{ border-left:none; padding-left:0; }
  .footer-grid{ grid-template-columns: 1fr 1fr; }
  .value-grid, .commit-grid, .founder-grid{ grid-template-columns:1fr; }
  .feature-strip{ grid-template-columns: repeat(2,1fr); }
  .feature-strip-wrap{ margin-top:-30px; }
  .hero-card-grid{ grid-template-columns:1fr; gap:26px; }
  .hero-card{ padding:34px; }
  .expertise-card{ grid-template-columns:1fr; gap:26px; padding:32px; }
  .insight-grid{ grid-template-columns: 1fr 1fr; }
  .team-grid{ grid-template-columns:1fr; }
  .capability-list{ grid-template-columns:1fr; }
}
@media (max-width: 400px){
  .spec-row{ grid-template-columns: 110px 1fr; column-gap:12px; padding:14px 16px; }
}
@media (max-width: 720px){
  .main-nav{
    display:none; position:absolute; top:78px; left:0; right:0;
    background:#fff; border-bottom:1px solid var(--line); padding: 20px 24px;
  }
  .main-nav.open{ display:block; }
  .main-nav ul{ flex-direction:column; gap:16px; }
  .nav-toggle{ display:block; }
  .header-phone{ display:none; }
  .card-grid{ grid-template-columns: 1fr; }
  .tl-item{ grid-template-columns:1fr; gap:8px; }
  .cta-photo{ padding: 80px 0; }
  .footer-grid{ grid-template-columns:1fr; }
  .feature-strip{ grid-template-columns: 1fr; }
  .insight-grid{ grid-template-columns: 1fr; }
  .tab-nav{ gap:8px; }
  .tab-btn{ padding:10px 18px; font-size:13.5px; }
  .newsletter-inner{ flex-direction:column; align-items:flex-start; }
  .newsletter-form{ width:100%; }
  .newsletter-form input{ flex:1; min-width:0; }
  .form-row{ grid-template-columns:1fr; }
  .contact-form{ padding:28px; }
  .cta-inline{ padding:26px; flex-direction:column; align-items:flex-start; }
  .cta-inline .btn{ width:100%; justify-content:center; }
}

/* ===== WordPress additions ===== */
.admin-bar .site-header{ top:32px; }
@media (max-width: 782px){ .admin-bar .site-header{ top:46px; } }
@media (max-width: 600px){ .admin-bar .site-header{ position:absolute; } .admin-bar .site-header.scrolled{ position:fixed; top:0; } }

/* Enfold leftovers printed outside its own templates */
#scroll-top-link, .avia_hidden_link_text{ display:none !important; }
.main-nav li{ list-style:none; }

/* Case study: paragraphs come from the editor */
.cs-copy p{ color: var(--muted); font-size:15.5px; margin-top:12px; }
.cs-copy h3 + p{ margin-top:0; }
.cs-copy p.cs-highlight{ margin-top:20px; font-weight:700; color: var(--blue); }

.team-photo{ overflow:hidden; }
.team-photo img{ width:100%; height:100%; object-fit:cover; }

/* Spam trap, hidden from people */
.iw-hp{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }

.form-field input:invalid:focus{ border-color:#c0392b; }

.screen-reader-text{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); }
@media (max-width: 720px){ .main-nav a{ color: var(--ink); } }

/* ===== Contact Form 7 (Homepage → Contact form → shortcode) ===== */
.contact-form .wpcf7-form-control-wrap{ display:block; }
.contact-form .wpcf7 form > p{ margin:0 0 20px; }
/* Plain CF7 forms (fields wrapped in <label>) get the same look as the layout template */
.contact-form .wpcf7 label{ display:block; font-size:13px; font-weight:700; color: var(--ink); }
.contact-form .wpcf7 label br{ display:none; }
.contact-form .wpcf7 label .wpcf7-form-control-wrap{ margin-top:8px; }
.contact-form .wpcf7 input[type="text"], .contact-form .wpcf7 input[type="email"], .contact-form .wpcf7 input[type="tel"],
.contact-form .wpcf7 select, .contact-form .wpcf7 textarea{
  width:100%; border:1px solid var(--line); border-radius:10px; padding:13px 16px;
  font-family: var(--font-body); font-size:14.5px; font-weight:400; color: var(--ink); background: var(--grey);
  transition: border-color .2s ease, background .2s ease;
}
.contact-form .wpcf7 input:focus, .contact-form .wpcf7 select:focus, .contact-form .wpcf7 textarea:focus{ outline:none; border-color: var(--blue); background:#fff; }
.contact-form .wpcf7 textarea{ resize:vertical; min-height:100px; height:120px; }
.contact-form .wpcf7-submit:not(.btn){
  display:inline-flex; align-items:center; font-weight:700; font-size:15px; padding:16px 30px; border-radius:999px; cursor:pointer; color:#fff;
  background: linear-gradient(135deg, var(--orange), var(--orange-dark)); box-shadow: 0 14px 30px -10px rgba(232,91,37,.6);
}
.contact-form .wpcf7-submit{ border:none; font-family: var(--font-body); }
.contact-form .wpcf7-submit:disabled{ opacity:.6; cursor:wait; }
.contact-form .wpcf7-spinner{ margin:0; }
.contact-form .wpcf7-not-valid{ border-color:#c0392b !important; background:#fff !important; }
.contact-form .wpcf7-not-valid-tip{ color:#c0392b; font-size:12.5px; font-weight:600; margin-top:6px; display:block; }
.contact-form .wpcf7-list-item{ margin:0 16px 0 0; }
.contact-form .wpcf7 form .wpcf7-response-output{
  margin:18px 0 0; padding:12px 16px; border-radius:10px; border:1px solid; font-size:14px; font-weight:600;
}
.contact-form .wpcf7 form.sent .wpcf7-response-output{ border-color:#cfe9d7; background:#eaf6ee; color:#1f9d63; }
.contact-form .wpcf7 form.invalid .wpcf7-response-output,
.contact-form .wpcf7 form.unaccepted .wpcf7-response-output,
.contact-form .wpcf7 form.payment-required .wpcf7-response-output,
.contact-form .wpcf7 form.failed .wpcf7-response-output,
.contact-form .wpcf7 form.aborted .wpcf7-response-output,
.contact-form .wpcf7 form.spam .wpcf7-response-output{ border-color:#f3d0cb; background:#fdeceb; color:#c0392b; }