/* Vivid Smiles · Identity & site by Business Brother · v2 */

@font-face { font-family:"Vivid Serif"; src:url("../fonts/times.ttf") format("truetype"); font-weight:400; font-display:swap; }
@font-face { font-family:"Vivid Serif"; font-style:italic; font-weight:400; src:local("Times New Roman Italic"), local("TimesNewRomanPS-ItalicMT"), local("Times Italic"); font-display:swap; }
@font-face { font-family:"Vivid Serif"; font-style:italic; font-weight:700; src:local("Times New Roman Bold Italic"), local("TimesNewRomanPS-BoldItalicMT"), local("Times Bold Italic"); font-display:swap; }
@font-face { font-family:"Vivid Serif"; font-weight:700; src:local("Times New Roman Bold"), local("TimesNewRomanPS-BoldMT"), local("Times Bold"); font-display:swap; }
@font-face { font-family:"Poppins"; src:url("../fonts/Poppins-ExtraLight.ttf") format("truetype"); font-weight:200; font-display:swap; }
@font-face { font-family:"Poppins"; src:url("../fonts/Poppins-Light.ttf") format("truetype"); font-weight:300; font-display:swap; }
@font-face { font-family:"Poppins"; src:url("../fonts/Poppins-LightItalic.ttf") format("truetype"); font-weight:300; font-style:italic; font-display:swap; }
@font-face { font-family:"Poppins"; src:url("../fonts/Poppins-Regular.ttf") format("truetype"); font-weight:400; font-display:swap; }
@font-face { font-family:"Poppins"; src:url("../fonts/Poppins-Italic.ttf") format("truetype"); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:"Poppins"; src:url("../fonts/Poppins-Medium.ttf") format("truetype"); font-weight:500; font-display:swap; }
@font-face { font-family:"Poppins"; src:url("../fonts/Poppins-SemiBold.ttf") format("truetype"); font-weight:600; font-display:swap; }

:root {
  --navy:#212730;
  --navy-deep:#1a1f27;
  --lav:#F5F6FD;
  --mauve:#C2B8B7;
  --charcoal:#383935;
  --blue:#2D92C9;
  --cream:#F4EDE8;
  --camel:#A38972;
  --olive:#41423C;
  --ink:#171717;
  --serif:"Vivid Serif", "Times New Roman", Times, serif;
  --sans:"Poppins", sans-serif;
  --pad:clamp(24px, 5vw, 72px);
  --ease:cubic-bezier(.22,1,.36,1);
}

* { margin:0; padding:0; box-sizing:border-box; }
::selection { background:var(--blue); color:#fff; }
html { scroll-behavior:smooth; }
body { font-family:var(--sans); color:var(--navy); background:var(--lav); line-height:1.75; font-size:16px; -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:inherit; }

.wrap { max-width:1440px; margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }

/* ---------------- reveal animations ---------------- */
.rv { opacity:0; transform:translateY(36px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.rv.in { opacity:1; transform:none; }
.rv.d1 { transition-delay:.12s; } .rv.d2 { transition-delay:.24s; } .rv.d3 { transition-delay:.36s; }
@media (prefers-reduced-motion: reduce) { .rv { opacity:1; transform:none; transition:none; } }

/* ---------------- header ---------------- */
header {
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .4s var(--ease), box-shadow .4s var(--ease), transform .45s var(--ease);
}
header.scrolled { background:rgba(245,246,253,.92); backdrop-filter:blur(12px); box-shadow:0 1px 0 rgba(33,39,48,.08); }
header.hidden { transform:translateY(-100%); }
.nav { display:flex; align-items:center; justify-content:space-between; height:84px; padding:0 var(--pad); max-width:1440px; margin:0 auto; }
.nav-logo img { height:44px; width:auto; transition:opacity .3s; }
.nav-logo .logo-light { display:block; }
.nav-logo .logo-dark { display:none; }
header.scrolled .logo-light { display:none; }
header.scrolled .logo-dark { display:block; }
.nav-links { display:flex; align-items:center; gap:40px; list-style:none; }
.nav-links a { text-decoration:none; font-size:12px; font-weight:400; letter-spacing:.16em; text-transform:uppercase; color:var(--lav); position:relative; padding:4px 0; }
.nav-links a:after { content:""; position:absolute; left:0; bottom:0; height:1px; width:0; background:currentColor; transition:width .35s var(--ease); }
.nav-links a:hover:after, .nav-links a.active:after { width:100%; }
header.scrolled .nav-links a { color:var(--navy); }
.nav-links a.nav-cta {
  border:1px solid rgba(245,246,253,.5); border-radius:40px; padding:12px 26px;
  transition:background .3s, color .3s, border-color .3s;
}
.nav-links a.nav-cta:after { display:none; }
.nav-links a.nav-cta:hover { background:var(--lav); color:var(--navy); border-color:var(--lav); }
header.scrolled .nav-links a.nav-cta { border-color:var(--navy); color:var(--navy); }
header.scrolled .nav-links a.nav-cta:hover { background:var(--navy); color:var(--lav); }
.nav-burger { display:none; background:none; border:none; cursor:pointer; padding:10px; z-index:110; }
.nav-burger span { display:block; width:26px; height:1.5px; background:var(--lav); margin:6px 0; transition:.3s var(--ease); }
header.scrolled .nav-burger span { background:var(--navy); }

/* ---------------- buttons ---------------- */
.btn {
  display:inline-flex; align-items:center; gap:12px; text-decoration:none;
  font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase;
  padding:18px 38px; border-radius:60px; transition:all .35s var(--ease); position:relative; overflow:hidden;
}
.btn .arr { transition:transform .35s var(--ease); }
.btn:hover .arr { transform:translateX(6px); }
.btn-light { background:var(--lav); color:var(--navy); }
.btn-light:hover { background:var(--blue); color:#fff; }
.btn-dark { background:var(--navy); color:var(--lav); }
.btn-dark:hover { background:var(--blue); color:#fff; }
.btn-ghost { border:1px solid rgba(245,246,253,.45); color:var(--lav); }
.btn-ghost:hover { border-color:var(--lav); background:var(--lav); color:var(--navy); }

/* ---------------- type ---------------- */
h1,h2 { font-family:var(--serif); font-weight:400; line-height:0.98; letter-spacing:-0.008em; font-variant-ligatures:none; font-feature-settings:"liga" 0, "clig" 0, "dlig" 0; }
h1 em, h2 em, .quote .q em { font-weight:700; }
.kf { letter-spacing:.055em; }
h3 { font-family:var(--sans); font-weight:600; line-height:1.3; }
em { font-style:italic; }
.label { font-size:10.5px; font-weight:600; letter-spacing:.3em; text-transform:uppercase; color:var(--blue); display:flex; align-items:center; gap:12px; }
.label:before { content:""; width:24px; height:11px; background:url("../img/arc-blue.png") no-repeat center / contain; }
.label.no-arc:before { display:none; }
.display { font-size:clamp(46px, 7.6vw, 112px); line-height:0.95; }
.title-xl { font-size:clamp(36px, 4.8vw, 68px); }
.title-lg { font-size:clamp(30px, 3.6vw, 50px); line-height:1.05; }
.lead-serif { font-family:var(--sans); font-weight:300; font-size:clamp(20px, 1.8vw, 28px); line-height:1.68; }
.body-lg { font-weight:300; font-size:18px; line-height:1.95; color:#494e58; }
.body-sm { font-size:14.5px; line-height:1.85; color:#5a5f6a; }
.on-dark .body-lg, .on-dark .body-sm { color:#b9bfcb; }

/* ---------------- hero ---------------- */
.hero {
  min-height:100svh; background:var(--navy); color:var(--lav);
  display:flex; flex-direction:column; justify-content:flex-end;
  position:relative; overflow:hidden; padding-bottom:clamp(48px,7vh,90px);
}
.hero-bg { position:absolute; inset:0; background:url("../img/hero.jpg") center / cover no-repeat; }
.hero-bg:after { content:""; position:absolute; inset:0; background:linear-gradient(78deg, rgba(33,39,48,.96) 8%, rgba(33,39,48,.78) 48%, rgba(33,39,48,.42) 100%); }
.hero-arc { position:absolute; inset:0; pointer-events:none; }
.hero-arc img { position:absolute; width:44%; max-width:880px; left:auto; right:6%; top:9%; clip-path:inset(0 100% 0 0); }
.draw img { animation:wipe 2.2s var(--ease) .45s forwards; }
@keyframes wipe { to { clip-path:inset(0 0 0 0); } }
.hero-inner { position:relative; }
.hero .wrap, .page-hero .wrap { max-width:none; margin:0; }
.hero .label { color:#7fb8dc; margin-bottom:28px; }
.hero h1 { margin-bottom:48px; }
.hero h1 .line { display:block; overflow:hidden; padding-bottom:.09em; margin-bottom:-.09em; }
.hero h1 .line > span { display:block; transform:translateY(110%); animation:rise 1.1s var(--ease) forwards; }
.hero h1 .line:nth-child(2) > span { animation-delay:.15s; }
.hero h1 .line:nth-child(3) > span { animation-delay:.3s; }
@keyframes rise { to { transform:none; } }
.hero-foot { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap; padding-right:clamp(70px,7vw,130px); }
.hero-foot p { max-width:560px; font-weight:300; font-size:16.5px; color:#c3c9d4; }
.hero-cta { display:flex; gap:14px; flex-wrap:wrap; }
.scroll-hint {
  position:absolute; right:var(--pad); bottom:clamp(40px,6vh,72px);
  font-size:10.5px; letter-spacing:.3em; text-transform:uppercase; color:#8b93a3;
  writing-mode:vertical-rl; display:flex; align-items:center; gap:14px;
}
.scroll-hint:after {
  content:""; width:1.5px; height:60px; background:linear-gradient(#7fb8dc, #2D92C9);
  animation:scrolldown 2.4s var(--ease) infinite;
}
@keyframes scrolldown {
  0%   { clip-path:inset(0 0 100% 0); }
  45%  { clip-path:inset(0 0 0 0); }
  100% { clip-path:inset(100% 0 0 0); }
}
@media (prefers-reduced-motion: reduce) { .scroll-hint:after { animation:none; clip-path:none; } }

@media (max-width:1100px){ .bk { display:none; } }


/* home hero: thin vector arc, continuous draw */
.hero-arc svg.arc-line { position:absolute; width:44%; max-width:880px; right:6%; top:9%; overflow:visible; }
.hero-arc svg.arc-line path {
  stroke-dasharray:1090;
  animation:drawloop 7s cubic-bezier(.45,.05,.55,.95) .4s infinite;
}
@keyframes drawloop {
  0%   { stroke-dashoffset:1090; }
  46%  { stroke-dashoffset:0; }
  54%  { stroke-dashoffset:0; }
  100% { stroke-dashoffset:-1090; }
}
@media (prefers-reduced-motion: reduce) { .hero-arc svg.arc-line path { animation:none; stroke-dashoffset:0; } }

/* ---------------- marquee ---------------- */
.marquee { background:var(--lav); border-bottom:1px solid rgba(33,39,48,.08); overflow:hidden; padding:30px 0; }
.marquee-track { display:flex; width:max-content; animation:scroll 36s linear infinite; }
.marquee span { font-family:var(--sans); font-weight:200; font-size:clamp(15px,1.4vw,19px); letter-spacing:.06em; white-space:nowrap; padding-right:clamp(48px,5vw,88px); }

@keyframes scroll { to { transform:translateX(-50%); } }

/* ---------------- sections ---------------- */
section { padding:clamp(96px, 11.5vw, 185px) 0; }
.divider { display:flex; justify-content:center; padding-top:clamp(72px,9vw,140px); }
.divider img { width:54px; opacity:.85; }
.bg-white { background:#fff; }
.bg-cream { background:var(--cream); }
.bg-navy { background:var(--navy); color:var(--lav); }
.bg-mauve { background:var(--mauve); }

/* editorial two-col: sticky label left, content right */
.ed-grid { display:grid; grid-template-columns:minmax(180px,1fr) 2.2fr; gap:clamp(32px,5vw,100px); align-items:start; }
.ed-side { position:sticky; top:120px; }
.ed-side .idx { font-family:var(--sans); font-weight:500; font-size:12px; letter-spacing:.1em; color:var(--blue); display:block; margin-top:12px; }

/* stat hairline row */
.stats { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(33,39,48,.14); margin-top:clamp(48px,6vw,88px); }
.stats > div { padding:32px 28px 0 0; border-right:1px solid rgba(33,39,48,.14); }
.stats > div:last-child { border-right:0; }
.stats > div + div { padding-left:28px; }
.stats .n { font-family:var(--sans); font-weight:300; font-size:clamp(40px,3.8vw,56px); line-height:1; }
.stats .l { font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#6d7280; margin-top:14px; }
.on-dark .stats { border-color:rgba(245,246,253,.16); }
.on-dark .stats > div { border-color:rgba(245,246,253,.16); }
.on-dark .stats .l { color:#8b93a3; }

/* ---------------- service rows ---------------- */
.rows { border-top:1px solid rgba(33,39,48,.14); }
.row-item {
  display:grid; grid-template-columns:70px 1.25fr 1.6fr 60px; gap:28px; align-items:center;
  padding:30px 8px; border-bottom:1px solid rgba(33,39,48,.14); text-decoration:none;
  position:relative; transition:padding .35s var(--ease);
}
.row-item .no { font-family:var(--sans); font-weight:500; font-size:12px; letter-spacing:.1em; color:var(--blue); }
.row-item .nm { font-family:var(--sans); font-weight:300; font-size:clamp(19px,1.8vw,25px); line-height:1.3; transition:transform .35s var(--ease); }
.row-item .ds { font-weight:300; font-size:14.5px; color:#5a5f6a; max-width:460px; }
.row-item .go { font-size:22px; justify-self:end; transition:transform .35s var(--ease); color:var(--navy); }
.row-item:hover { padding-left:22px; }
.row-item:hover .go { transform:translateX(8px); color:var(--blue); }
.row-item:hover .nm em, .row-item:hover .nm { color:var(--navy); }
.rows.on-dark { border-color:rgba(245,246,253,.16); }
.rows.on-dark .row-item { border-color:rgba(245,246,253,.16); }
.rows.on-dark .row-item .ds { color:#8b93a3; }
.rows.on-dark .row-item .go { color:var(--lav); }

/* ---------------- media / placeholders ---------------- */
.ph {
  border-radius:2px; overflow:hidden; position:relative;
  background:linear-gradient(160deg, var(--mauve) 0%, var(--cream) 100%);
  display:flex; align-items:center; justify-content:center; min-height:380px;
}
.ph.tall { min-height:min(72vh, 640px); }
.ph.navy { background:linear-gradient(160deg, var(--navy-deep), var(--olive)); }
.ph .ph-label {
  font-size:10px; font-weight:600; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(33,39,48,.5); border:1px dashed rgba(33,39,48,.3); border-radius:40px; padding:10px 22px; z-index:2;
}
.ph.navy .ph-label { color:rgba(245,246,253,.55); border-color:rgba(245,246,253,.3); }
.ph img.smile { position:absolute; width:52%; opacity:.45; }
.ph img.ph-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.m-photo .ph img.ph-img { object-position:center 30%; }


/* split feature */
.split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,110px); align-items:center; }

/* ---------------- pull quote ---------------- */
.quote { text-align:center; background:linear-gradient(160deg, var(--mauve) 0%, var(--cream) 100%); }
.quote .q {
  font-family:var(--serif); font-weight:400; font-style:normal; color:#ffffff;
  font-size:clamp(30px, 4.2vw, 58px); line-height:1.22; max-width:1000px; margin:0 auto;
}
.quote .q em { font-style:italic; }
.quote .attr { margin-top:34px; font-size:11.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--blue); }

/* ---------------- team ---------------- */
.member { display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(36px,5vw,90px); align-items:center; padding:clamp(48px,6vw,80px) 0; border-top:1px solid rgba(33,39,48,.14); }
.member:nth-child(even) { grid-template-columns:1.2fr 1fr; }
.member:first-of-type { border-top:0; padding-top:0; }
.member:nth-child(even) .m-photo { order:2; }
.m-photo .ph { aspect-ratio:3/4; min-height:0; }
.m-body .cred { font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--blue); font-weight:500; margin:14px 0 24px; }
.m-body h3 { font-size:clamp(22px,2.2vw,30px); font-weight:600; line-height:1.25; }
.m-body p { font-weight:300; font-size:14.5px; color:#494e58; line-height:1.85; }
.m-body p + p { margin-top:14px; }
.member { align-items:start; }
.member .m-photo { position:sticky; top:110px; }

.mini-team { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,28px); max-width:860px; }
.mini-member { background:#fff; border:1px solid rgba(33,39,48,.08); border-radius:2px; padding:28px 26px; }
.mini-member h3 { font-size:19px; margin-bottom:4px; }
.mini-member .cred { font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--blue); font-weight:500; }
@media (max-width:720px){ .mini-team { grid-template-columns:1fr; } }

/* ---------------- contact ---------------- */
.c-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(28px,4vw,64px); }
.c-block { border-top:1px solid var(--navy); padding-top:26px; }
.c-block h3 { font-size:13px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; margin-bottom:12px; }
.c-block p, .c-block a { font-size:15px; color:#494e58; text-decoration:none; line-height:2; }
.c-block a:hover { color:var(--blue); }
.hours { width:100%; border-collapse:collapse; font-size:14px; }
.hours td { padding:10px 0; border-bottom:1px solid rgba(33,39,48,.1); color:#494e58; }
.hours td:last-child { text-align:right; }
.map-frame { border:0; width:100%; height:460px; display:block; filter:grayscale(1) contrast(1.04); }

/* ---------------- booking ---------------- */
.booking-bar { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; font-size:13px; color:#5a5f6a; padding:14px 20px; background:var(--lav); border-radius:2px; margin-bottom:18px; }
.booking-bar a { color:var(--blue); font-weight:500; text-decoration:none; }
.booking-shell { position:relative; min-height:640px; }
.booking-frame { border:0; width:100%; height:1400px; background:#fff; position:relative; z-index:1; opacity:0; pointer-events:none; transition:opacity .5s var(--ease); }
.booking-fallback { position:absolute; inset:0 0 auto 0; z-index:5; height:640px; display:none; flex-direction:column; align-items:center; justify-content:center; gap:26px; text-align:center; }
.booking-fallback p { font-size:16px; color:#494e58; font-weight:300; }
.booking-loading { position:absolute; inset:0 0 auto 0; z-index:3; pointer-events:none; height:640px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; color:#5a5f6a; font-size:14px; font-weight:300; }
.pulse-arc { width:64px; animation:arcpulse 1.6s var(--ease) infinite; }
@keyframes arcpulse { 0%,100% { opacity:.35; transform:scale(.96); } 50% { opacity:1; transform:scale(1); } }

/* ---------------- page hero (inner) ---------------- */
.page-hero {
  background:var(--navy); color:var(--lav); position:relative; overflow:hidden;
  padding:190px 0 clamp(60px,8vw,104px);
}
.page-hero .label { color:#7fb8dc; margin-bottom:28px; }
.page-hero h1 { font-size:clamp(40px, 5.6vw, 84px); margin-bottom:28px; }
.page-hero p { max-width:560px; color:#aeb4c0; font-size:16.5px; }
.page-hero .hero-arc svg.arc-line { right:5%; top:18%; width:34%; max-width:680px; }

/* ---------------- big CTA / footer ---------------- */
.cta-giant { background:var(--navy); color:var(--lav); position:relative; overflow:hidden; text-align:left; }
.cta-giant .wrap { position:relative; }
.cta-giant .label { color:#7fb8dc; margin-bottom:30px; }
.cta-giant h2 { font-size:clamp(46px, 7.6vw, 118px); line-height:1.02; margin-bottom:44px; }
.cta-giant .hero-arc svg.arc-line { right:6%; top:16%; width:32%; max-width:640px; }

footer { background:var(--ink); color:#a5a29a; padding:clamp(64px,8vw,100px) 0 40px; }
.foot-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:48px; margin-bottom:clamp(56px,7vw,90px); }
.foot-grid img { height:38px; width:auto; margin-bottom:22px; }
.foot-grid h4 { font-size:10.5px; font-weight:600; letter-spacing:.3em; text-transform:uppercase; color:#F7F6F0; margin-bottom:20px; font-family:var(--sans); }
.foot-grid p { font-size:13.5px; line-height:2.1; }
.foot-grid ul { list-style:none; }
.foot-grid a { font-size:13.5px; line-height:2.3; color:#a5a29a; text-decoration:none; transition:color .25s; }
.foot-grid a:hover { color:#fff; }
.foot-bottom { border-top:1px solid rgba(247,246,240,.1); padding-top:30px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; }
.foot-bottom a { color:#a5a29a; text-decoration:none; }
.foot-bottom a:hover { color:#fff; }


.gal2 { display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,2.5vw,36px); margin-top:clamp(48px,6vw,80px); }
.gal2 .ph { min-height:clamp(300px,38vw,520px); }
@media (max-width:720px){ .gal2 { grid-template-columns:1fr; } }

.chip { display:inline-block; vertical-align:middle; font-size:9.5px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:#fff; background:var(--blue); border-radius:20px; padding:4px 12px; margin-left:12px; }
.bg-navy .hero-arc svg.arc-line { position:absolute; right:5%; top:8%; width:30%; max-width:560px; }

/* ---------------- faq + outline btn ---------------- */
.btn-outline-dark { border:1px solid var(--navy); color:var(--navy); }
.btn-outline-dark:hover { background:var(--navy); color:var(--lav); }
details.faq { border-bottom:1px solid rgba(33,39,48,.14); }
details.faq summary {
  cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center;
  font-weight:600; font-size:16.5px; padding:24px 0; color:var(--navy);
}
details.faq summary::-webkit-details-marker { display:none; }
details.faq summary:after { content:"+"; font-weight:300; font-size:26px; color:var(--blue); transition:transform .3s var(--ease); }
details.faq[open] summary:after { transform:rotate(45deg); }
details.faq p { font-weight:300; font-size:15px; line-height:1.9; color:#494e58; padding:0 0 26px; max-width:600px; }

/* ---------------- responsive ---------------- */
@media (max-width: 980px) {
  .ed-grid, .split, .member, .c-grid { grid-template-columns:1fr; }
  .member:nth-child(even) .m-photo { order:0; }
  .ed-side { position:static; }
  .stats { grid-template-columns:1fr; }
  .stats > div { border-right:0; border-bottom:1px solid rgba(33,39,48,.14); padding:28px 0; }
  .stats > div + div { padding-left:0; }
  .stats > div:last-child { border-bottom:0; }
  .row-item { grid-template-columns:44px 1fr 40px; }
  .row-item .ds { display:none; }
  .foot-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px) {
  .nav { height:72px; }
  .nav-links {
    display:flex; position:fixed; inset:0; background:var(--navy);
    flex-direction:column; justify-content:center; align-items:flex-start;
    padding:0 var(--pad); gap:8px; transform:translateY(-102%);
    transition:transform .5s var(--ease);
  }
  .nav-links.open { transform:none; }
  .nav-links a { color:var(--lav) !important; font-family:var(--sans); font-size:26px; font-weight:500; letter-spacing:.02em; text-transform:none; }
  .nav-links a.nav-cta { border:0; padding:0; margin-top:18px; font-style:italic; color:var(--blue) !important; }
  .nav-links a.nav-cta:hover { background:transparent; }
  .nav-burger { display:block; }
  .nav-burger.open span:nth-child(1) { transform:translateY(7.5px) rotate(45deg); }
  .nav-burger.open span:nth-child(2) { opacity:0; }
  .nav-burger.open span:nth-child(3) { transform:translateY(-7.5px) rotate(-45deg); }
  header.scrolled .nav-burger.open span { background:var(--lav); }
  .scroll-hint { display:none; }
}