/*
Theme Name: Ideovee
Theme URI: https://www.ideovee.com
Author: Rapid Alpha for Ideovee Business Solutions LLC
Description: Bespoke WordPress theme for Ideovee Business Solutions. Built to the approved Phase 3 visual design.
Version: 1.11.0
Requires at least: 6.4
Requires PHP: 8.0
License: Proprietary
Text Domain: ideovee
*/

/* ==========================================================================
   1 · Design tokens — taken from the Phase 3 style guide
   ========================================================================== */
:root{
  /* Ink */
  --ink-900:#0E293A;
  --ink-700:#295470;
  --ink-500:#5B7586;
  --ink-400:#8BA2B1;
  --ink-on-dark:#A7BECD;

  /* Brand */
  --brand-blue:#13557F;
  --action:#12809D;
  --action-hover:#0F6D86;
  --accent-cyan:#1AB8E2;
  --accent-green:#7DC882;

  /* Surface */
  --surface-0:#FFFFFF;
  --surface-50:#F3F7F9;
  --surface-dark:#0E293A;
  --surface-dark-card:#103851;
  --line-200:#DFE7EC;
  --line-dark:#1D4A66;

  /* Type */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  /* Layout */
  --container:1248px;
  --gutter:96px;   /* section horizontal padding in the frames */
  --section-y:104px;
  --hero-y:120px;
  --radius:10px;
  --radius-sm:6px;
}

/* ==========================================================================
   2 · Reset
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--font);
  font-size:16px;
  line-height:1.6;
  color:var(--ink-700);
  background:var(--surface-0);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--action);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0;color:var(--ink-900);font-weight:600;letter-spacing:-0.01em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
blockquote,figure{margin:0}
button{font-family:inherit}

/* ==========================================================================
   3 · Layout primitives
   ========================================================================== */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0}
@media (max-width:1440px){.container{padding:0 24px}}
.section{padding:var(--section-y) 0}
.section--tint{background:var(--surface-50)}
.section--dark{background:var(--surface-dark)}
.section--dark h2,.section--dark h3{color:#fff}
.section--dark p{color:var(--ink-on-dark)}
.stack>*+*{margin-top:var(--stack,20px)}

/* ==========================================================================
   4 · Type scale — matches the Figma frames exactly
   ========================================================================== */
.eyebrow{
  font-size:12px;font-weight:600;letter-spacing:.10em;text-transform:uppercase;
  line-height:1.35;color:var(--accent-cyan);margin-bottom:18px;
}
.section--dark .eyebrow,.page-intro .eyebrow,.card--dark .eyebrow,.hero .eyebrow{color:var(--accent-cyan)}
.eyebrow--green,.section--dark .eyebrow--green{color:var(--accent-green)}
.eyebrow--green{color:var(--accent-green)}
.display{font-size:42px;line-height:1.10;font-weight:600;color:var(--ink-900)}
.h2{font-size:34px;line-height:1.20;font-weight:600;color:var(--ink-900)}
.h2--cta{font-size:46px}
.h3{font-size:21px;line-height:1.30;font-weight:600;color:var(--ink-900)}
.lede{font-size:18px;line-height:1.65;color:var(--ink-500);font-weight:400}
.lede--lg{font-size:22px;line-height:1.55;color:var(--ink-700);max-width:900px}
.body{font-size:15.5px;line-height:1.62;color:var(--ink-500)}
.body--lg{font-size:17px;line-height:1.72;color:var(--ink-700)}
.body--sm{font-size:14.5px;line-height:1.60}
.meta{font-size:13.5px;line-height:1.35;color:var(--ink-500)}

/* ==========================================================================
   5 · Buttons
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:600;line-height:1.2;
  padding:16px 26px;border-radius:var(--radius-sm);
  border:1.5px solid transparent;cursor:pointer;text-decoration:none;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease;
}
.btn:hover{text-decoration:none}
.btn--primary{background:var(--action);color:#fff}
.btn--primary:hover{background:var(--action-hover);color:#fff}
.btn--secondary{background:transparent;color:var(--ink-900);border-color:var(--ink-700)}
.btn--secondary:hover{border-color:var(--ink-900)}
.btn--on-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.28)}
.btn--on-dark:hover{border-color:rgba(255,255,255,.6);color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:0}
.hero__copy{display:flex;flex-direction:column;gap:22px}

/* ==========================================================================
   6 · Cards
   ========================================================================== */
.card{
  background:var(--surface-0);border:1px solid var(--line-200);
  border-radius:var(--radius);padding:26px;
}
.card--tint{background:var(--surface-50);border-color:transparent}
.card--dark{background:var(--surface-dark-card);border-color:var(--ink-700)}
.card--dark .h3{color:#fff}
.card--dark .body{color:var(--ink-on-dark)}
.grid{display:grid;gap:20px}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}

/* Chips */
.chip{
  display:inline-flex;align-items:center;padding:11px 18px;border-radius:100px;
  background:var(--surface-50);border:1px solid var(--line-200);
  color:var(--ink-700);font-size:14.5px;font-weight:500;line-height:1.3;
}
.chip-row{display:flex;flex-wrap:wrap;gap:10px}

/* ==========================================================================
   7 · Header
   ========================================================================== */
.site-header{background:var(--surface-0);border-bottom:1px solid var(--line-200);position:sticky;top:0;z-index:50}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:26px;height:97px;max-width:1440px;margin:0 auto;padding:0 96px}
.site-brand{display:flex;align-items:center;flex:0 0 auto}
.site-brand img{height:37px;width:auto}
.site-brand__text{font-size:23px;font-weight:600;color:var(--ink-900);letter-spacing:-.01em}
.primary-nav{display:flex;align-items:center;gap:26px;margin-left:auto}
.primary-nav a{font-size:15px;font-weight:500;line-height:1.3;color:var(--ink-700);text-decoration:none}
.primary-nav a:hover{color:var(--ink-900)}
.primary-nav .current-menu-item>a{color:var(--ink-900);font-weight:600}
.site-header .btn{padding:15px 26px;flex:0 0 auto}
.nav-toggle{display:none;background:none;border:1px solid var(--line-200);border-radius:var(--radius-sm);padding:9px 11px;cursor:pointer}
.nav-toggle span{display:block;width:18px;height:2px;background:var(--ink-900);border-radius:2px}
.nav-toggle span+span{margin-top:4px}

/* Mobile nav is hidden at every width by default; the media query below
   reveals it only when the toggle is open, and the toggle only exists
   under 782px. Without this base rule it renders as a block on desktop. */
.mobile-nav{display:none}
.mobile-nav__list{list-style:none;margin:0;padding:0}

/* ==========================================================================
   8 · Hero
   ========================================================================== */
.hero{padding:var(--hero-y) 0;background:var(--surface-0)}
/* Fluid, not fixed. The old rule was 652px + 48px gap + 548px = 1248px, which is
   exactly --container — so on any viewport under 1440px the container's 24px side
   padding made the available width smaller than the grid, and the hero overflowed
   the screen between 1101px and 1295px. The ratio below (1.19:1) keeps the original
   652:548 proportion while allowing it to shrink. */
.hero__grid{display:grid;grid-template-columns:minmax(0,1.19fr) minmax(0,1fr);gap:48px;align-items:center}
.hero .display{margin-bottom:0;white-space:pre-line}
.hero .lede{max-width:56ch}
.hero__media{border-radius:10px;overflow:hidden;background:var(--surface-50);width:100%;max-width:548px;aspect-ratio:548/560}
.hero__media img{width:100%;height:100%;object-fit:cover}

/* ==========================================================================
   9 · Steps — BetterProspecting sequence
   ========================================================================== */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
.step{background:var(--surface-dark-card);border-radius:var(--radius);padding:24px}
.step__num{font-size:15px;font-weight:700;line-height:1.2;color:var(--accent-cyan);margin-bottom:10px}
.step__name{font-size:15px;font-weight:600;line-height:1.3;color:#fff;margin-bottom:6px}
.step__desc{font-size:12.5px;line-height:1.5;color:var(--ink-on-dark)}

/* ==========================================================================
   10 · Testimonials
   ========================================================================== */
.testimonial{background:var(--surface-0);border:1px solid var(--line-200);border-radius:var(--radius);padding:30px;display:flex;flex-direction:column;gap:16px}
.testimonial__rule{width:34px;height:3px;border-radius:2px;background:var(--accent-cyan);flex:0 0 auto}
.testimonial__quote{font-size:16.5px;line-height:1.62;color:var(--ink-700);margin:0}
.testimonial__name{font-size:15px;font-weight:600;line-height:1.3;color:var(--ink-900)}
.testimonial__role{font-size:13.5px;line-height:1.35;color:var(--ink-500);margin-top:2px}

/* ==========================================================================
   11 · Footer
   ========================================================================== */
.site-footer{background:var(--surface-dark);color:var(--ink-on-dark);padding:72px 0 40px}
.site-footer__inner{max-width:1440px;margin:0 auto;padding:0 96px}
.site-footer__grid{display:grid;grid-template-columns:360px 1fr 1fr 1fr;gap:40px}
.site-footer__tagline{font-size:14.5px;line-height:1.6;color:var(--ink-on-dark);margin-top:0;max-width:360px}
.footer-col__title{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-cyan);margin-bottom:14px}
.site-footer a{color:var(--ink-on-dark);font-size:14.5px;line-height:1.6;text-decoration:none;display:block;padding:3px 0}
.site-footer a:hover{color:#fff;text-decoration:none}
.site-footer__legal{border-top:1px solid var(--line-dark);margin-top:44px;padding-top:24px;font-size:12.5px;color:var(--ink-400)}
.site-footer__legal a{display:inline;color:var(--ink-on-dark)}
.site-footer__brand img{height:30px}

/* ==========================================================================
   12 · Accessibility
   ========================================================================== */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:16px;top:16px;z-index:100;background:#fff;padding:12px 18px;border-radius:var(--radius-sm)}
a:focus-visible,button:focus-visible{outline:2px solid var(--action);outline-offset:2px}

/* ==========================================================================
   13 · Responsive — 390px reference frame
   ========================================================================== */
@media (max-width:1100px){
  .site-header__inner,.site-footer__inner{padding:0 40px}
  .hero__grid{grid-template-columns:1fr;gap:40px}
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .site-footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:782px){
  :root{--section-y:64px;--hero-y:56px}
  .site-header__inner{padding:0 20px;height:72px}
  .primary-nav{display:none}
  .site-header .btn{display:none}
  .nav-toggle{display:block}
  .mobile-nav{border-top:1px solid var(--line-200);padding:16px 20px 24px;background:#fff}
  .site-header__inner.is-open + .mobile-nav{display:block}
  /* :not(.btn) matters. This rule is specificity 0,1,1 and .btn--primary is 0,1,0,
     so without the exclusion it repainted the "Talk With Us" button's white text
     dark — only in the mobile menu, which is why desktop looked correct. */
  .mobile-nav a:not(.btn){display:block;padding:12px 0;font-size:16px;color:var(--ink-700);border-bottom:1px solid var(--line-200)}
  .mobile-nav .btn{display:inline-flex;margin-top:18px;width:100%}
  .mobile-nav .btn--primary,.mobile-nav .btn--primary:hover{color:#fff}
  .mobile-nav .btn--secondary{color:var(--ink-900)}
  .display{font-size:34px}
  .h2,.h2--cta{font-size:25px}
  .h3{font-size:19px}
  .lede,.lede--lg{font-size:16px}
  .grid--2,.grid--3,.grid--4,.steps{grid-template-columns:1fr}
  .site-footer{padding:48px 0 32px}
  .site-footer__inner{padding:0 20px}
  .site-footer__grid{grid-template-columns:1fr;gap:28px}
  .btn-row{flex-direction:column;align-items:stretch}
  .btn{width:100%}
}

/* ==========================================================================
   14 · Interior page patterns
   ========================================================================== */
.page-intro{background:var(--surface-dark);padding:88px 0 76px}
.page-intro .h1{font-size:44px;line-height:1.15;font-weight:600;color:#fff;max-width:22ch;letter-spacing:-0.01em}
.page-intro .lede{color:var(--ink-on-dark);margin-top:20px;max-width:64ch}
.rung-num{font-size:12px;font-weight:600;letter-spacing:.1em;color:var(--accent-cyan);margin-bottom:12px}
.media-slot{background:var(--surface-50);border-radius:var(--radius);aspect-ratio:16/9;overflow:hidden;margin-top:40px}
.media-slot img{width:100%;height:100%;object-fit:cover}
/* Documents and diagrams must be shown whole. A 16/9 crop with object-fit:cover
   removes the top and bottom of a page-shaped image, which is where the title and
   the conclusion usually live. --doc drops the fixed ratio and lets the image set
   its own height. White ground, because these artwork files are white-backed. */
.media-slot--doc{aspect-ratio:auto;background:#fff;padding:10px}
.media-slot--doc img{height:auto;object-fit:contain;display:block;border-radius:calc(var(--radius) - 6px)}
.person{text-align:left}
.person__photo{width:150px;height:150px;border-radius:50%;background:var(--surface-50);overflow:hidden;margin-bottom:14px}
/* No headshot supplied yet: an empty grey circle reads as a broken image, so the
   slot collapses instead and the bio sits on its own. Drop betty.jpg, murray.jpg
   or simran.jpg into assets/img/ and the circle returns by itself. */
.person__photo:empty{display:none}
.person__photo img{width:100%;height:100%;object-fit:cover}
.person__name{font-size:18px;font-weight:600;color:var(--ink-900)}
.person__role{font-size:14.5px;color:var(--action);margin-top:2px}
.person__bio{font-size:13.5px;line-height:1.55;color:var(--ink-500);margin-top:12px}
.article-card__media{aspect-ratio:16/9;background:var(--surface-50);border-radius:var(--radius);overflow:hidden;margin-bottom:14px}
.article-card__media img{width:100%;height:100%;object-fit:cover}
.article-card__meta{font-size:13px;color:var(--ink-500);margin-top:8px}
.prose{max-width:72ch}
.prose p{margin-bottom:18px;font-size:17px;line-height:1.65;color:var(--ink-700)}
.prose h2{font-size:28px;margin:36px 0 14px}
.form-field{margin-bottom:16px}
/* Contact Form 7 emits its own markup. Rather than restyle the site to suit the
   plugin, these rules map CF7's classes onto the fields the design already uses,
   so the form looks identical to the one it replaced. */
.wpcf7-form p{margin:0 0 16px}
.wpcf7-form label{display:block;font-size:14px;font-weight:500;color:var(--ink-700);margin-bottom:6px}
.wpcf7-form input[type=text],.wpcf7-form input[type=email],.wpcf7-form select,.wpcf7-form textarea{
  width:100%;font:inherit;font-size:16px;padding:13px 14px;border:1px solid var(--line-200);
  border-radius:var(--radius-sm);background:#fff;color:var(--ink-900)}
.wpcf7-form input:focus,.wpcf7-form select:focus,.wpcf7-form textarea:focus{
  outline:none;border-color:var(--action);box-shadow:0 0 0 2px rgba(18,128,157,.15)}
.wpcf7-form .consent{display:flex;gap:10px;align-items:flex-start;margin-bottom:14px;font-size:14px;line-height:1.5;color:var(--ink-500)}
.wpcf7-form .wpcf7-list-item{margin:0}
.wpcf7-form .wpcf7-submit{font:inherit;font-size:16px;font-weight:600;padding:14px 26px;border:0;
  border-radius:var(--radius-sm);background:var(--action);color:#fff;cursor:pointer}
.wpcf7-form .wpcf7-submit:hover{opacity:.92}
.wpcf7 form .wpcf7-response-output{margin:14px 0 0;padding:12px 14px;border-radius:var(--radius-sm);font-size:14px}
.form-notice{background:var(--surface-50);border:1px solid var(--line-200);border-radius:var(--radius);padding:20px}
.form-notice p{font-size:15px;line-height:1.6;color:var(--ink-700);margin-bottom:10px}
.form-notice p:last-child{margin-bottom:0}
.form-field label{display:block;font-size:14px;font-weight:500;color:var(--ink-700);margin-bottom:6px}
.form-field input,.form-field select,.form-field textarea{width:100%;font:inherit;font-size:16px;padding:13px 14px;border:1px solid var(--line-200);border-radius:var(--radius-sm);background:#fff;color:var(--ink-900)}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:none;border-color:var(--action);box-shadow:0 0 0 2px rgba(18,128,157,.15)}
.consent{display:flex;gap:10px;align-items:flex-start;margin-bottom:14px;font-size:14px;line-height:1.5;color:var(--ink-500)}
.consent input{margin-top:3px;flex:0 0 auto}
@media (max-width:782px){
  .page-intro{padding:56px 0 48px}
  .page-intro .h1{font-size:30px}
  .prose h2{font-size:22px}
}

/* ==========================================================================
   15 · Video cards and feature
   ========================================================================== */
.video-card{display:block;text-decoration:none}
.video-card:hover{text-decoration:none}
.video-card__media{display:block;aspect-ratio:16/9;background:var(--surface-dark);border-radius:var(--radius);overflow:hidden;position:relative}
.video-card__media img{width:100%;height:100%;object-fit:cover}
.video-card__media::after{content:"";position:absolute;inset:0;background:rgba(14,41,58,.16);transition:background .15s ease}
.video-card:hover .video-card__media::after{background:rgba(14,41,58,.04)}
.video-card__title{display:block;margin-top:12px;font-size:16px;font-weight:600;color:var(--ink-900);line-height:1.35}
.video-feature{background:var(--surface-0);border:1px solid var(--line-200);border-radius:var(--radius);padding:22px;margin-top:20px}
/* Step videos. One tile per step, four across — matching the Primers row above
   so the page keeps a single rhythm rather than three different card sizes.
   Quarter-width rather than half means the four steps read as one row and the
   featured Empathy Engine piece below stays the visual anchor. Viewers who
   want to watch properly use fullscreen. */
/* Safety net. A video element renders at its intrinsic size by default, so a
   1280x720 file will push a 1248px container 672px wide and give the whole
   page a horizontal scrollbar. This costs nothing and prevents it for good. */
img,video{max-width:100%}
.step-videos{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px}
.step-video{background:var(--surface-0);border:1px solid var(--line-200);border-radius:var(--radius);padding:12px}
.step-video__player{aspect-ratio:16/9;background:var(--surface-dark);border-radius:var(--radius-sm);overflow:hidden;display:flex;align-items:center;justify-content:center}
.step-video__player video{width:100%;height:100%;object-fit:cover}
.step-video__missing{color:var(--ink-on-dark);font-size:11.5px;text-align:center;padding:0 18px;line-height:1.5}
.step-video__eyebrow{font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--accent-cyan);margin-top:14px}
.step-video__title{font-size:15px;font-weight:600;color:var(--ink-900);margin-top:5px;line-height:1.35}
.step-video__meta{font-size:12.5px;color:var(--ink-500);margin-top:5px}
@media (max-width:980px){ .step-videos{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .step-videos{grid-template-columns:1fr} }
.video-feature__player{aspect-ratio:16/9;background:var(--surface-dark);border-radius:var(--radius-sm);overflow:hidden;display:flex;align-items:center;justify-content:center}
.video-feature__player video{width:100%;height:100%;object-fit:cover}
.video-feature__missing{color:var(--ink-on-dark);font-size:14px;text-align:center;padding:0 24px}
.video-feature__missing code{background:rgba(255,255,255,.08);color:#fff}

/* ==========================================================================
   16 · Homepage — Figma-exact corrections
   ========================================================================== */

/* Section headings on the homepage run 44px, per the Phase 3 frames. */
.home .section .h2,.home .h2{font-size:44px;line-height:1.14}

/* Customer-problem band: measures taken from the design. */
.measure-30{max-width:none}
.measure-68{max-width:880px}

/* "What Ideovee Does" — two columns of cards, 28px padding, 10px radius. */
.need-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:40px}
.need-card{background:var(--surface-0);border:1px solid var(--line-200);border-radius:10px;padding:28px}
.need-card .eyebrow{margin-bottom:0;font-size:11px}
.need-card__title{font-size:21px;font-weight:600;color:var(--ink-900);line-height:1.3;margin-top:10px}
.need-card__body{font-size:16px;line-height:1.6;color:var(--ink-500);margin-top:10px}

/* BetterProspecting — the seven-step track, not cards.
   Circles sit on a 2px rule; numbers cyan, names white, notes muted-on-dark. */
.step-flow{position:relative;display:grid;grid-template-columns:repeat(7,1fr);gap:0;margin-top:48px}
.step-flow::before{content:"";position:absolute;top:27px;left:7.14%;right:7.14%;height:2px;background:var(--ink-700)}
.step-node{position:relative;text-align:center;padding:0 6px}
.step-node__dot{position:relative;z-index:1;width:56px;height:56px;margin:0 auto;border-radius:50%;
  background:var(--surface-dark);border:2px solid var(--accent-cyan);
  display:flex;align-items:center;justify-content:center}
.step-node__num{font-size:15px;font-weight:700;line-height:1.2;color:var(--accent-cyan)}
.step-node__name{font-size:15px;font-weight:600;line-height:1.3;color:#fff;margin-top:18px}
.step-node__desc{font-size:12.5px;line-height:1.5;color:var(--ink-on-dark);margin-top:8px}

@media (max-width:1100px){
  .step-flow{grid-template-columns:repeat(4,1fr);row-gap:34px}
  .step-flow::before{display:none}
}
@media (max-width:782px){
  .display{font-size:32px}
  .section .h2{font-size:26px}
  .need-grid{grid-template-columns:1fr}
  .step-flow{grid-template-columns:repeat(2,1fr)}
}

/* ==========================================================================
   17 · Homepage — corrections from live review
   ========================================================================== */

/* "Delivered through six services" */
.services-label{font-size:17px;font-weight:600;line-height:1.5;color:var(--ink-500);margin-top:56px}

/* Space below the seven-step track, matching the 48px above it */
.section--dark .step-flow + .btn-row{margin-top:48px}

/* Bridge the Revenue-Team Gap — 599/599 split, 36px copy stack */
.split-row{display:grid;grid-template-columns:599px 599px;gap:20px;align-items:center;justify-content:space-between}
.split-row__copy{display:flex;flex-direction:column;gap:36px}
.split-row__media{width:599px;height:600px;border-radius:10px;overflow:hidden;background:var(--surface-50)}
.split-row__media img{width:100%;height:100%;object-fit:cover}

/* Capability pills — 8px radius, green dot, 12px gap, space before the button */
.cap-row{display:flex;flex-wrap:wrap;gap:12px}
.cap{display:inline-flex;align-items:center;gap:10px;padding:18px 22px;border-radius:8px;
  background:var(--surface-50);border:1px solid var(--line-200);
  font-size:16px;font-weight:500;line-height:1.3;color:var(--ink-900)}
.cap::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent-green);flex:0 0 auto}
.cap-row + .btn-row{margin-top:36px}

/* Testimonial grid gap */
.grid--3.testimonials{gap:20px}

/* Closing CTA */
.h2--cta{max-width:30ch}
.cta-lede + .btn-row{margin-top:36px}

/* Footer logo above the tagline */
.site-footer__logo{width:83px;height:96px;margin-bottom:12px}
.site-footer__brand img{width:83px;height:auto}

@media (max-width:1440px){
  .split-row{grid-template-columns:1fr 1fr}
  .split-row__media{width:100%;height:auto;aspect-ratio:599/600}
}
@media (max-width:900px){
  .split-row{grid-template-columns:1fr;gap:32px}
}

/* Pagination on the Insights listing */
.pagination{margin-top:48px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;
  min-width:42px;height:42px;padding:0 12px;border:1px solid var(--line-200);border-radius:var(--radius-sm);
  font-size:15px;font-weight:500;color:var(--ink-700);text-decoration:none}
.pagination .page-numbers:hover{border-color:var(--ink-400);text-decoration:none}
.pagination .page-numbers.current{background:var(--action);border-color:var(--action);color:#fff}
.chip[href]{text-decoration:none}
.chip[href]:hover{border-color:var(--ink-400);text-decoration:none}