/* BorderPlus design tokens — flattened from the design system's styles.css and its
   tokens/*.css @import closure. Colour, type, spacing, radii, shadows, motion.
   Generated for handoff; treat the design system as the source of truth. */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Lato:ital,wght@0,300;0,400;0,700;1,400&family=Poppins:wght@400;500;700&family=Fraunces:ital,wght@0,600;1,400;1,600&family=Work+Sans:wght@400;500;600&family=Roboto:wght@400;500&display=swap');

/* ===== tokens/fonts.css ===== */
/* Webfonts. The .fig references Outfit, Lato, Poppins, Fraunces, Work Sans, Roboto.
   No binaries ship inside the Figma file, so these load from Google Fonts —
   all six are the genuine families named in the source, not substitutes.
   Exceptions flagged in readme.md: "SF Pro" and "Google Sans Flex" appear 5x each
   inside the iPhone status-bar mock only; those fall back to the system UI stack. */
/* hoisted to top of file: https://fonts.googleapis.com/css2?family=Outfit:wght@300;400... */

:root{
  --font-core:'Outfit',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --font-accent-serif:'Fraunces','Outfit',Georgia,serif;
  --font-support:'Lato',-apple-system,'Segoe UI',Arial,sans-serif;
  --font-alt:'Poppins','Outfit',Arial,sans-serif;
  --font-editorial:'Work Sans','Outfit',Arial,sans-serif;
  --font-ui-numeric:'Roboto','Outfit',Arial,sans-serif;
  --font-system:'Outfit',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}


/* ===== tokens/colors.css ===== */
/* Palette. The file documents five brand colours on its "Color Palette" frame:
   #FCFEFF #CFF3FF #42C8F4 #121640 #111111.
   Everything below is a literal value read out of the .fig — never rounded. */
:root{
  /* --- Brand five (documented palette frame) --- */
  --bp-white:#FCFEFF;
  --bp-sky:#CFF3FF;
  --bp-cyan:#42C8F4;
  --bp-navy:#121640;
  --bp-ink:#111111;

  /* --- Navy family (deepest to lightest) --- */
  --navy-1000:rgb(4,7,40);
  --navy-950:rgb(10,13,42);
  --navy-900:rgb(13,11,51);
  --navy-850:rgb(12,15,46);
  --navy-800:rgb(14,21,76);
  --navy-750:rgb(18,22,64);
  --navy-700:rgb(19,22,62);
  --navy-650:rgb(22,22,83);
  --navy-600:rgb(27,23,112);
  --navy-550:rgb(29,25,109);
  --navy-500:rgb(38,49,137);
  --navy-450:rgb(41,41,41);

  /* --- Cyan family --- */
  --cyan-700:rgb(14,79,108);
  --cyan-600:rgb(6,142,195);
  --cyan-500:rgb(19,176,228);
  --cyan-400:rgb(66,200,244);
  --cyan-300:rgb(128,217,249);
  --cyan-250:rgb(194,238,253);
  --cyan-200:rgb(188,234,251);
  --cyan-150:rgb(222,245,253);
  --cyan-125:rgb(225,244,253);
  --cyan-100:rgb(240,250,255);
  --cyan-050:rgb(240,252,255);

  /* --- Cool neutrals / map + illustration fills --- */
  --slate-map:rgb(205,226,233);
  --slate-300:rgb(217,217,217);
  --slate-350:rgb(209,232,237);
  --slate-250:rgb(231,241,247);
  --slate-500:rgb(192,191,210);
  --slate-600:rgb(101,101,101);
  --slate-mid:rgb(105,106,117);
  --slate-light:rgb(151,152,159);
  --slate-pale:rgb(186,186,191);
  --slate-line:rgb(207,214,220);
  --slate-muted:rgb(171,183,194);
  --slate-ink:rgb(24,26,42);
  --white:rgb(255,255,255);
  --black:rgb(0,0,0);

  /* --- Periwinkle: footer section labels, dark-surface links --- */
  --periwinkle-400:rgb(157,190,255);
  --periwinkle-350:rgb(155,188,253);
  --periwinkle-200:rgb(221,234,255);

  /* --- Semantic + pastel accents --- */
  --red-500:rgb(255,43,58);
  --orange-400:rgb(255,149,72);
  --green-500:rgb(98,192,20);
  --green-700:rgb(76,150,15);
  --peach-100:rgb(255,202,189);
  --butter-100:rgb(255,236,196);
  --lime-100:rgb(227,255,193);

  /* --- Editorial-kit colours (a-badge / a-author / Step Number families) --- */
  --kit-indigo:rgb(75,107,251);
  --kit-indigo-soft:rgba(75,107,251,0.05);
  --kit-neutral-soft:rgba(24,26,42,0.05);
  --kit-step:rgb(73,90,255);
  --kit-step-soft:rgba(73,90,255,0.1);
  --kit-step-off-soft:rgba(171,183,194,0.1);

  /* --- Semantic aliases: use these in product code --- */
  --text-strong:var(--navy-750);
  --text-body:var(--navy-450);
  --text-muted:var(--slate-600);
  --text-on-dark:var(--white);
  --text-on-dark-muted:var(--periwinkle-400);
  --text-link:var(--cyan-500);
  --text-accent:var(--navy-500);

  --surface-page:var(--white);
  --surface-card:var(--cyan-100);
  --surface-card-alt:var(--cyan-125);
  --surface-chip:var(--cyan-150);
  --surface-inverse:var(--navy-750);
  --surface-map:var(--slate-map);

  --border-hairline:var(--slate-350);
  --border-strong:var(--navy-750);
  --border-accent:var(--cyan-400);

  --action-primary-bg:var(--cyan-400);
  --action-primary-fg:var(--white);
  --action-primary-hover-bg:var(--white);
  --action-primary-hover-fg:var(--cyan-400);
  --action-primary-disabled-bg:var(--cyan-050);
  --action-primary-disabled-fg:var(--cyan-400);
  --action-inverse-bg:var(--navy-750);
  --action-inverse-fg:var(--cyan-200);
}

/* Dark surfaces. The file has no dark THEME — it has dark SECTIONS
   (footer, hero bands, destination panels). Apply .bp-dark to one. */
.bp-dark{
  --text-strong:var(--white);
  --text-body:var(--white);
  --text-muted:var(--periwinkle-400);
  --surface-page:var(--navy-750);
  --surface-card:rgba(255,255,255,0.03);
  --border-hairline:rgba(255,255,255,0.1);
  background:linear-gradient(180deg,var(--navy-600) 0%,var(--navy-750) 100%);
  color:var(--white);
}


/* ===== tokens/typography.css ===== */
/* Type scale, transcribed from the .fig. Outfit carries the entire product;
   Fraunces Italic appears only as a display accent. */
:root{
  --fs-hero:52px; /* @kind font */      --lh-hero:70px; /* @kind other */    /* section hero, Outfit SemiBold — also seen at 64px/71px leading */
  --fs-hero-tight:52px; /* @kind font */ --lh-hero-tight:64px; /* @kind other */
  --fs-display:44px; /* @kind font */ --lh-display:40px; /* @kind other */ /* italic display line, Outfit Regular Italic */
  --fs-h1:40px; /* @kind font */ --lh-h1:52px; /* @kind other */
  --fs-h2:36px; /* @kind font */ --lh-h2:50px; /* @kind other */
  --fs-h3:34px; /* @kind font */ --lh-h3:20px; /* @kind other */      /* name plates over portraits */
  --fs-h4:24px; /* @kind font */ --lh-h4:31px; /* @kind other */      /* eyebrow / section label, SemiBold or Medium */
  --fs-lead:22px; /* @kind font */ --lh-lead:1.5; /* @kind other */     /* hero + section deck copy */
  --fs-body-lg:20px; /* @kind font */ --lh-body-lg:1.5; /* @kind other */
  --fs-body:16px; /* @kind font */ --lh-body:24px; /* @kind other */
  --fs-body-flat:16px; /* @kind font */ --lh-body-flat:20px; /* @kind other */
  --fs-sm:14px; /* @kind font */ --lh-sm:20px; /* @kind other */
  --fs-xs:12px; /* @kind font */ --lh-xs:16px; /* @kind other */

  --fw-light:300; /* @kind font */
  --fw-regular:400; /* @kind font */
  --fw-medium:500; /* @kind font */
  --fw-semibold:600; /* @kind font */
  --fw-bold:700; /* @kind font */

  --ls-normal:0; /* @kind other */
}

/* Ready-made classes for the recurring text roles. */
.bp-hero{font:var(--fw-semibold) var(--fs-hero)/var(--lh-hero) var(--font-core);color:var(--text-strong);text-wrap:pretty}
.bp-display-italic{font:italic var(--fw-regular) var(--fs-display)/var(--lh-display) var(--font-core);color:var(--navy-900)}
.bp-display-serif{font:italic var(--fw-semibold) var(--fs-h1)/1.15 var(--font-accent-serif);color:var(--text-strong)}
.bp-eyebrow{font:var(--fw-medium) var(--fs-h4)/100% var(--font-core);color:var(--text-strong)}
.bp-section-label{font:var(--fw-semibold) var(--fs-h4)/40px var(--font-core);color:var(--navy-500)}
.bp-lead{font:var(--fw-regular) var(--fs-lead)/var(--lh-lead) var(--font-core);color:var(--text-strong);text-wrap:pretty}
.bp-body{font:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-core);color:var(--text-body)}
.bp-body-sm{font:var(--fw-regular) var(--fs-sm)/100% var(--font-core);color:var(--text-body)}
.bp-caption{font:var(--fw-regular) var(--fs-xs)/var(--lh-xs) var(--font-core);color:var(--text-muted)}


/* ===== tokens/spacing.css ===== */
/* Spacing. Figma Variables define the Space/* ramp as unitless floats;
   the px aliases below are what you actually author with. */
:root{
  --sp-0:0px;   --sp-050:2px; --sp-100:4px; --sp-150:6px; --sp-200:8px;
  --sp-300:12px;--sp-400:16px;--sp-600:24px;--sp-800:32px;--sp-1200:48px;
  --sp-1600:64px;--sp-2400:96px;

  /* Page frame, from the 1440 desktop artboards */
  --page-width:1440px; /* @kind spacing */
  --page-gutter:80px;      /* footer + wide sections */
  --page-gutter-nav:56px;  /* header nav */
  --page-gutter-tight:50px;/* section blocks */
  --content-max:1280px; /* @kind spacing */
  --content-footer:1062px; /* @kind spacing */
  --mobile-width:412px; /* @kind spacing */

  /* Recurring rhythm */
  --stack-tight:16px;
  --stack:24px;
  --stack-loose:32px;
  --stack-section:48px;
}


/* ===== tokens/radii.css ===== */
:root{
  --radius-none:0px;
  --radius-xs:4px;
  --radius-badge:6px;      /* a-badge, Step Number square */
  --radius-sm:8px;
  --radius-md:12px;        /* info strips */
  --radius-lg:16px;        /* the default card radius across the site */
  --radius-xl:20px;
  --radius-2xl:24px;       /* city / location cards */
  --radius-3xl:28px;
  --radius-pill:1000px;    /* every button */
  --radius-circle:50%;
}


/* ===== tokens/shadows.css ===== */
/* Every shadow here is verbatim from the .fig. Note the house pattern:
   elevation is a two-stop stack, and glow is a cyan-tinted inset. */
:root{
  --shadow-card:0px 16px 32px -4px rgba(12,12,13,0.1),0px 4px 4px -4px rgba(12,12,13,0.05);
  --shadow-nav:0px 0px 6.300px 0px rgba(0,0,0,0.25);
  --shadow-float:0px 0px 11.300px 0px rgba(0,0,0,0.11);
  --shadow-glow-cyan:0px 0px 8.900px 0px rgba(66,200,244,0.61);
  --shadow-pin:5px 5px 10px 0px rgba(65,115,129,0.75);
  --glow-inset-cyan:inset 0px 6px 21.800px 0px rgba(66,200,244,0.22);
  --glow-inset-aqua:inset 0px 14px 30.200px 0px rgba(18,212,255,0.16);
  --ring-brand:inset 0 0 0 2px var(--navy-750);
  --ring-hairline:inset 0 0 0 1px var(--slate-350);
  --ring-white-thick:inset 0 0 0 12px var(--white);
  --blur-glass:blur(20px); /* @kind other */
  --blur-portrait:blur(15.800px); /* @kind other */
}


/* ===== tokens/motion.css ===== */
/* The .fig carries no prototype easing curves. These are the conventions
   the design's own states imply — documented in readme.md as inferred, not read. */
:root{
  --ease-standard:cubic-bezier(0.4,0,0.2,1); /* @kind other */
  --ease-out:cubic-bezier(0,0,0.2,1); /* @kind other */
  --dur-fast:120ms; /* @kind other */
  --dur-base:200ms; /* @kind other */
  --dur-slow:320ms; /* @kind other */
}


/* ===== tokens/figma-variables.css ===== */
/* Generated from the .fig's single Figma Variable collection (31 variables,
   25 float + 6 color). FLOAT tokens are unitless — multiply by 1px in calc().
   These are library-inherited (Material-style corner/depth/space ramps); the
   BorderPlus-specific values live in the other token files. */
:root{
  --black-100:rgba(12,12,13,0.05);
  --black-100-2:rgba(12,12,13,0.05);
  --black-200:rgba(12,12,13,0.1);
  --black-200-2:rgba(12,12,13,0.1);
  --corner-none:0;
  --corner-extra-small:4;
  --corner-small:8;
  --corner-medium:12;
  --corner-large:16;
  --corner-extra-large:28;
  --corner-full:1000;
  --depth-0:0; /* @kind other */
  --depth-100:4; /* @kind other */
  --depth-400:16; /* @kind other */
  --depth-800:32; /* @kind other */
  --depth-negative-100:-4; /* @kind other */
  --interrupter-md:120; /* @kind other */
  --labels-primary:rgb(0,0,0);
  --schemes-outline-variant:rgb(202,196,208);
  --space-0:0;
  --space-050:2;
  --space-100:4;
  --space-150:6;
  --space-200:8;
  --space-300:12;
  --space-400:16;
  --space-600:24;
  --space-800:32;
  --space-1200:48;
  --space-1600:64;
  --space-2400:96;
}
:root[data-mode="large"]{--interrupter-md:240 /* @kind other */}
:root[data-theme="dark"],.dark{--labels-primary:rgb(255,255,255);--schemes-outline-variant:rgb(73,69,79)}
:root[data-theme="light"],.light{--labels-primary:rgb(0,0,0);--schemes-outline-variant:rgb(69,65,74)}


/* ===== tokens/base.css ===== */
/* Minimal resets + link colours so nothing renders browser-default. */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-core);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
a{color:var(--text-link);text-decoration:none;transition:color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--cyan-600)}
.bp-dark a{color:var(--periwinkle-400)}
.bp-dark a:hover{color:var(--white)}
img{max-width:100%}


/* ===== styles.css (own rules) ===== */
/* BorderPlus Design System — global entry point.
   Consumers link this one file. Imports only; no rules here. */










/* Responsive layer for the BorderPlus site kit.
   The JSX keeps its exact Figma values as the >=1280px baseline; these rules
   override only what has to change at narrower widths. Baseline 1920; breakpoints: 1280 / 1024 / 768 / 480. */

/* Page is built on a 1920 grid: backgrounds run full-bleed, content caps at 1920 and centres. */
.r-page{width:100%;overflow-x:clip}
.r-hero-slot{left:50%;bottom:166px;width:258px;height:348px;margin-left:-129px}
.r-hero-blob{width:258px;height:258px}
.r-hero-blob[data-side="left"]{left:0;top:181px}
.r-hero-blob[data-side="right"]{right:0;top:173px}
.r-dest-sticky{position:sticky;top:140px;align-self:flex-start}
@keyframes bpMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.r-trust div[style*="bpMarquee"]{animation:none!important}}
@keyframes bpPlateIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.r-sec{padding-left:max(50px,calc((100% - 1820px) / 2));padding-right:max(50px,calc((100% - 1820px) / 2))}
.r-sec-80{padding-left:max(80px,calc((100% - 1760px) / 2));padding-right:max(80px,calc((100% - 1760px) / 2))}
.r-header{padding-left:max(50px,calc((100% - 1820px) / 2))!important;padding-right:max(50px,calc((100% - 1820px) / 2))!important}
.r-footer{padding-left:max(80px,calc((100% - 1760px) / 2))!important;padding-right:max(80px,calc((100% - 1760px) / 2))!important}

/* ── >= 1600: fill the wider 1920 grid ── */
@media (min-width:1600px){
  .r-h1{font-size:72px;line-height:82px}
  .r-hero-copy{width:760px}
  .r-hero-copy p{width:640px}
  .r-hero-side{width:760px;height:700px}
  .r-hero-art{width:440px;height:440px}
  .r-hero-slot{bottom:196px;width:280px;height:378px;margin-left:-140px}
  .r-hero-blob{width:280px;height:280px}
  .r-hero-plate{top:482px;width:320px}
  .r-hero-flank{width:290px;height:392px}
}

/* ── <= 1280: shrink the page frame, let fixed-width blocks breathe ── */
@media (max-width:1280px){
  .r-sec{padding-left:32px!important;padding-right:32px!important}
  .r-sec-80{padding-left:32px!important;padding-right:32px!important}
  .r-h1{font-size:52px!important;line-height:60px!important}
  .r-h2{font-size:42px!important;line-height:54px!important}
  .r-lead{font-size:20px!important}
  .r-fixed{width:auto!important;max-width:100%!important}
  .r-stats{gap:40px!important}
  .r-hero-side{width:560px!important;height:540px!important}
  .r-hero-art{width:340px!important;height:340px!important;top:44px!important}
  .r-hero-rays{width:1000px!important;height:761px!important;top:264px!important}
  .r-hero-slot{bottom:156px!important;width:210px!important;height:284px!important;margin-left:-105px!important}
  .r-hero-blob{width:210px!important;height:210px!important}
  .r-hero-plate{top:362px!important}
  .r-hero-flank{width:210px!important;height:284px!important}
  .r-hero-plate{width:270px!important}
  .r-cmp{gap:20px!important}
  .r-cmp>article{width:auto!important;flex:1 1 0!important;min-width:0!important}
  .r-articles>article{width:auto!important;flex:1 1 0!important;min-width:0!important;height:auto!important}
}

/* ── <= 1024: two-up grids, stacked hero ── */
@media (max-width:1024px){
  .r-h1{font-size:44px!important;line-height:52px!important}
  .r-h2{font-size:36px!important;line-height:46px!important}
  .r-hero{flex-direction:column!important;align-items:flex-start!important;gap:40px!important;display:flex!important}
  .r-hero-copy{width:100%!important}
  .r-hero-copy p{width:100%!important}
  .r-hero-side{align-self:center!important;width:100%!important;max-width:560px!important}
  .r-split{flex-direction:column!important;align-items:flex-start!important;gap:24px!important}
  .r-dest-sticky{position:static!important}
  .r-dest-item{min-height:0!important;padding:24px 0!important}
  .r-3col{flex-wrap:wrap!important}
  .r-3col>*{flex:1 1 320px!important;min-width:0!important}
  .r-stats{flex-wrap:wrap!important;gap:32px 48px!important}
  .r-stats>*{width:auto!important}
  .r-quotes{flex-wrap:wrap!important;gap:32px!important}
  .r-quotes>*{max-width:none!important;flex:1 1 280px!important;border-left:none!important;padding-left:0!important}
  .tm-q + .tm-q::before{display:none!important}
  .r-videos{flex-wrap:wrap!important}
  .r-videos>button{width:46%!important;height:220px!important}
  .r-faq{flex-direction:column!important;gap:0!important}
  .r-nav{display:none!important}
  .r-burger{display:inline-flex!important}
  .r-panel{width:340px!important;flex:0 0 auto!important}
  .rec-card,.ace-card,.fs-count{width:100%!important}
  .rec-card{display:grid!important;grid-template-columns:64px 1fr!important;column-gap:16px!important;row-gap:6px!important;align-items:start!important;text-align:left!important;padding:22px 20px!important}
  .rec-card>span:first-child{grid-column:1!important;grid-row:1/3!important;margin-bottom:0!important;align-self:center!important}
  .rec-card b,.rec-card p{grid-column:2!important;max-width:none!important;text-align:left!important}
  .rec-card b{font-size:18px!important;line-height:25px!important}
  .rec-card p{font-size:13px!important;line-height:20px!important}
  .ss-carousel{height:clamp(220px,52vw,320px)!important}
}

/* ── <= 768: one column everywhere ── */
@media (max-width:768px){
  .r-sec,.r-sec-80{padding-left:20px!important;padding-right:20px!important}
  .r-sec,.r-sec-80{padding-top:32px!important;padding-bottom:48px!important}
  .dest-sec{padding-top:16px!important}
  .r-h1{font-size:34px!important;line-height:42px!important}
  .r-h2{font-size:28px!important;line-height:36px!important}
  .r-eyebrow{font-size:18px!important}
  .r-lead{font-size:17px!important}
  .r-hero{padding-top:32px!important}
  .r-hero-copy{align-items:center!important;text-align:center!important;display:flex!important;flex-direction:column!important;width:100%!important}
  .r-cta{width:100%!important;justify-content:center!important;flex-direction:column!important;align-items:center!important}
  .r-h1{text-align:center!important}
  .r-lead{margin-left:auto!important;margin-right:auto!important;text-align:center!important}
  .r-cta{justify-content:center!important}
  .r-hero-side{height:418px!important}
  .r-hero-art{width:250px!important;height:250px!important;top:34px!important}
  .r-hero-slot{bottom:134px!important;width:160px!important;height:216px!important;margin-left:-80px!important}
  .r-hero-slot[data-slot="left"],.r-hero-slot[data-slot="right"],.r-hero-slot[data-slot="out"]{opacity:0!important}
  .r-hero-blob{width:120px!important;height:120px!important;opacity:0.55!important}
  .r-hero-blob[data-side="left"]{left:6%!important;top:64px!important}
  .r-hero-blob[data-side="right"]{right:6%!important;top:56px!important}
  .r-hero-plate{top:264px!important;width:210px!important;padding:10px 14px!important;gap:5px!important}
  .r-hero-plate span{font-size:18px!important;line-height:22px!important}
  .plate-city{font-size:13px!important}
  .plate-pill{font-size:12px!important;padding:4px 10px!important}
  .r-hero-flank{display:none!important}
  .r-hero{gap:20px!important}
  .r-cta{margin-top:0!important}
  .r-hero-rays{width:700px!important;height:533px!important;top:190px!important}
  .r-hero-ring{box-shadow:inset 0 0 0 8px rgb(255,255,255),0px 0px 8.9px 0px rgba(66,200,244,0.61)!important}
  .r-cta{flex-direction:column!important;align-items:stretch!important;width:100%!important}
  .r-cta>*{width:100%!important}
  .r-3col{flex-direction:column!important}
  .why-card{display:grid!important;grid-template-columns:56px 1fr!important;column-gap:18px!important;row-gap:6px!important;align-items:start!important;text-align:left!important;padding:0!important}
  .why-card .why-ico{grid-column:1!important;grid-row:1/3!important;height:auto!important;justify-content:flex-start!important}
  .why-card .why-t{grid-column:2!important;text-align:left!important}
  .why-card .why-p{grid-column:2!important;text-align:left!important}
  .r-3col>*{flex:1 1 auto!important;width:100%!important}
  .r-cmp{flex-direction:column!important}
  .r-cmp>article{width:100%!important}
  .r-articles{flex-direction:row!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;gap:14px!important;justify-content:flex-start!important;scrollbar-width:none!important;-webkit-overflow-scrolling:touch!important;padding-bottom:2px!important}
  .r-articles::-webkit-scrollbar{display:none!important}
  .r-articles>article{width:78%!important;flex:0 0 78%!important;scroll-snap-align:center!important;height:auto!important}
  .art-prog{display:block!important}
  .art-meta{gap:10px!important}
  .art-author{font-size:13px!important;gap:8px!important;min-width:0!important}
  .art-author img{width:28px!important;height:28px!important}
  .art-date{font-size:11px!important;white-space:nowrap!important}
  .art-t{font-size:19px!important;line-height:26px!important}
  .r-panel{width:100%!important}
  .r-stack-pad{padding-left:20px!important;padding-right:20px!important}
  .r-card-pad{padding:24px 20px!important}
  .r-videos>button{width:100%!important;height:200px!important}
  .r-stats{display:grid!important;grid-template-columns:1fr 1fr!important;gap:24px 16px!important;justify-content:flex-start!important}
  .r-stats>*{width:auto!important}
  .r-stats span{white-space:normal!important}
  .r-phones{height:auto!important;flex-direction:row!important;align-items:stretch!important;gap:8px!important}
  .r-phones>div{width:33.33%!important}
  .np-panel{height:190px!important;border-radius:12px!important}
  .np-tag{padding:6px 12px!important;font-size:11px!important;gap:5px!important;margin-top:-14px!important;border-radius:7px!important}
  .np-tag img{width:14px!important;height:14px!important}
  .np-stats{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important;flex-wrap:nowrap!important}
  .np-stat{width:auto!important;gap:2px!important;min-width:0!important}
  .np-stat svg,.np-stat img{width:12px!important;height:auto!important}
  .np-stat .num{font-size:16px!important;line-height:20px!important}
  .np-stat .lbl{font-size:9px!important;line-height:12px!important;text-align:center!important}
  .r-map-wrap{height:auto!important;padding-top:300px!important}
  .r-map-canvas{height:auto!important}
  .map-overlay{top:300px!important;bottom:0!important;height:auto!important}
  .r-map-arc{top:232px!important;height:560px!important;left:-40%!important;right:-40%!important}
  .map-line{display:block!important}
  .r-map-callout{position:absolute!important;left:16px!important;right:16px!important;width:auto!important;margin-left:0!important;top:16px!important}
  .r-footer-cols{display:none!important}
  .r-footer-base{display:none!important}
  .f-mob{display:flex!important}
  .r-header{height:auto!important;padding:12px 20px!important;gap:16px!important}
  .r-logo span{font-size:18px!important}
  .r-trust img{height:48px!important}
  .r-trust{gap:15px!important}
  .rec-side{max-width:none!important}
  .rec-h2{font-size:36px!important;line-height:44px!important}
  .fs-h2{font-size:26px!important;line-height:32px!important}
  .r-pills{gap:20px 12px!important;flex-wrap:wrap!important;flex-direction:row!important;justify-content:center!important}
  .fs-col{flex:0 0 calc(50% - 12px)!important}
  .ace-track,.ace-brackets{display:none!important}
  .ace-m{display:flex!important}
  .ace-mode{font-size:11px!important;gap:5px!important}
  .r-fs-panel{padding:24px 16px 26px!important}
  .fs-cta{width:100%!important;min-width:0!important}
  .r-pills{gap:32px!important}
  .fs-split{gap:16px!important}
  .ral-tile{width:88px!important;height:88px!important}
  .ral-t{font-size:20px!important;line-height:26px!important}
  .ss-carousel{height:clamp(200px,58vw,280px)!important}
  .tm-burst{display:none!important}
  .r-quotes{flex-direction:column!important;padding:26px 20px 76px!important;gap:0!important}
  .tm-q{flex:1 1 auto!important;max-width:none!important;width:100%!important;padding:0!important;gap:22px!important}
  .r-quotes>.tm-q:nth-of-type(n+2){display:none!important}
  .tm-q .qo,.tm-q .qc{font-size:40px!important}
  .tm-q + .tm-q::before{display:none!important}
  .tm-q p{font-size:14px!important;line-height:22px!important}
  .tm-arrow{top:auto!important;bottom:18px!important;transform:none!important;width:38px!important;height:38px!important;background:rgb(214,240,252)!important;color:var(--navy)!important}
  .tm-arrow.prev{left:16px!important;right:auto!important}
  .tm-arrow.next{left:auto!important;right:16px!important}
  .tm-who img{width:44px!important;height:44px!important}
  .r-cmp{display:none!important}
  .cmp-m{display:flex!important}
  .vid-play{width:38px!important;height:38px!important;box-shadow:0 0 0 4px rgba(10,9,54,0.35)!important}
  .vid-play i{border-left-width:10px!important;border-top-width:6px!important;border-bottom-width:6px!important;margin-left:3px!important}
  .ss-nav{gap:12px!important}
  .np-panel{height:190px!important}
  .art-card{height:auto!important}
}

@media (max-width:480px){
  .r-h1{font-size:30px!important;line-height:38px!important}
  .r-h2{font-size:24px!important;line-height:32px!important}
  .r-hero-side{height:356px!important}
  .r-hero-art{width:200px!important;height:200px!important;top:28px!important}
  .r-hero-slot{bottom:128px!important;width:128px!important;height:173px!important;margin-left:-64px!important}
  .r-hero-plate{top:212px!important}
  .r-hero-rays{width:560px!important;height:426px!important;top:162px!important}
  .r-hero-plate{width:100%!important}
  .r-stats>*{width:auto!important}
  .r-pills{gap:18px 10px!important}
}

/* Footer height is fixed at 377 in Figma — let it grow once stacked. */
@media (max-width:1024px){.r-footer{height:auto!important;padding:48px 32px!important}}
@media (max-width:768px){.r-footer{padding:40px 20px!important}}

.r-burger{display:none}
.mob-br{display:none}
@media (max-width:768px){.mob-br{display:inline}}
.r-mobile-nav{display:flex;flex-direction:column;gap:14px;padding:0 20px 16px}


/* BorderPlus home — HTML5/CSS3 port of the React kit. Values match ui_kits/website 1:1. */
:root{--navy:rgb(18,22,64);--cyan:rgb(66,200,244);--core:var(--font-core);--serif:var(--font-accent-serif)}
html,body{margin:0;background:var(--white)}
body{font-family:var(--font-core);overflow-x:clip}
a{color:var(--navy);text-decoration:none}a:hover{color:rgb(19,176,228)}
img{max-width:100%}
button{font-family:var(--font-core)}
.bp-btn{border:none;cursor:pointer;border-radius:1000px;padding:12px 24px;font:500 16px/20px var(--core);display:inline-flex;align-items:center;justify-content:center}
.bp-btn-cyan{background:var(--cyan);color:var(--navy)}
.bp-btn-ghost-dark{background:transparent;color:#fff}
.bp-btn-navy{background:var(--navy);color:rgb(188,234,251)}
.know-more{display:inline-flex;align-items:center;gap:8px;font:500 16px/1.5 var(--core);color:#fff}
.know-more.dark{color:var(--navy)}
/* header */
.hdr-wrap{position:sticky;top:0;z-index:20;background:var(--white);box-shadow:var(--shadow-nav)}
.r-header{height:90px;display:flex;align-items:center;gap:55px;padding:16px 50px;box-sizing:border-box}
.r-logo{display:flex;align-items:center;gap:12px;flex-shrink:0}
.r-logo span{font:600 22px/1 var(--core);color:var(--navy-750);letter-spacing:-0.01em}
.r-nav{display:flex;align-items:center;gap:24px;flex-grow:1}
.nav-link-bp{font:600 16px/100% var(--core);color:rgb(19,22,62);padding:0 20px;border-radius:20px;height:30px;display:inline-flex;align-items:center;gap:10px;cursor:pointer;background:transparent;border:none;white-space:nowrap}
.nav-link-bp.active{background:var(--cyan-100)}
.nav-caret{display:inline-block;width:5px;height:5px;border-right:1.5px solid rgb(19,22,62);border-bottom:1.5px solid rgb(19,22,62);transform:rotate(45deg);margin-bottom:3px}
.hdr-cta{display:flex;align-items:center;gap:20px;padding:0 12px;flex-shrink:0}
.btn-signup{height:36px;padding:0 24px;border-radius:20px;border:none;background:rgb(19,22,62);color:rgb(196,232,249);font:600 16px/100% var(--core);cursor:pointer}
.r-burger{display:none;margin-left:auto;background:none;border:none;flex-direction:column;gap:5px;cursor:pointer;padding:10px}
.r-burger span{width:22px;height:2px;background:var(--navy-750);border-radius:1000px;display:block;margin:2.5px 0}
.r-mobile-nav{display:none;border-top:1px solid var(--cyan-200);padding:12px 20px;flex-direction:column}
.r-mobile-nav a{font:600 16px/100% var(--core);color:rgb(19,22,62);padding:10px 0;display:block}
.r-mobile-nav.open{display:flex}
/* hero */
.hero-sec{position:relative;overflow:hidden;background:linear-gradient(180deg,rgb(38,33,142) 0%,rgb(14,17,52) 100%);padding-top:80px;padding-bottom:64px}
.hero-vignette{position:absolute;right:-20%;top:-165px;width:1096px;height:1081px;background:radial-gradient(548px 540.5px at 50% 50%,rgb(10,13,42) 0%,rgba(11,14,44,0.9305) 25.55%,rgba(12,15,46,0.8096) 37.72%,rgba(18,22,64,0) 89.41%);opacity:0.62;pointer-events:none}
.r-hero-mesh{position:absolute;left:8%;top:68%;width:89%;height:554px;pointer-events:none;background-image:radial-gradient(rgb(20,21,76) 1.9px,rgba(0,0,0,0) 2px);background-size:16px 16px}
.r-hero{position:relative;display:grid;grid-template-columns:minmax(0,620px) minmax(0,1fr);grid-template-rows:max-content 1fr;column-gap:48px;align-items:center;margin-top:-24px}
.r-hero-copy{grid-column:1;grid-row:1}
.r-hero-side{grid-column:2;grid-row:1/3}
.r-hero-copy{width:620px;flex-shrink:0}
.r-h1{margin:0;font:600 64px/74px var(--core);color:#fff}
.r-h1 em,.em-serif{font-style:italic;font-weight:400;font-family:var(--serif)}
.r-h1 em{display:block}
.r-lead{margin:24px 0 0;width:552px;font:400 22px/1.5 var(--core);color:#fff}
.r-cta{display:flex;gap:14px;margin-top:32px;grid-column:1;grid-row:2;align-self:start}
.r-hero-side{position:relative;flex-shrink:0;width:660px;max-width:100%;height:596px;margin-top:16px}
.r-hero-rays{position:absolute;left:50%;top:327px;width:1180px;height:898px;transform:translate(-50%,-50%);pointer-events:none;background:url("assets/images/home/hero-rays.png") center/100% 100% no-repeat}
.r-hero-blob{position:absolute;border-radius:50%;overflow:hidden;background:rgb(4,7,40);z-index:1}
.r-hero-blob img{position:absolute;left:50%;bottom:-7.8%;width:119%;max-width:none;margin-left:-59.5%;filter:brightness(0.28) saturate(0.7);opacity:0;transition:opacity 360ms ease}
.r-hero-blob img.on{opacity:1;transition-delay:260ms}
.r-hero-art{position:absolute;left:50%;top:64px;width:406px;height:406px;transform:translateX(-50%);z-index:2}
.hero-disc{position:absolute;inset:12px;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgb(220,246,255) 0%,rgb(122,214,247) 72%,rgb(66,200,244) 100%)}
.r-hero-ring{position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 12px #fff,0 0 8.9px 0 rgba(66,200,244,0.61);pointer-events:none}
.r-hero-slot{position:absolute;transform-origin:50% 100%;transition:transform 1050ms cubic-bezier(.22,.9,.25,1);pointer-events:none;z-index:1}
.r-hero-slot[data-slot="centre"]{z-index:3;transform:translate(0,0) scale(1)}
.r-hero-slot[data-slot="right"]{transform:translate(78%,-6%) scale(0.52)}
.r-hero-slot[data-slot="left"]{transform:translate(-78%,-3%) scale(0.52)}
.r-hero-slot[data-slot="out"]{transform:translate(112%,-9%) scale(0.34)}
.r-hero-face{position:absolute;left:50%;bottom:-14%;width:229%;max-width:none;margin-left:-114.5%;opacity:0;filter:brightness(0.28) saturate(0.7);transition:opacity 460ms ease,filter 500ms ease}
.r-hero-slot[data-slot="centre"] .r-hero-face{opacity:1;filter:none;transition:opacity 300ms ease,filter 600ms ease}
/* Ashish Ghumate, Abigail Jaison, Jyothsna Malini and Sreeraj Thalethodi are framed wider than the rest of the roster — render them smaller so they clear the ring. */
.r-hero-face[data-fit="wide"]{width:196%;margin-left:-98%;bottom:-7%}
.r-hero-blob img[data-fit="wide"]{width:102%;margin-left:-51%;bottom:-3%}

.r-hero-plate{position:absolute;left:50%;top:448px;width:292px;transform:translateX(-50%);z-index:4;background:#fff;border-radius:8px;padding:14px 18px;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 16px 32px -4px rgba(12,12,13,0.1)}
.plate-body{display:flex;flex-direction:column;align-items:center;gap:8px;animation:bpPlateIn 620ms cubic-bezier(.16,.84,.28,1) both}
.plate-name{font:600 26px/32px var(--core);color:var(--navy);white-space:nowrap}
.plate-city{display:flex;align-items:center;gap:6px;font:400 16px/18px var(--core);color:var(--navy)}
.plate-pill{display:inline-flex;align-items:center;gap:8px;background:rgb(206,238,252);border-radius:8px;padding:6px 12px;font:500 15px/18px var(--core);color:var(--navy);white-space:nowrap}
/* trust marquee */
.r-trust{padding-top:32px;padding-bottom:24px;display:flex;flex-direction:column;gap:24px;align-items:center;overflow:hidden}
.trust-lead{margin:0;font:400 22px/1.5 var(--core);color:var(--navy);text-align:center}
.trust-clip{width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0,#000 6%,#000 94%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,rgba(0,0,0,0) 0,#000 6%,#000 94%,rgba(0,0,0,0) 100%)}
.trust-track{display:flex;align-items:center;width:max-content;animation:bpMarquee 78s linear infinite}
.trust-track img{height:68px;width:auto;flex-shrink:0;margin-right:104px}
/* global presence */
.gp-sec{position:relative;padding-top:36px;padding-bottom:72px;overflow:hidden}
.gp-head{position:relative;display:flex;flex-direction:column;gap:16px;align-items:center;text-align:center}
.r-h2{margin:0;font:600 52px/70px var(--core);color:var(--navy)}
.gp-lead{margin:0;max-width:729px;font:400 22px/1.5 var(--core);color:var(--navy)}
.r-stats{position:relative;display:flex;gap:72px;justify-content:center;flex-wrap:wrap;margin:32px 0 0}
.r-stats>div{display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center}
.stat-v{font:600 40px/52px var(--core);color:rgb(19,176,228)}
.stat-l{font:400 16px/24px var(--core);color:var(--navy);white-space:nowrap}
.r-map-wrap{position:relative;margin-top:24px;padding-top:330px}
.r-map-canvas{display:block;width:100%;height:auto}
.map-hl{position:absolute;left:0;bottom:0;width:100%;height:auto;opacity:0;pointer-events:none;transition:opacity 420ms ease}
.map-hl.on{opacity:1}

.r-map-arc{position:absolute;left:-24%;right:-24%;top:262px;height:1240px;border-radius:50%;border-top:1.5px solid rgba(66,200,244,0.55);background:radial-gradient(120% 60% at 50% 0%,rgba(66,200,244,0.10) 0%,rgba(66,200,244,0.03) 32%,rgba(66,200,244,0) 62%);pointer-events:none;z-index:0}
.r-map-callout{position:absolute;top:40px;width:300px;margin-left:-10px;border-radius:20px;background:#fff;box-shadow:inset 0 6px 21.8px 0 rgba(66,200,244,0.22),0 0 11.3px 0 rgba(0,0,0,0.11);padding:18px 20px;display:flex;flex-direction:column;gap:10px;box-sizing:border-box;z-index:5;animation:bpPlateIn 420ms cubic-bezier(.16,.84,.28,1) both}
.callout-name{font:600 18px/22px var(--core);color:var(--navy)}
.callout-perk{display:flex;gap:8px;align-items:flex-start;font:400 13px/17px var(--core);color:var(--navy)}
.callout-perk i{width:5px;height:5px;border-radius:50%;background:var(--navy);margin-top:6px;flex-shrink:0}
.callout-btn{display:inline-flex;justify-content:center;width:100%;padding:10px 18px;border-radius:1000px;border:none;background:var(--navy);color:rgb(188,234,251);font:500 14px/16px var(--core);cursor:pointer}
.map-overlay{position:absolute;left:0;right:0;top:330px;bottom:0}
.map-line{position:absolute;top:-104px;width:1px;background:var(--cyan);opacity:0.75;transition:left 420ms cubic-bezier(.2,.9,.3,1),height 420ms cubic-bezier(.2,.9,.3,1);pointer-events:none}
.r-map-pin{position:absolute;width:40px;height:48px;padding:0;border:none;background:transparent;cursor:pointer;line-height:0;z-index:3;transform-origin:50% 100%;transform:scale(1);transition:transform 300ms cubic-bezier(.2,.9,.3,1)}
.r-map-pin.on{z-index:20!important;transform:scale(1.1)}
.r-map-pin svg{display:block;width:100%;height:100%;filter:drop-shadow(3px 5px 6px rgba(65,115,129,0.38));overflow:visible}
.r-map-pin .pin-body{fill:#fff;transition:fill 320ms ease}
.r-map-pin.on .pin-body{fill:var(--cyan)}
@keyframes bpPinDrop{0%{transform:scale(1.1) translateY(-9px)}55%{transform:scale(1.16) translateY(3px)}100%{transform:scale(1.1) translateY(0)}}
@keyframes bpPinBob{0%,100%{transform:scale(1.1) translateY(0)}50%{transform:scale(1.1) translateY(-7px)}}
@keyframes bpPinPulse{0%{transform:scale(.35);opacity:.55}70%{opacity:.12}100%{transform:scale(1.5);opacity:0}}
.r-map-pin::after{content:"";position:absolute;left:50%;bottom:-15px;width:30px;height:30px;margin-left:-15px;border-radius:50%;border:2px solid var(--navy);opacity:0;pointer-events:none}
.r-map-pin.on::after{animation:bpPinPulse 1700ms ease-out infinite}
.r-map-pin.on{animation:bpPinDrop 420ms cubic-bezier(.2,.9,.3,1),bpPinBob 1900ms ease-in-out 420ms infinite}
.r-map-pin:not(.on):hover{transform:scale(1.07)}
@media (prefers-reduced-motion:reduce){.r-map-pin.on,.r-map-pin.on::after{animation:none}}
/* Mobile: smaller pins so the tightened GCC diamond stops overlapping. 24px keeps the
   bubble legible; ::before widens the tap target to 30px — capped there because the
   diamond spaces pins ~32px apart and larger circles would re-block each other. */
@media (max-width:768px){
  .r-map-pin{width:24px;height:29px}
  .r-map-pin::before{content:"";position:absolute;left:50%;top:42%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%}
  .r-map-pin::after{bottom:-9px;width:17px;height:17px;margin-left:-8.5px;border-width:1.5px}
}
/* destinations */
.dest-sec{position:relative;overflow-x:clip;background:linear-gradient(180deg,rgb(27,23,112) 0%,rgb(18,22,64) 100%);padding-top:72px;padding-bottom:72px}
.dest-plus{position:absolute;pointer-events:none;background:rgba(255,255,255,0.045);clip-path:polygon(38% 0,62% 0,62% 38%,100% 38%,100% 62%,62% 62%,62% 100%,38% 100%,38% 62%,0 62%,0 38%,38% 38%)}
.r-split{position:relative;display:flex;gap:80px;align-items:flex-start}
.r-dest-sticky{width:620px;flex-shrink:0}
.dest-burst{position:absolute;left:-60px;top:150px;width:760px;height:auto;max-width:none;opacity:0.85;pointer-events:none}
.dest-title{position:relative;margin:0;font:600 52px/64px var(--core);color:#fff}
.r-dest-list{flex-grow:1;min-width:0;display:flex;flex-direction:column}
.r-dest-item{cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-height:34vh;padding-bottom:24px}
.dest-row{display:flex;gap:14px;align-items:center}
.dest-key{font:600 26px/30px var(--core);color:#fff;letter-spacing:0.06em;opacity:0.42;transition:opacity 420ms ease}
.dest-body{margin-top:12px;margin-left:17px;padding-left:31px;border-left:1px solid rgba(255,255,255,0.18);display:flex;flex-direction:column;gap:12px;padding-bottom:4px;opacity:0.42;transition:border-color 420ms ease,opacity 420ms ease}
.r-dest-item.on .dest-key,.r-dest-item.on .dest-body{opacity:1}
.r-dest-item.on .dest-body{border-color:rgba(66,200,244,0.85)}
.dest-h{font:600 20px/26px var(--core);color:#fff}
.dest-p{margin:0;max-width:520px;font:400 16px/24px var(--core);color:rgba(255,255,255,0.8)}
/* why borderplus */
.why-sec{padding-top:56px;padding-bottom:96px;display:flex;flex-direction:column;gap:24px}
.sec-head{display:flex;flex-direction:column;gap:16px;align-items:center;text-align:center}
.r-eyebrow{font:500 24px/100% var(--core);color:var(--navy)}
.why-lead{margin:0;max-width:900px;font:400 22px/1.5 var(--core);color:var(--navy)}
.r-3col{display:flex;gap:40px;align-items:flex-start;justify-content:center;margin-top:24px}
.why-card{flex:0 1 340px;min-width:0;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center;padding:8px 8px 0}
.why-ico{position:relative;height:48px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ico-cyan{filter:invert(58%) sepia(84%) saturate(2200%) hue-rotate(163deg) brightness(102%) contrast(94%)}
.why-t{font:600 20px/26px var(--core);color:var(--navy);white-space:pre-line}
.why-p{margin:0;font:400 14px/22px var(--core);color:var(--navy)}
/* finishing school */
.fs-sec{padding-top:8px;padding-bottom:64px}
.r-fs-panel{border-radius:24px;background:rgb(233,248,254);box-shadow:inset 0 0 0 1px rgba(66,200,244,0.32);padding:28px 40px 32px;display:flex;flex-direction:column;gap:14px;align-items:center}
.fs-pill{border-radius:1000px;background:#fff;box-shadow:inset 0 0 0 1px rgba(66,200,244,0.55);padding:9px 20px;font:500 15px/100% var(--core);color:var(--navy)}
.fs-h2{margin:0;font:600 36px/44px var(--core);color:var(--navy);text-align:center}
.fs-lead{margin:0;max-width:760px;text-align:center;font:400 15px/23px var(--core);color:var(--navy)}
.fs-cta{margin-top:4px;border:none;cursor:pointer;border-radius:1000px;background:var(--cyan);padding:11px 28px;min-width:272px;font:500 16px/100% var(--core);color:var(--navy)}
.r-pills{display:flex;gap:80px;justify-content:center;flex-wrap:wrap;margin:10px 0 4px}
.fs-col{display:flex;flex-direction:column;gap:9px;align-items:center;text-align:center}
.fs-ico{width:52px;height:52px;border-radius:50%;background:rgb(211,238,251);display:flex;align-items:center;justify-content:center;color:var(--cyan)}
.fs-col b{font:600 15px/21px var(--core);color:var(--navy);font-weight:600}
.fs-col i{font:400 15px/21px var(--core);color:var(--navy);font-style:normal}
.fs-split{align-self:stretch;display:flex;gap:20px;align-items:stretch}
.ace-card{flex-grow:1;min-width:0;border-radius:16px;background:#fff;padding:16px 20px 14px;display:flex;flex-direction:column;gap:6px}
.ace-t{font:600 17px/23px var(--core);color:var(--navy)}
.ace-s{font:400 13px/20px var(--core);color:rgb(105,106,117)}
.ace-track{margin-top:14px;display:flex;align-items:center}
.ace-node{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px var(--cyan);display:inline-flex;align-items:center;justify-content:center;font:500 14px/100% var(--core);color:var(--navy)}
.ace-leg1{flex:0 0 96px;height:3px;background:var(--navy);border-radius:2px}
.ace-leg{flex:1;height:1.5px;background:var(--cyan);border-radius:2px}
.ace-brackets{display:flex;align-items:center;gap:10px;margin-top:10px}
.ace-br{display:flex;align-items:center;gap:8px}
.ace-br span.rule{flex:1;height:1px;background:rgba(66,200,244,0.6)}
.ace-br span.lbl{font:400 12px/16px var(--core);color:var(--navy);white-space:nowrap}
.ace-br span.lbl em{font-style:normal;color:var(--cyan)}
.ace-modes{margin-top:12px;border-radius:12px;background:rgb(240,250,255);padding:10px 8px;display:flex;align-items:center}
.ace-mode{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;font:400 13px/18px var(--core);color:var(--navy)}
.ace-div{width:1px;align-self:stretch;background:rgba(66,200,244,0.35)}
.fs-count{position:relative;flex:0 0 282px;border-radius:16px;background:rgb(211,238,251);padding:20px 22px;display:flex;flex-direction:column;gap:6px;justify-content:center}
.fs-count .bubble{position:absolute;right:20px;top:20px;width:42px;height:42px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--cyan)}
.fs-count .more{font:500 17px/24px var(--core);color:var(--navy)}
.fs-count .six{font:600 38px/42px var(--core);color:var(--navy)}
.fs-count .schools{font:500 21px/27px var(--core);color:var(--navy)}
.fs-count .desc{font:400 14px/22px var(--core);color:var(--navy)}
.ace-m{display:none;flex-direction:column;gap:14px;margin-top:14px}
.ace-m-row{display:flex;flex-direction:column;gap:6px}
.ace-m-lbls{display:flex;justify-content:space-between;font:600 13px/16px var(--core);color:var(--navy)}
.ace-m-line{display:flex;height:4px;border-radius:2px;overflow:hidden}
.ace-m-line i{display:block;height:100%}
.ace-m-line i.dark{flex:0 0 34%;background:var(--navy)}
.ace-m-line i.cy{flex:1;background:var(--cyan)}
.ace-m-cap{display:flex;align-items:center;gap:8px}
.ace-m-cap .rule{flex:1;height:1px;background:rgba(66,200,244,0.6)}
.ace-m-cap .lbl{font:400 12px/16px var(--core);color:var(--navy);white-space:nowrap}
.ace-m-cap .lbl em{font-style:normal;color:var(--cyan)}
/* recruiters */
.rec-sec{padding-top:20px;padding-bottom:96px}
.rec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:48px}
.rec-pill{display:inline-flex;padding:10px 24px;border-radius:1000px;background:rgb(228,246,254);font:500 16px/20px var(--core);color:var(--navy)}
.rec-h2{margin:20px 0 0;font:600 56px/68px var(--core);color:var(--navy)}
.rec-side{max-width:500px;display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.rec-lead{margin:0;font:500 20px/1.45 var(--core);color:var(--navy)}
.rec-cards{display:flex;gap:28px;margin-top:48px}
.rec-card{flex:1;min-width:0;border-radius:16px;background:linear-gradient(180deg,rgb(38,33,133) 0%,rgb(15,17,52) 100%);padding:40px 36px 44px;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center}
.rec-card b{font:600 22px/30px var(--core);color:#fff;max-width:320px;font-weight:600}
.rec-card p{margin:0;font:400 15px/23px var(--core);color:rgba(255,255,255,0.85);max-width:330px}
.ral-band{margin-top:36px;border-radius:20px;background:rgb(217,240,252);padding:36px 40px;display:flex;align-items:center;gap:40px}
.ral-logos{display:flex;gap:20px;flex-shrink:0}
.ral-tile{width:132px;height:132px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;padding:12px;box-sizing:border-box}
.ral-t{font:600 26px/34px var(--core);color:var(--navy)}
.ral-p{margin:12px 0 0;font:400 15px/24px var(--core);color:var(--navy)}
/* nurseplus */
.np-sec{padding-top:24px;padding-bottom:96px;display:flex;flex-direction:column;gap:44px;align-items:center}
.np-eyebrow{font:500 22px/28px var(--core);color:var(--navy)}
.np-lead{margin:0;max-width:640px;font:400 20px/1.5 var(--core);color:var(--navy)}
.np-cta{margin-top:12px;border:none;cursor:pointer;border-radius:1000px;background:var(--navy);padding:13px 44px;font:500 15px/100% var(--core);color:rgb(188,234,251)}
.r-phones{width:100%;max-width:1180px;display:flex;align-items:stretch;justify-content:center;gap:36px}
.np-col{width:30%;display:flex;flex-direction:column;align-items:center}
.np-col.mid{width:30%}
.np-panel{align-self:stretch;border-radius:20px;background:linear-gradient(180deg,rgb(211,238,251) 0%,rgb(236,249,255) 100%);overflow:hidden;display:flex;align-items:flex-end;justify-content:center;height:540px}
.np-panel img{height:96%;width:auto;max-width:none;display:block;object-fit:contain}
.np-tag{margin-top:-22px;border-radius:10px;background:#fff;box-shadow:0 8px 20px -4px rgba(12,12,13,0.18);padding:12px 36px;display:flex;align-items:center;gap:10px;font:600 17px/22px var(--core);color:var(--navy);position:relative;z-index:1}
.np-stats{width:100%;max-width:1180px;margin:8px auto 0;display:flex;gap:36px;flex-wrap:wrap}
.np-stat{width:30%;display:flex;align-items:center;justify-content:center;gap:10px}
.np-stat .num{font:600 32px/38px var(--core);color:var(--navy)}
.np-stat .lbl{font:400 16px/22px var(--core);color:var(--navy)}
.np-stat>div{display:flex;flex-direction:column;gap:4px;align-items:center}
/* success stories */
.ss-sec{background:rgb(232,249,255);padding-top:28px;padding-bottom:40px;display:flex;flex-direction:column;gap:20px;align-items:center;min-height:100vh;justify-content:center;box-sizing:border-box}
.ss-pill{display:inline-flex;padding:12px 32px;border-radius:100px;background:rgb(246,252,255);box-shadow:inset 0 0 0 1px rgb(140,209,231);font:500 24px/30px var(--core);color:var(--navy)}
.ss-carousel{position:relative;width:100%;height:clamp(280px,30vw,460px)}
.ss-line{position:absolute;left:0;right:0;top:50%;border-top:1.5px dashed rgb(66,200,244);opacity:0.7;z-index:1}
.ss-x{position:absolute;top:50%;transform:translate(-50%,-50%);z-index:2}
.ss-x-l{left:calc(50% - 23.6%)}
.ss-x-r{left:calc(50% + 23.6%)}
.ss-card{position:absolute;top:50%;left:50%;width:45%;max-width:860px;aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:var(--navy);transform:translate(-50%,-50%);transition:left 600ms cubic-bezier(0.4,0,0.2,1),transform 600ms cubic-bezier(0.4,0,0.2,1),width 600ms cubic-bezier(0.4,0,0.2,1),box-shadow 600ms ease;cursor:pointer;z-index:1}
.ss-card.snap{transition:none}
.ss-card img,.ss-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ss-card.c{z-index:3;box-shadow:0 24px 48px -12px rgba(12,12,13,0.28);cursor:default}
.ss-card.l{width:33%;left:0;transform:translate(-26%,-50%);z-index:2}
.ss-card.r{width:33%;left:100%;transform:translate(-74%,-50%);z-index:2}
.vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;background:var(--navy);box-shadow:0 0 0 6px rgba(10,9,54,0.35);display:flex;align-items:center;justify-content:center;transition:opacity 300ms ease}
.vid-play i{width:0;height:0;border-left:16px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;margin-left:4px;display:block}
.ss-card.c .vid-play{opacity:0;pointer-events:none}
.ss-bar{position:absolute;left:24px;right:24px;bottom:18px;display:none;align-items:center;gap:14px;z-index:4}
.ss-card.c .ss-bar{display:flex}
.ss-pp{border:none;background:none;padding:0;cursor:pointer;width:18px;height:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ss-pp .pp-pause{display:flex;gap:4px}
.ss-pp .pp-pause i{width:4px;height:16px;background:#fff;border-radius:1px;display:block}
.ss-pp .pp-play{width:0;height:0;border-left:14px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent;display:none}
.ss-pp.paused .pp-pause{display:none}
.ss-pp.paused .pp-play{display:block}
.ss-track{width:42%;height:7px;border-radius:100px;background:rgba(255,255,255,0.35)}
.ss-fill{height:100%;width:0;border-radius:100px;background:#fff}
.ss-nav{display:flex;align-items:center;gap:20px}
.ss-arrow{width:40px;height:40px;border-radius:50%;border:1.2px solid var(--navy);background:none;color:var(--navy);cursor:pointer;display:flex;align-items:center;justify-content:center}
.ss-arrow:hover{background:rgba(10,9,54,0.06)}
.vid-dots{display:flex;gap:8px;align-items:center}
.vid-dots span{width:7px;height:7px;border-radius:1000px;background:rgb(140,209,231);cursor:pointer;transition:width 300ms ease,background 300ms ease}
.vid-dots span.on{width:104px;background:rgb(102,205,243)}
@media (max-width:1024px){.ss-card{width:72%}.ss-card.l{transform:translate(-62%,-50%)}.ss-card.r{transform:translate(-38%,-50%)}.ss-x{display:none}}
/* testimonials */
.tm-sec{position:relative;padding-top:56px;padding-bottom:96px;display:flex;flex-direction:column;gap:48px;align-items:center}
/* decorative burst: sits behind the section, its lower edge meeting the Job boards card below */
.tm-burst{position:absolute;left:0;bottom:-260px;width:447px;height:auto;max-width:none;pointer-events:none;z-index:0}
.tm-sec>.sec-head,.tm-sec>.r-quotes{position:relative;z-index:1}
.r-quotes{position:relative;align-self:stretch;border-radius:16px;background:rgb(240,250,255);padding:48px 88px;display:flex;gap:64px;justify-content:center}
.tm-q{position:relative;display:flex;flex-direction:column;gap:40px;align-items:center;text-align:center;flex:1;max-width:320px;padding:20px 12px}
.tm-q p{margin:0;font:400 15px/23px var(--core);color:rgb(41,41,41)}
.tm-qp{position:relative;padding:14px 26px}
.tm-q .qo,.tm-q .qc{position:absolute;font:700 56px/1 var(--serif,Georgia,serif);color:rgb(160,216,244);opacity:1}
.tm-q .qo{left:-8px;top:-6px}
.tm-q .qc{right:-8px;bottom:-6px;transform:rotate(180deg)}
/* thin blue rule between adjacent quotes, matching the reference */
.tm-q + .tm-q::before{content:"";position:absolute;left:-32px;top:8px;bottom:8px;width:1px;background:rgb(197,229,246)}
.tm-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:rgb(24,26,42);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.tm-arrow:hover{background:var(--navy)}
.tm-arrow.prev{left:20px;background:rgb(102,205,243);color:rgb(18,22,64)}
.tm-arrow.prev:hover{background:rgb(66,200,244)}
.tm-arrow.next{right:20px}
@media (max-width:1024px){.r-quotes{flex-direction:column;align-items:center;padding:48px 56px}.tm-arrow.prev{left:8px}.tm-arrow.next{right:8px}}
.tm-who{display:flex;gap:16px;align-items:center;margin-top:auto}
.tm-who img{width:50px;height:50px;border-radius:50%;object-fit:cover}
.tm-who b{font:600 16px/100% var(--core);color:rgb(41,41,41);display:block}
.tm-who small{font:400 14px/100% var(--core);color:var(--navy)}
/* comparison */
.cmp-sec{position:relative;z-index:1;padding-bottom:96px;display:flex;flex-direction:column;gap:48px;align-items:center}
.r-cmp{width:100%;display:flex;gap:32px;align-items:flex-start;justify-content:center}
.cmp-card{width:411px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px rgb(220,220,220);padding:32px 0;display:flex;flex-direction:column;gap:32px;box-sizing:border-box}
.cmp-card.hero-card{background:rgb(225,244,253);box-shadow:inset 0 0 0 2px var(--navy),0 16px 32px -4px rgba(12,12,13,0.1),0 4px 4px -4px rgba(12,12,13,0.05)}
.cmp-title{height:40px;display:flex;align-items:center;justify-content:center;font:500 24px/1 var(--core);color:rgb(105,106,117);gap:12px}
.cmp-title.bp{font:600 24px/1 var(--core);color:var(--navy)}
.cmp-h{display:flex;gap:24px;align-items:center;min-height:64px;margin:0 1px;padding:12px 32px;background:rgba(12,12,13,0.03);font:400 16px/24px var(--core);color:rgb(14,79,108)}
.hero-card .cmp-h{background:rgb(240,250,255);margin:0 2px}
.cmp-rows{display:flex;flex-direction:column;gap:24px}
.cmp-row{display:flex;gap:16px;align-items:flex-start;padding:0 32px;font:400 16px/24px var(--core);color:rgb(41,41,41)}
.cmp-row img{flex-shrink:0;filter:invert(58%) sepia(84%) saturate(2200%) hue-rotate(163deg) brightness(102%) contrast(94%)}
.cmp-h img{filter:invert(58%) sepia(84%) saturate(2200%) hue-rotate(163deg) brightness(102%) contrast(94%)}
.cmp-h-bare{min-height:64px;background:rgb(225,244,253)}
.cmp-join{padding:0 32px}
.cmp-join .bp-btn{width:100%;gap:10px}
.cmp-join .bp-arrow-disc{width:26px;height:26px;border-radius:50%;background:var(--cyan);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.cmp-m{display:none;width:100%;flex-direction:column;gap:0}
.cmp-m-tabs{display:flex;align-items:stretch;gap:0;border-bottom:1px solid rgb(206,224,238);margin:14px 0 4px}
.cmp-m-tab{flex:1;min-width:0;background:none;border:none;padding:12px 4px;font:500 13px/16px var(--core);color:rgb(105,106,117);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;border-bottom:2px solid transparent;margin-bottom:-1px}
.cmp-m-tab.on{color:var(--navy);font-weight:600;border-bottom-color:var(--cyan)}
.cmp-m-body{display:flex;flex-direction:column;gap:18px;padding-top:6px}
.cmp-m-body .cmp-h{border-radius:10px;padding:12px 16px;background:rgb(240,250,255);border:1px solid rgb(178,219,240);font-size:14px}
.cmp-m-body .cmp-row{padding:0;font-size:14px;line-height:21px;gap:12px}
.cmp-m-body .cmp-row img{width:20px;height:20px}
.cmp-m-body .cmp-join{padding:0}
/* articles */.art-sec{padding-bottom:96px;display:flex;flex-direction:column;gap:32px;align-items:center}
.r-articles{width:100%;display:flex;gap:24px;justify-content:center}
.art-card{width:410.667px;height:492px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px rgb(220,220,220);padding:16px;display:flex;flex-direction:column;gap:16px;box-sizing:border-box}
.art-card>img{height:240px;border-radius:8px;object-fit:cover;width:100%;flex-shrink:0}
.art-body{padding:8px;display:flex;flex-direction:column;gap:20px;flex-grow:1}
.art-badge{display:inline-flex;align-self:flex-start;padding:4px 10px;border-radius:6px;background:rgb(225,244,253);font:500 14px/20px var(--core);color:rgb(19,176,228)}
.art-t{font:500 24px/100% var(--core);color:rgb(24,26,42)}
.art-meta{margin-top:auto;display:flex;justify-content:space-between;align-items:center}
.art-author{display:flex;align-items:center;gap:10px;font:500 16px/100% var(--core);color:rgb(24,26,42)}
.art-author img{width:36px;height:36px;border-radius:50%;object-fit:cover}
.art-date{font:400 14px/100% var(--core);color:rgb(151,152,159)}
.art-prog{display:none;width:140px;height:5px;border-radius:100px;background:rgb(214,240,252);overflow:hidden}
.art-prog span{display:block;height:100%;width:33%;border-radius:100px;background:var(--cyan);transition:width 120ms linear,margin-left 120ms linear}
/* faq */
.faq-sec{padding-bottom:96px;display:flex;flex-direction:column;gap:48px}
.r-faq{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.faq-col{display:flex;flex-direction:column;gap:12px;min-width:0}
.faq-item{background:#fff;border-radius:10px;box-shadow:inset 0 0 0 1px rgb(206,224,238);padding:14px 18px}
.faq-q{width:100%;background:none;border:none;padding:0;display:flex;gap:16px;align-items:flex-start;justify-content:space-between;cursor:pointer;text-align:left;font:600 15px/1.4 var(--core);color:var(--navy)}
.faq-q img{flex-shrink:0;transition:transform 250ms ease}
.faq-item.open .faq-q img{transform:rotate(180deg)}
.faq-a{display:none;margin:10px 0 0;font:400 13px/20px var(--core);color:rgb(90,96,110)}
.faq-item.open .faq-a{display:block}
/* footer */
.r-footer{background:var(--navy-750);display:flex;flex-direction:column;gap:32px;align-items:center;padding:64px 80px;box-sizing:border-box}
.r-footer-cols{width:100%;max-width:1062px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.f-col{display:flex;flex-direction:column;gap:24px;flex-grow:1}
.f-col>span{font:500 16px/24px var(--core);color:var(--periwinkle-400)}
.f-links{display:flex;flex-direction:column;gap:12px}
.f-links a,.f-links span{font:400 14px/100% var(--core);color:var(--white)}
.f-social{display:flex;gap:16px;color:var(--white)}
.r-footer-base{width:100%;max-width:1062px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;align-items:center;padding-top:32px;border-top:1px solid rgb(66,200,244)}
.r-footer-base img{grid-column:1;height:38px;width:auto}
.r-footer-base span{grid-column:4;text-align:left}
.r-footer-base span{font:400 14px/100% var(--core);color:var(--white)}
.f-mob{display:none;width:100%;flex-direction:column;gap:34px}
.f-mob-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.f-mob-block{display:flex;flex-direction:column;gap:16px}
.f-mob-h{font:500 16px/22px var(--core);color:var(--periwinkle-400)}
.f-loc{display:flex;flex-direction:column;gap:4px}
.f-loc b{font:600 13px/18px var(--core);color:var(--white)}
.f-loc span{font:400 11px/16px var(--core);color:rgba(255,255,255,0.72)}
.f-mob-base{display:flex;flex-direction:column;gap:16px;padding-top:26px;border-top:1px solid rgba(66,200,244,0.45)}
.f-mob-base img{height:34px;width:auto;align-self:flex-start}
.f-mob-base span{font:400 13px/100% var(--core);color:var(--white)}
@media (max-width:1024px){
  .rec-head{flex-direction:column;align-items:flex-start}
  .rec-cards,.fs-split{flex-direction:column}
  .np-col,.np-col.mid{width:80%}
  .r-phones{flex-direction:column;align-items:center}
  .r-cmp{flex-direction:column;align-items:center}
  .r-faq{grid-template-columns:1fr;gap:16px}
  .ral-band{flex-direction:column;align-items:flex-start}
  .r-nav,.hdr-cta{display:none}
  .r-burger{display:flex}
}

/* ── >= 1600 (1920 desks): keep both columns filling the grid ── */
@media (min-width:1600px){
  .r-hero{column-gap:80px;grid-template-columns:minmax(0,780px) minmax(0,1fr)}
  .r-hero-copy{width:780px}
  .r-lead{width:100%;max-width:700px}
  .r-hero-side{margin-left:auto;margin-right:0}
  .r-dest-sticky{width:700px}
  .dest-h{font-size:22px;line-height:28px}
  .dest-p{max-width:none;font-size:18px;line-height:28px}
  .dest-body{padding-right:40px}
}

/* ── >= 1920: let the frame grow with the screen instead of capping content at 1820 ── */
@media (min-width:1920px){
  .r-sec,.r-sec-80{padding-left:min(6vw,220px);padding-right:min(6vw,220px)}
  .r-header{padding-left:min(6vw,220px)!important;padding-right:min(6vw,220px)!important}
  .r-footer{padding-left:min(6vw,220px)!important;padding-right:min(6vw,220px)!important}
  .r-hero{grid-template-columns:minmax(0,860px) minmax(0,1fr)}
  .r-hero-copy{width:860px}
  .r-hero-copy p,.r-lead{width:100%;max-width:780px}
  .dest-body{padding-right:0}
  .dest-p{max-width:none}
  .r-dest-list{padding-right:60px}
}

@media (prefers-reduced-motion:reduce){.r-hero-slot,.r-hero-face,.r-hero-blob img{transition:none!important}.plate-body{animation:none!important}}

/* first destination row starts at the top so GERMANY lines up with the section title */
.r-dest-item:first-child{justify-content:flex-start}

/* taller hero on full-screen desks */
@media (min-width:1600px){
  .hero-sec{padding-top:72px;padding-bottom:56px}
}
@media (min-width:1920px){
  .hero-sec{padding-top:80px;padding-bottom:64px}
}

/* full-screen: drop the whole hero visual so the centre figure's head clears the banner top */
@media (min-width:1600px){.r-hero-side{margin-top:88px}}
@media (min-width:1920px){.r-hero-side{margin-top:112px}}
/* below ~1366 the grid leaves the right flank figure short of the viewport edge — nudge the whole art group inboard so both flanks read symmetrically */
@media (max-width:1366px){.r-hero-side{margin-left:-40px}}
@media (max-width:1024px){.r-hero-side{margin-left:auto!important;margin-right:auto!important}}

/* tighter destination rows — 34vh left too much air under each block */
.r-dest-item{min-height:24vh;padding-bottom:16px}