/* ============================================================
   AIPIA — design tokens
   White-first palette. Navy is the structural accent, gold the
   highlight. These same tokens are what the PWA should adopt so
   the app and the site read as one product.
   ============================================================ */
:root{
  --bg:#ffffff;
  --surface:#ffffff;
  --band:#f7f9fb;          /* soft section band */
  --band-2:#eef2f7;        /* alt section band */
  --line:#e4e9ef;
  --line-strong:#d2dae3;
  --text:#0d1117;
  --muted:#5b6470;
  --muted-2:#646f7c;
  --navy:#071325;
  --navy-2:#0b1b31;
  --gold:#c9962e;
  --gold-a:#f0cd72;
  --gold-b:#d3a13a;
  --gold-soft:#fbf2dd;
  /* The countdown and the Event Pass call to action were red; both are gold
     now, matching the supplied button artwork. Nothing uses these two. */
  --shadow:0 10px 30px rgba(13,22,38,.06), 0 1px 3px rgba(13,22,38,.05);
  --shadow-lift:0 18px 44px rgba(13,22,38,.10);
  --radius:28px;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
/* The nav is fixed, so without this every anchor in the header drops its
   target underneath the bar and the section opens on its second line. Applies
   to all of them, not just About — the others had the same problem. */
section[id]{scroll-margin-top:96px}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
:focus-visible{outline:3px solid #2f6fd0;outline-offset:2px;border-radius:6px}
.container{width:min(var(--max), calc(100% - 40px)); margin:0 auto}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:24px}
.brand img{height:34px;width:auto}
.nav-links{display:flex;align-items:center;gap:28px;font-size:15px;color:#454d59}
.nav-links a:hover{color:var(--text)}
.nav-actions{display:flex;align-items:center;gap:14px}
.mobile-toggle{display:none;border:1px solid var(--line-strong);background:#fff;border-radius:999px;padding:11px 16px;font-weight:600;cursor:pointer}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 24px;border-radius:999px;font-weight:700;line-height:1;transition:.2s ease;border:1px solid transparent;cursor:pointer}
.btn.primary{background:var(--navy);color:#fff;box-shadow:0 10px 26px rgba(7,19,37,.20)}
.btn.primary:hover{transform:translateY(-1px)}
.btn.outline{background:#fff;color:var(--text);border-color:#1f2833}
.btn.outline:hover{background:#f4f7fa}
.btn.gold{background:linear-gradient(180deg,var(--gold-a),var(--gold-b));color:#151515;border-color:transparent}

/* ---------- hero ---------- */
.hero{padding:62px 0 76px;background:var(--bg)}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:50px;align-items:center}
.eyebrow{display:inline-block;padding:10px 14px;border:1px solid var(--line-strong);border-radius:999px;background:#fff;color:#4f5a67;font-size:12px;letter-spacing:.16em;font-weight:800;text-transform:uppercase}
.hero h1{font-size:clamp(46px,6.2vw,84px);line-height:.98;letter-spacing:-.055em;margin:22px 0 22px;max-width:700px}
.hero-copy{font-size:20px;line-height:1.72;color:var(--muted);max-width:700px;margin:0 0 30px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.trust-row{display:flex;gap:10px;flex-wrap:wrap}
.trust-row span{padding:10px 14px;border:1px solid var(--line-strong);border-radius:999px;background:#fff;color:#4f5a67;font-size:14px}

/* ---------- hero product preview ---------- */
.demo-shell{background:#fff;border:1px solid var(--line-strong);border-radius:36px;padding:28px;box-shadow:var(--shadow-lift)}
.demo-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.demo-mark{height:36px;width:auto}
.scan-pill{padding:10px 16px;border:1px solid var(--line-strong);border-radius:999px;background:#fff;color:#4f5a67;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.app-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:18px}
.app-head{display:flex;justify-content:space-between;color:var(--muted-2);font-size:14px;margin-bottom:16px}
.scan-area{border:1px solid var(--line);background:var(--band);border-radius:22px;padding:18px}
.business-card{background:#0b1017;border-radius:18px;padding:22px;color:#fff;min-height:120px}
.business-card small{display:block;font-size:12px;letter-spacing:.12em;color:#c5ccd7;margin-bottom:10px}
.business-card strong{display:block;font-size:34px;margin-bottom:8px}
.business-card span{font-size:18px;color:#dce3ed}
.extracting{margin-top:12px;color:var(--muted-2);font-size:14px}
.contact-result{padding:18px 6px 4px}
.contact-row{display:flex;justify-content:space-between;align-items:center;gap:20px}
.contact-row strong{font-size:28px}
.contact-row span{font-size:14px;color:var(--muted-2)}
.contact-sub{font-size:16px;color:var(--muted-2);margin-top:6px}
.ask-box{margin-top:18px;background:var(--band-2);border-radius:18px;padding:16px 18px;color:#4c5561;line-height:1.65}
.ask-box b{display:block;color:var(--text);margin-bottom:6px}

/* ---------- sections ---------- */
.section{padding:84px 0}
.section.soft{background:var(--band);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section.alt{background:var(--band-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{text-align:center;max-width:900px;margin:0 auto 40px}
.section-head h2{font-size:clamp(34px,4.6vw,58px);line-height:1.02;letter-spacing:-.05em;margin:0 0 14px}
.section-head p{font-size:18px;color:var(--muted);line-height:1.72;margin:0}
.section-title-row{display:grid;grid-template-columns:1.06fr .94fr;gap:32px;align-items:start;margin-bottom:34px}
.section-title-row h2{font-size:clamp(34px,4.4vw,56px);line-height:1.02;letter-spacing:-.05em;margin:0}
.section-title-row p{font-size:19px;color:var(--muted);line-height:1.78;margin:0}

/* ---------- tagline slider ---------- */
.tagline-slider{background:#fff;border:1px solid var(--line-strong);border-radius:28px;padding:28px;box-shadow:var(--shadow);margin:14px 0 28px}
/* minmax(0,1fr) rather than 1fr: a grid track defaults to min-content, so on a
   narrow phone the taglines refused to shrink and pushed the right-hand arrow
   off the page — 22px of sideways scroll on the whole site. */
.slider-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center}
.slider-arrow{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);background:#fff;font-size:20px;cursor:pointer;color:#2b333d}
.slider-arrow:hover{background:var(--band)}
.slider-content{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}
.slider-primary,.slider-secondary{border:1px solid var(--line);border-radius:24px;padding:22px;background:var(--band)}
.slider-kicker{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);font-weight:800;margin-bottom:10px}
.slider-primary h3,.slider-secondary h3{font-size:28px;line-height:1.08;letter-spacing:-.035em;margin:0 0 10px}
.slider-primary p,.slider-secondary p{font-size:16px;line-height:1.7;color:var(--muted);margin:0}
.slider-dots{display:flex;justify-content:center;gap:10px;margin-top:16px}
.slider-dots button{width:10px;height:10px;border-radius:50%;border:none;background:#cbd3dc;cursor:pointer;padding:0}
.slider-dots button.active{background:var(--navy)}

/* ---------- features ---------- */
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.feature-card{background:#fff;border:1px solid var(--line-strong);border-radius:24px;padding:26px;box-shadow:var(--shadow)}
.feature-icon{display:flex;align-items:center;justify-content:flex-start;min-height:88px;margin-bottom:14px}
.feature-icon img{display:block;max-width:106px;max-height:84px;width:auto;height:auto}
.feature-card h3{font-size:24px;letter-spacing:-.03em;margin:0 0 8px}
.feature-card p{font-size:16px;line-height:1.72;color:var(--muted);margin:0}
.feature-card.wide{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;column-gap:30px;align-items:center}
.feature-card.wide .feature-icon{grid-column:1;grid-row:1/3;min-height:0;margin:0;align-self:center}
.feature-card.wide .feature-icon img{max-width:132px;max-height:96px}
.feature-card.wide h3{grid-column:2;grid-row:1;align-self:end;margin:0 0 6px}
.feature-card.wide p{grid-column:2;grid-row:2;align-self:start}

/* ---------- how it works ---------- */
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.how-step{background:#fff;border:1px solid var(--line-strong);border-radius:28px;padding:24px;box-shadow:var(--shadow);position:relative}
.step-num{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;font-size:26px;margin-bottom:24px;color:var(--navy);background:var(--band)}
.step-icon{display:flex;align-items:center;justify-content:flex-start;min-height:110px;margin-bottom:22px}
.step-icon img{display:block;max-width:170px;max-height:104px;width:auto;height:auto}
.how-step h3{font-size:28px;line-height:1.1;letter-spacing:-.04em;margin:0 0 10px}
.how-step p{font-size:17px;line-height:1.72;color:var(--muted);margin:0}

/* ---------- pricing ---------- */
.pricing-wrap{margin-top:24px}
.pricing-kicker{display:flex;justify-content:center;margin-bottom:16px}
.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch}
.price-card{background:#fff;border:1px solid var(--line-strong);border-radius:28px;padding:28px;box-shadow:var(--shadow);display:flex;flex-direction:column;position:relative;min-height:100%}
.price-icon{display:flex;align-items:center;justify-content:flex-start;min-height:92px;margin-bottom:14px}
.price-icon img{display:block;max-width:120px;max-height:82px;width:auto;height:auto}
.price-card h3{font-size:22px;line-height:1.1;letter-spacing:-.03em;margin:0 0 6px}
.price-card .plan-tag{font-size:14px;color:var(--muted-2);margin-bottom:18px}
.price{font-size:58px;line-height:1;letter-spacing:-.06em;font-weight:800;margin:0 0 6px}
.price-period{font-size:15px;font-weight:600;color:var(--muted-2);margin:0 0 18px;letter-spacing:.01em}
.price small{font-size:16px;font-weight:600;color:var(--muted-2);letter-spacing:-.01em;margin-left:6px}
/* ---- Event Pass countdown -------------------------------------------------
   Red, because this is the one element on the page with a deadline attached.
   The digits keep a white ground so the numbers stay easy to read at a glance;
   everything around them is white on red. */
.countdown{background:linear-gradient(180deg,#f7e09a 0%,var(--gold-a) 26%,var(--gold-b) 74%,#c08f2c 100%);
  border:1px solid #b8862a;border-radius:14px;padding:12px 14px;margin:0 0 18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 8px 20px rgba(176,132,40,.22)}
.countdown-label{font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--navy);margin-bottom:8px}
.countdown-units{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.cd-unit{background:#fff;border:1px solid rgba(255,255,255,.75);border-radius:9px;padding:6px 1px;
  box-shadow:0 1px 2px rgba(120,88,26,.18)}
.cd-num{display:block;font-size:21px;font-weight:800;line-height:1.05;letter-spacing:-.03em;color:var(--text);font-variant-numeric:tabular-nums}
.cd-cap{display:block;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#3a434e;margin-top:2px}
.countdown-when{font-size:12px;font-weight:700;color:var(--navy);margin-top:8px}
/* With the Event Pass gone the row is three cards, not four. */
.pricing-grid.three{grid-template-columns:repeat(3,1fr)}

.price-divider{height:1px;background:var(--line);margin:0 0 18px}
.price-list{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:12px}
.price-list li{position:relative;padding-left:28px;font-size:16px;line-height:1.55;color:#39424e}
.price-list li::before{content:'●';position:absolute;left:0;top:0;color:var(--navy);font-size:14px;line-height:1.8}
.price-btn{display:inline-flex;justify-content:center;align-items:center;padding:15px 18px;border-radius:999px;font-weight:800;font-size:18px;border:1.5px solid #1f2833;background:#fff;margin-top:auto;transition:.2s ease}
.price-btn:hover{background:var(--band-2)}
/* The Event Pass button is a supplied piece of artwork rather than a styled
   box, so it is an image inside the link. The link keeps its own accessible
   name — an image that fails to load must not leave an unlabelled button. */
.price-btn-img{display:block;margin-top:auto;line-height:0;transition:.2s ease}
.price-btn-img img{display:block;width:100%;height:auto}
.price-btn-img:hover{filter:brightness(1.05)}
.price-btn-img:active{transform:translateY(1px)}
.price-card.featured{background:radial-gradient(circle at top left, #0d203b 0%, #071325 56%, #050d18 100%);color:#fff;border-color:#1e3252;overflow:hidden;box-shadow:0 18px 44px rgba(7,19,37,.24)}
.price-card.featured .plan-tag,.price-card.featured .price small,.price-card.featured .price-period,.price-card.featured .price-list li{color:#e7ecf3}
.price-card.featured .price-divider{background:rgba(255,255,255,.18)}
.price-card.featured .price-list li::before{color:var(--gold-a)}
.price-card.featured .price-btn{background:linear-gradient(180deg,var(--gold-a),var(--gold-b));border-color:transparent;color:#151515}
.price-badge{position:absolute;top:18px;right:18px;background:linear-gradient(180deg,var(--gold-a),var(--gold-b));color:#151515;padding:10px 18px;border-radius:999px;font-size:14px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.save-pill{display:inline-flex;align-self:flex-start;padding:10px 14px;border-radius:999px;background:rgba(240,205,114,.16);color:#f3d894;font-size:15px;font-weight:700;margin:-4px 0 16px}

/* ---------- teams ---------- */
.teams-pricing{margin-top:18px;background:#fff;border:1px solid var(--line-strong);border-radius:28px;padding:26px 28px;box-shadow:var(--shadow);display:grid;grid-template-columns:1.1fr 1fr .86fr;gap:22px;align-items:center}
.teams-left{display:grid;grid-template-columns:86px 1fr;gap:20px;align-items:center}
.teams-icon{width:86px;height:86px;border-radius:24px;background:radial-gradient(circle at top left,#10233d,#081121);display:grid;place-items:center;color:var(--gold-a);font-size:34px;box-shadow:inset 0 0 0 1px rgba(232,191,102,.24)}
.teams-kicker{display:inline-block;padding:8px 12px;border-radius:999px;background:var(--band-2);color:#4f5a67;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px}
.teams-intro h3{font-size:30px;line-height:1.08;letter-spacing:-.04em;margin:0 0 8px}
.teams-price{font-size:22px;letter-spacing:-.03em;margin-bottom:10px}
.teams-intro p,.teams-cta p{font-size:17px;line-height:1.7;color:var(--muted);margin:0}
.teams-features{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}
.teams-features div{display:flex;align-items:flex-start;gap:10px;font-size:17px;color:#39424e}
.teams-features span{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:linear-gradient(180deg,var(--gold-a),var(--gold-b));color:#151515;font-size:12px;font-weight:900;flex:0 0 auto}
.teams-cta{border-left:1px solid var(--line);padding-left:20px}
.teams-cta h4{font-size:32px;line-height:1.06;letter-spacing:-.04em;margin:0 0 10px}
.teams-btn{display:inline-flex;justify-content:center;align-items:center;padding:16px 22px;border-radius:999px;background:var(--navy);color:#fff;font-weight:800;font-size:18px;margin-top:20px;min-width:210px}
.teams-btn:hover{background:var(--navy-2)}
.pricing-note,.fulfilment-note{font-size:14px;color:var(--muted-2);text-align:center;line-height:1.7;margin-top:16px}

/* ---------- policies ---------- */
.policy-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.policy-card{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;background:#fff;border:1px solid var(--line-strong);border-radius:24px;padding:24px;box-shadow:var(--shadow);transition:.2s ease}
.policy-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.policy-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:var(--band-2);border:1px solid var(--line);font-size:22px;color:var(--navy)}
.policy-card h3{font-size:22px;line-height:1.15;letter-spacing:-.03em;margin:0 0 6px}
.policy-card p{font-size:16px;line-height:1.65;color:var(--muted);margin:0}

/* ---------- contact ---------- */
.contact-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:36px;align-items:start}
.contact-main h2{font-size:clamp(34px,4.2vw,56px);line-height:1.02;letter-spacing:-.05em;margin:14px 0 18px}
.company-line{font-size:20px;line-height:1.7;color:#39424e}
.contact-list{display:grid;gap:16px}
.contact-item{background:#fff;border:1px solid var(--line-strong);border-radius:24px;padding:22px;box-shadow:var(--shadow);font-size:18px;line-height:1.7}
.contact-item a:hover{text-decoration:underline}
.contact-item small{display:block;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);font-weight:800;margin-bottom:8px}

/* ---------- footer ---------- */
.footer{padding:34px 0 40px;background:#fff;border-top:1px solid var(--line)}
.footer-top{display:flex;justify-content:space-between;gap:30px;align-items:flex-start;flex-wrap:wrap}
.footer-brand{display:flex;align-items:flex-start;gap:18px}
.footer-brand img{height:46px;width:auto}
.footer-brand p,.footer-cols p{font-size:15px;line-height:1.8;color:var(--muted);margin:0}
.footer-cols{display:flex;gap:38px;flex-wrap:wrap}
.footer-cols h4{font-size:14px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted-2);margin:0 0 8px}
.footer-links a:hover,.footer-cols a:hover{text-decoration:underline}
.footer-bottom{border-top:1px solid var(--line);margin-top:24px;padding-top:18px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:14px}
.footer-links{display:flex;gap:18px;flex-wrap:wrap}

/* ---------- inner pages ---------- */
.page-hero{padding:74px 0 28px}
.page-hero h1{font-size:clamp(36px,5vw,64px);line-height:1.02;letter-spacing:-.05em;margin:18px 0 10px}
.page-hero p{font-size:19px;color:var(--muted);line-height:1.72;max-width:860px;margin:0}
.page-card{padding:0 0 74px}
.card-surface{background:#fff;border:1px solid var(--line-strong);border-radius:28px;box-shadow:var(--shadow);padding:32px}
.card-surface h2{font-size:32px;line-height:1.1;letter-spacing:-.03em;margin:30px 0 12px}
.card-surface h2:first-of-type{margin-top:22px}
.card-surface h3{font-size:24px;line-height:1.15;letter-spacing:-.02em;margin:24px 0 10px}
.card-surface p,.card-surface li{font-size:17px;line-height:1.8;color:#3f4854}
.card-surface ul{padding-left:22px;margin:8px 0 0}
.card-surface a{color:#0e4a9e;text-decoration:underline}
.notice{padding:18px 20px;border-radius:20px;background:var(--gold-soft);border:1px solid #ecd9a6;color:#5a4a24;line-height:1.72}
.updated{font-size:14px;color:var(--muted-2);margin:0 0 4px;letter-spacing:.02em}
.meta-block{display:grid;gap:10px;margin-top:16px}
.meta-block div{padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--band);font-size:16px;color:#3f4854}

/* ---------- responsive ---------- */
@media (max-width:1120px){
  .hero-grid,.section-title-row,.contact-wrap{grid-template-columns:1fr}
  .feature-grid,.pricing-grid,.pricing-grid.three{grid-template-columns:repeat(2,1fr)}
  .how-grid{grid-template-columns:1fr}
  .teams-pricing{grid-template-columns:1fr}
  .teams-cta{border-left:none;border-top:1px solid var(--line);padding-left:0;padding-top:20px}
}


/* ---- About / Two Missions -------------------------------------------------
   Ported from aipia-two-missions.janelim0717.chatgpt.site.  These are that
   page's own declared values, read out of its stylesheet — the palette below
   is its six variables, and the type is Inter with a system fallback plus
   Georgia for the pull quote, which is what it actually uses.  No webfont is
   loaded for any of this.

   Two departures, both asked for: the sections are in the opposite order, and
   the headline gains a full stop.

   Scoped .ab- throughout.  The AIPIA Connect page underneath has its own
   tokens and its own bare h2/h3 rules; nothing here may leak into it, which is
   why the source's tag selectors became class-scoped descendants. */
.ab-about,.ab-missions{
  --ab-background:#eff2f7;
  --ab-navy:#0a1d30;
  --ab-ink:#101820;
  --ab-slate:#56636f;
  --ab-gold:#c69a45;
  --ab-border:#d4dce3;
  color:var(--ab-ink);
  font-family:Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing:antialiased;
}
.ab-shell{width:min(100%,1280px);margin:0 auto;padding-inline:28px}

/* ---- What AIPIA stands for ---- */
.ab-missions{min-height:100vh;padding-block:26px 28px;background:var(--ab-background)}
.ab-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 22px;color:#9b6e21;
  font-size:.78rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.ab-eyebrow::before{content:"";width:28px;height:1px;background:var(--ab-gold);flex:0 0 auto}
.ab-h1{margin:0 0 48px;color:var(--ab-ink);font-size:clamp(3.2rem,5.65vw,4.65rem);
  font-weight:800;letter-spacing:-.055em;line-height:.98;white-space:nowrap}
.ab-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ab-card{min-height:490px;display:flex;flex-direction:column;padding:40px 42px;border-radius:28px}
.ab-card-business{color:#fff;background:var(--ab-navy)}
.ab-card-individual{color:var(--ab-navy);border:1px solid var(--ab-border);background:#fff}
.ab-label{margin:0 0 50px;color:var(--ab-gold);font-size:.78rem;font-weight:800;
  letter-spacing:.13em;text-transform:uppercase}
.ab-card h3{max-width:500px;margin:0 0 22px;font-size:clamp(2.55rem,4vw,3.65rem);
  font-weight:800;letter-spacing:-.055em;line-height:1.03}
.ab-desc{max-width:520px;margin:0 0 30px;color:#c4d0da;font-size:1rem;line-height:1.55}
.ab-card-individual .ab-desc{color:var(--ab-slate)}
/* margin-top:auto is what keeps both pill rows on the same line even though
   the paragraphs above them run to different lengths. */
.ab-steps{display:flex;flex-wrap:wrap;gap:9px;margin-top:auto}
.ab-step{padding:8px 13px;border:1px solid rgba(255,255,255,.25);border-radius:999px;
  font-size:.78rem;font-weight:700;line-height:1;white-space:nowrap}
.ab-card-individual .ab-step{color:#46515c;border-color:#d3ccc0;background:#fff}

/* ---- About AIPIA ---- */
.ab-about{padding-block:96px;background:#fff}
.ab-about-grid{display:grid;grid-template-columns:1fr 1fr;gap:92px;align-items:center}
.ab-statement{padding:44px 0 44px 40px;border-left:4px solid var(--ab-gold)}
.ab-statement p{max-width:560px;margin:0;color:var(--ab-navy);
  font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.25rem,4vw,3.7rem);
  line-height:1.12;letter-spacing:-.035em}
.ab-kicker{display:flex;align-items:center;gap:11px;margin:0 0 24px;color:#9b6e21;
  font-size:.78rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.ab-kicker::before{content:"";width:28px;height:1px;background:var(--ab-gold);flex:0 0 auto}
.ab-copy h2{max-width:620px;margin:0 0 26px;color:var(--ab-navy);
  font-size:clamp(2.6rem,4.7vw,4.25rem);font-weight:800;letter-spacing:-.055em;line-height:1.02}
.ab-copy > p{max-width:640px;margin:0;color:var(--ab-slate);font-size:1.03rem;line-height:1.65}
.ab-lines{display:grid;margin-top:30px}
.ab-lines div{padding:16px 0;border-bottom:1px solid #d9d9d5;color:var(--ab-navy);font-weight:750}

@media (max-width:900px){
  .ab-missions{padding-top:34px}
  .ab-h1{margin-bottom:36px;font-size:clamp(2.6rem,7vw,4rem)}
  .ab-cards{grid-template-columns:1fr}
  .ab-card{min-height:430px}
  .ab-about-grid{grid-template-columns:1fr;gap:56px}
}
@media (max-width:620px){
  .ab-shell{padding-inline:16px}
  .ab-missions{padding-block:24px}
  .ab-eyebrow{font-size:.69rem;letter-spacing:.15em}
  .ab-h1{margin-bottom:30px;font-size:clamp(2.4rem,11vw,3.5rem);line-height:1.02;white-space:normal}
  .ab-card{min-height:0;padding:32px 26px;border-radius:22px}
  .ab-label{margin-bottom:36px}
  .ab-card h3{font-size:clamp(2.35rem,12vw,3.2rem)}
  .ab-steps{margin-top:14px}
  .ab-about{padding-block:72px}
  .ab-statement{padding:28px 0 28px 24px}
  .ab-statement p{font-size:clamp(2.15rem,10vw,3rem)}
  .ab-copy h2{font-size:clamp(2.5rem,12vw,3.5rem)}
}

/* ---- Our Products ---------------------------------------------------------
   Ported from Philip's AIPIA-Our-Products-Static-Section. Every number is his.
   The only change is the selectors: the original styled bare h1/h2/h3 and a
   .eyebrow, all of which this site already defines differently, so each rule
   is prefixed .pr- and the type sizes are set on classes rather than tags. */
.pr-section{background:#fff}
.pr-products{
  --pr-ink:#071a2d;
  --pr-muted:#5f6c7b;
  --pr-line:#dfe5ea;
  --pr-blue-wash:#eff7fb;
  width:min(1320px,calc(100% - 80px));
  margin:0 auto;
  padding:90px 0 104px;
  color:var(--pr-ink);
}
.pr-eyebrow{display:flex;align-items:center;gap:14px;color:#94641e;font-size:13px;
  font-weight:750;letter-spacing:.24em;text-transform:uppercase}
.pr-eyebrow::before{content:"";width:28px;height:1px;background:#c99a4a;flex:0 0 auto}
.pr-h1{max-width:1030px;margin:20px 0 54px;font-size:clamp(48px,5.2vw,76px);
  line-height:.99;letter-spacing:-.055em;font-weight:730}

/* The banner. The 44% gradient stop lines up with the grid column, so the
   copy sits on white and the phones on the blue wash. */
.pr-connect-card{position:relative;display:grid;grid-template-columns:44% 56%;
  min-height:630px;overflow:hidden;border:1px solid #d5e2e9;border-radius:30px;
  background:linear-gradient(90deg,#fff 0%,#fff 44%,var(--pr-blue-wash) 44%,var(--pr-blue-wash) 100%)}
.pr-connect-copy{position:relative;z-index:3;display:flex;flex-direction:column;
  justify-content:center;padding:70px 36px 70px 70px}
.pr-logo{display:block;object-fit:contain;object-position:left center}
.pr-connect-logo{width:360px;height:135px;margin:-18px 0 18px -14px;mix-blend-mode:multiply}
.pr-h2{margin:0;font-size:45px;line-height:1.04;letter-spacing:-.042em;font-weight:700}
.pr-description{max-width:470px;margin:24px 0 0;color:var(--pr-muted);font-size:18px;line-height:1.58}
.pr-type{margin-top:32px;color:#84612b;font-size:12px;font-weight:760;
  letter-spacing:.18em;text-transform:uppercase}
.pr-link{width:fit-content;margin-top:30px;padding-bottom:5px;border-bottom:1px solid var(--pr-ink);
  color:var(--pr-ink);font-size:16px;font-weight:700;text-decoration:none}

.pr-phone-stage{position:relative;min-height:630px}
.pr-phone{position:absolute;overflow:hidden;border:9px solid #10161c;border-radius:42px;
  background:#fff;box-shadow:0 30px 55px rgba(7,26,45,.18)}
.pr-phone::before{content:"";position:absolute;z-index:2;top:10px;left:50%;width:72px;height:19px;
  transform:translateX(-50%);border-radius:30px;background:#10161c}
.pr-phone img{width:100%;height:100%;object-fit:cover;object-position:top center}
.pr-phone-one{z-index:2;top:58px;left:24px;width:310px;height:660px;transform:rotate(-4deg)}
.pr-phone-two{z-index:1;top:18px;left:320px;width:310px;height:660px;transform:rotate(4deg)}
.pr-glow{position:absolute;right:-100px;bottom:-190px;width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(49,111,217,.15),rgba(49,111,217,0) 68%)}

.pr-features{display:grid;gap:16px;margin-top:24px}
.pr-features img{display:block;width:100%;height:auto}

.pr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:24px}
.pr-card{min-height:390px;padding:48px 52px 46px;border:1px solid var(--pr-line);
  border-radius:26px;background:#fff}
.pr-logo-wrap{display:flex;align-items:center;height:118px;margin:-4px 0 26px;overflow:hidden}
.pr-chat-logo{width:395px;height:132px}
.pr-pro-logo{width:330px;height:160px}
.pr-h3{margin:0;font-size:31px;line-height:1.14;letter-spacing:-.035em;font-weight:700}
.pr-card p{max-width:520px;margin:17px 0 0;color:var(--pr-muted);font-size:17px;line-height:1.58}

@media (max-width:980px){
  .pr-products{width:min(100% - 40px,760px);padding-top:62px}
  .pr-connect-card{grid-template-columns:1fr}
  .pr-connect-copy{padding:54px 48px 30px}
  .pr-phone-stage{min-height:620px}
  .pr-phone-one{left:calc(50% - 300px)}
  .pr-phone-two{left:calc(50% + 5px)}
  .pr-grid{grid-template-columns:1fr}
}
@media (max-width:680px){
  .pr-products{width:min(100% - 28px,520px);padding:44px 0 70px}
  .pr-h1{margin-bottom:34px;font-size:44px}
  .pr-connect-card{border-radius:22px}
  .pr-connect-copy{padding:38px 28px 18px}
  .pr-connect-logo{width:285px;height:110px}
  .pr-h2{font-size:38px}
  .pr-description{font-size:16px}
  .pr-phone-stage{min-height:475px;transform:scale(.75);transform-origin:top center;margin-bottom:-110px}
  .pr-phone-one{left:calc(50% - 290px)}
  .pr-phone-two{left:calc(50% + 3px)}
  .pr-card{min-height:auto;padding:36px 30px}
  .pr-logo-wrap{height:95px}
  .pr-chat-logo{width:310px}
  .pr-pro-logo{width:270px}
}

@media (max-width:860px){
  .nav-links{display:none;position:absolute;top:74px;left:20px;right:20px;background:#fff;border:1px solid var(--line-strong);border-radius:24px;padding:18px;box-shadow:var(--shadow-lift);flex-direction:column;align-items:flex-start}
  .nav-links.open{display:flex}
  .mobile-toggle{display:inline-flex}
  .nav-actions .btn{display:none}
  .slider-content,.policy-grid{grid-template-columns:1fr}
  .pricing-grid,.pricing-grid.three,.feature-grid{grid-template-columns:1fr}
  .feature-card.wide{grid-template-columns:1fr;grid-template-rows:auto auto auto;row-gap:12px}
  .feature-card.wide .feature-icon{grid-column:1;grid-row:1;justify-content:flex-start}
  .feature-card.wide h3{grid-column:1;grid-row:2}
  .feature-card.wide p{grid-column:1;grid-row:3}
}
@media (max-width:560px){
  .container{width:min(var(--max), calc(100% - 24px))}
  .hero{padding-top:34px}
  .hero-copy,.section-head p,.section-title-row p,.card-surface p,.card-surface li,.teams-intro p,.teams-cta p{font-size:16px}
  .hero h1,.section-head h2,.section-title-row h2,.contact-main h2{letter-spacing:-.04em}
  .price{font-size:46px}
  .price-card,.how-step,.policy-card,.feature-card,.card-surface{padding:22px}
  .teams-pricing{padding:22px}
  .teams-left{grid-template-columns:1fr}
  .footer-brand{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}