@import url("https://use.typekit.net/jva7ifj.css");

/* fonts.css */
/* AimWell Financial — typeface loading
   Arboria is licensed through Adobe Fonts (Typekit kit jva7ifj).
   The kit is a WEB kit: it activates arboria in browsers only. It does not
   install the font for PowerPoint, Canva, or print work — see readme.md.

   Verified 2026-09-16: the kit returns 200, registers @font-face for arboria,
   and document.fonts.check('400 20px arboria') is true. There is intentionally
   no font binary in this project — arboria is licensed, not redistributable.
   Tooling that expects a local font file will flag this; that is expected. */
:root {
  /* Single brand typeface. Fallback stack is a safety net only — if arboria is
     not rendering, check the Adobe Fonts kit domain allowlist before substituting. */
  --font-brand: "arboria", "Poppins", "Avenir Next", "Segoe UI", sans-serif;
  --font-sans: var(--font-brand);
}

/* colors.css */
/* AimWell Financial — color tokens
   Base palette = the five official brand colors (AIMWELL_ColorPalette.pdf).
   Web palette = the values the live site actually ships (aimwell.css), which is
   canonical for production per the brand-system resolution. */
:root {
  /* --- Official five-color brand palette --- */
  --aw-slate-blue: #424963;   /* Pantone 4131 CP — logo files only */
  --aw-seafoam-green: #6BC29C;/* Pantone 2248 CP */
  --aw-blossom-green: #88C659;/* Pantone 7488 CP */
  --aw-poppy-orange: #EF4623; /* Pantone 3516 CP */
  --aw-dusty-orange: #F79674; /* Pantone 2023 CP */

  /* --- Functional web values from the live stylesheet --- */
  --aw-navy: #213E60;         /* canonical web navy: headings, header/CTA bars */
  --aw-ink: #231F20;          /* body copy, H6 */
  --aw-white: #FFFFFF;
  --aw-bone: #F5F6F3;         /* page / alternating section background */
  --aw-mist: #F6F6F6;         /* soft panel background (team photos, get-started) */
  --aw-rule: #E8E9E6;         /* hairline dividers */

  /* --- Semantic aliases --- */
  --text-heading: var(--aw-navy);
  --text-body: var(--aw-ink);
  --text-eyebrow: var(--aw-blossom-green);
  --text-accent: var(--aw-blossom-green);
  --text-on-dark: var(--aw-white);
  --text-link: var(--aw-poppy-orange);
  --text-link-hover: #D13A1B;   /* in-palette darkening of Poppy; replaces legacy #bdbb52 */

  --surface-page: var(--aw-bone);
  --surface-card: var(--aw-white);
  --surface-soft: var(--aw-mist);
  --surface-dark: var(--aw-slate-blue);   /* sub-header band, get-started band */
  --surface-navy: var(--aw-navy);
  --border-hairline: var(--aw-rule);

  --action-bg: var(--aw-poppy-orange);
  --action-bg-hover: #D13A1B;
  --action-fg: var(--aw-white);
  --action-outline: var(--aw-blossom-green);

  --accent-soft: var(--aw-dusty-orange);
  --accent-cool: var(--aw-seafoam-green);

  /* --- Gradients --- */
  --gradient-cta: linear-gradient(225deg, #6BC29C 0%, #88C659 100%); /* @kind color */
  --gradient-panel: linear-gradient(to top right, #6BC29C, #88C659); /* @kind color */
}

/* typography.css */
/* AimWell Financial — type scale, lifted verbatim from the live stylesheet. */
:root {
  --text-h1-size: 70px;   --text-h1-line: 72px;   --text-h1-weight: 500;
  --text-h1-hero-size: 80px; --text-h1-hero-line: 80px;  /* .dev-header h1 */
  --text-h2-size: 45px;   --text-h2-line: 47px;   --text-h2-weight: 500;
  --text-h3-size: 33px;   --text-h3-line: 38px;   --text-h3-weight: 400;
  --text-h4-size: 23px;   --text-h4-line: 30px;   --text-h4-weight: 600;
  --text-h5-size: 16px;   --text-h5-line: 26px;   --text-h5-weight: 400;
  --text-h6-size: 24px;   --text-h6-line: 30px;   --text-h6-weight: 500;
  --text-body-size: 20px; --text-body-line: 26px; --text-body-weight: 400;
  --text-base-size: 19px; --text-base-weight: 300; /* body element default */
  --text-small-size: 14px;--text-small-line: 22px;
  --text-ui-size: 15px;   --text-ui-line: 15px;   --text-ui-weight: 500;
  --text-disclosure-size: 14px; --text-disclosure-line: 20px;

  --tracking-ui: 0.05em;   /* buttons, eyebrows, links, meta */
  --tracking-nav: 0.12em;  /* top nav items */
  --tracking-none: 0;
}

/* spacing.css */
/* AimWell Financial — spacing & layout tokens (from aimwell.css measurements). */
:root {
  --space-1: 5px;
  --space-2: 10px;
  --space-3: 20px;
  --space-4: 30px;
  --space-5: 40px;
  --space-6: 50px;
  --space-7: 60px;
  --space-8: 70px;
  --space-9: 90px;
  --space-10: 120px;

  --stack-heading: 40px;   /* h2/h3/h6/p bottom margin */
  --stack-tight: 20px;     /* h4 bottom margin */
  --stack-eyebrow: 5px;    /* h5 bottom margin */

  --section-pad-top: 120px;
  --section-pad-bottom: 100px;
  --section-pad-top-lead: 160px;  /* .dev-head */
  --band-pad-y: 90px;             /* get-started band */
  --cta-pad-y: 30px;              /* thin CTA band */

  --container-max: 1300px;
  --container-narrow: 900px;      /* .dev-intro */
  --container-gutter: 40px;

  --hero-height: 750px;
  --hero-height-sub: 600px;
}

/* shape.css */
/* AimWell Financial — radii, borders, elevation, motion.
   The brand is soft-cornered but almost entirely shadowless: depth comes from
   color fields and white cards on the bone background, not from drop shadows. */
:root {
  --radius-pill: 50px;      /* primary buttons, nav CTA */
  --radius-circle: 50%;     /* icon discs, team photos, back-to-top */
  --radius-sm: 5px;         /* modal / lightbox */
  --radius-md: 7px;         /* outline button, secondary button variant */
  --radius-img: 0;          /* imagery is squared off — img { border-radius: 0 } */
  --radius-map: 10px;       /* embedded map iframe */

  --border-hairline-width: 1px;
  --border-outline-width: 2px;
  --border-underline-width: 3px;  /* service link hover underline */

  --shadow-none: none;
  --shadow-overlay: 0 2px 20px rgba(0, 0, 0, 0.15); /* reserved: floating overlays only */

  --icon-disc: 110px;       /* service icon disc */
  --icon-disc-lg: 150px;    /* get-started step disc */
  --icon-glyph: 70px;       /* glyph inside a disc */
  --icon-arrow: 11px;       /* inline arrow after links/buttons */

  --motion-fast: 0.3s; /* @kind other */
  --motion-ease: ease; /* @kind other */
  --transition-base: all 0.3s ease; /* @kind other */
  --hover-lift: -5px;       /* arrow icons nudge up on hover */
}

/* export: base */
[hidden]{display:none !important}
/* export: responsive (replaces runtime width checks: nav < 1220px, stacked grids < 1000px) */
/* export: header (sticky, slims on scroll; two rows 1220-1599px; CTA row on phones) */
[data-aw-navwrap="transparent"]{position:fixed !important}
@media (min-width:1220px) and (max-width:1599.98px){[data-aw-desknav]{order:3 !important;flex:1 1 100% !important;justify-content:flex-start !important;margin-top:16px !important;padding-top:10px !important;border-top:1px solid rgba(255,255,255,0.2) !important}[data-aw-cta]{order:2 !important}[data-aw-navwrap][data-aw-scrolled] [data-aw-desknav]{margin-top:8px !important;padding-top:6px !important}}
@media (max-width:1219.98px){[data-aw-desknav]{display:none !important}[data-aw-burger]{display:flex !important}[data-aw-cta]{order:2 !important;margin-left:auto !important}}
@media (min-width:1220px){#aw-mobile-menu{display:none !important}}
@media (max-width:699.98px){[data-aw-header]{padding-top:14px !important;padding-bottom:14px !important}[data-aw-logo]{height:36px !important}}@media (max-width:599.98px){[data-aw-burger]{order:2 !important}[data-aw-cta]{order:3 !important;flex:1 1 100% !important;margin:12px 0 0 0 !important;padding:12px 22px !important}[data-aw-navwrap][data-aw-scrolled] [data-aw-cta]{margin-top:8px !important;padding:10px 18px !important}}@media (min-width:600px) and (max-width:699.98px){[data-aw-cta]{padding:12px 22px !important}}
[data-aw-navwrap][data-aw-scrolled]{box-shadow:0 2px 20px rgba(0,0,0,.15)}
[data-aw-navwrap][data-aw-scrolled] [data-aw-header]{padding-top:10px !important;padding-bottom:10px !important}
[data-aw-navwrap][data-aw-scrolled] [data-aw-logo]{height:36px !important}
@media (min-width:700px){[data-aw-navwrap][data-aw-scrolled] [data-aw-cta]{padding:12px 22px !important}}
[data-aw-dd][data-open] [data-aw-ddbtn] svg{transform:rotate(180deg)}
[id]{scroll-margin-top:140px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #EF4623;outline-offset:3px}
@media (max-width:999.98px){[data-aw-stack]{grid-template-columns:minmax(0,1fr) !important}[data-aw-tabgrid]{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
/* export: mobile touch targets + reduced motion */
@media (max-width:899.98px){a[style*="text-transform:uppercase"]:not([data-aw-cta]),button[style*="text-transform:uppercase"]{position:relative}a[style*="text-transform:uppercase"]:not([data-aw-cta])::after,button[style*="text-transform:uppercase"]::after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}[data-aw-header]>a[aria-label]{min-height:44px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}
@media (prefers-reduced-motion:reduce){#hero iframe{display:none}}
/* export: hover / pseudo states */
.h0:hover{color:var(--aw-seafoam-green) !important}
.h1:hover{color:var(--text-link-hover) !important;background:var(--aw-bone) !important}
.h2:hover{background:var(--gradient-action-hover) !important;color:#FFFFFF !important}
.h3:hover{color:#FFFFFF !important}
.h4:hover{background:rgba(255,255,255,0.35) !important}
.h5:hover{color:var(--text-link-hover) !important}
.h6:hover{color:#213E60 !important}
.h7:hover{background:var(--surface-page) !important}
.h8:hover{transform:scale(1.04) !important}
.h9:hover{background:#FFFFFF !important}
.ha:hover{box-shadow:0 18px 44px rgba(66,73,99,0.14) !important}
.hb:hover{background:#EDF7F2 !important}
.hc:hover{background:rgba(255,255,255,0.14) !important;border-color:#FFFFFF !important}
.hd:hover{background:var(--gradient-action-hover) !important}
.he:hover{border-color:var(--aw-navy) !important}
.hf:focus{outline:2px solid #EF4623 !important;outline-offset:2px !important;border-color:var(--aw-navy) !important}
.hg:hover{transform:translateY(-4px) !important;box-shadow:0 18px 44px rgba(66,73,99,0.14) !important}
.hh:hover{background:var(--aw-navy) !important;color:#FFFFFF !important}
.hi:hover{color:#F9AB97 !important}
.hj:hover{color:var(--text-link) !important}
.hk:hover{border-color:#EF4623 !important;color:#EF4623 !important}
.hl:hover{color:#6BC29C !important}
