@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/albert-sans-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/albert-sans-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/albert-sans-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/albert-sans-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-italic-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-italic-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-italic-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-normal-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/newsreader-normal-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/newsreader-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/newsreader-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Base styles from the design */
body{margin:0;background:#f6f2ea;color:#1b2a44;font-family:"Albert Sans",system-ui,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}a:hover{opacity:.78}
img{display:block}
input,textarea{font:inherit}

/* Layout rules moved out of inline styles so phones can override them */
.span-2{grid-column:span 2}
.step-row{grid-template-columns:minmax(0,180px) 1fr}
/* One column: spanning two would add an empty track and push text off screen */
@media (max-width:799px){.span-2{grid-column:auto}}
/* Label beside text leaves too little room for the text on a phone */
@media (max-width:480px){.step-row{grid-template-columns:1fr}}

/* Motion and interaction layer. Nothing here changes how a page looks at rest. */
:root{--ease:cubic-bezier(.22,.61,.36,1)}

/* Page changes: the nav stays put while the content crossfades */
@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
  @view-transition{navigation:auto}
  nav{view-transition-name:site-nav;background:#f6f2ea} /* opaque, so its text renders exactly as designed */
  ::view-transition-old(root){animation:vt-fade-out .2s ease both}
  ::view-transition-new(root){animation:vt-fade-in .35s ease both}
  @keyframes vt-fade-out{to{opacity:0}}
  @keyframes vt-fade-in{from{opacity:0}}
}

/* Reveal on load and scroll. The .motion class is set before first paint, and a
   failsafe in the page head removes it if site.js never arrives. */
.motion:not(.ready) main>header>*,.motion:not(.ready) main>section>*{opacity:0}
.motion .r{opacity:0;transform:translateY(14px)}
/* Keyframes, not transitions: Chrome skips transitions that start at first paint */
.motion .r.in{animation:reveal .7s var(--ease) var(--d,0s) both}
.motion .r-photo.in img{animation:photo-settle 1.4s var(--ease) var(--d,0s) both}
@keyframes reveal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes photo-settle{from{transform:scale(1.04)}to{transform:none}}
@media print{.motion .r,.motion:not(.ready) main>header>*,.motion:not(.ready) main>section>*{opacity:1!important;transform:none!important}}

/* Nav tucks away when scrolling down and returns when scrolling up. Below this
   width it wraps onto several rows, which would cover too much of the screen. */
@media (min-width:1000px){
  nav{position:sticky;top:0;z-index:40;background:#f6f2ea;transition:transform .35s var(--ease),box-shadow .35s ease}
  nav.stuck{box-shadow:0 1px 18px rgba(27,42,68,.08)}
  nav.tucked:not(:focus-within){transform:translateY(-100%)}
}

/* Hover and focus */
a{transition:opacity .2s ease}
.nav-link{position:relative}
.nav-link:not([aria-current])::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:#b5553a;transform:scaleX(0);transform-origin:left;transition:transform .28s var(--ease)}
.nav-link:not([aria-current]):hover::after{transform:scaleX(1)}
.nav-link:hover{opacity:1}
[data-schedule],form button{transition:transform .2s var(--ease),box-shadow .2s ease,background-color .2s ease,color .2s ease,opacity .2s ease}
/* Mouse only: on touch screens a hover style would stay stuck on after a tap */
@media (hover:hover){
  [data-schedule]:hover{opacity:1;transform:translateY(-1px);box-shadow:0 6px 16px rgba(27,42,68,.18)}
  form button:not(:disabled):hover{background:#f6f2ea!important;color:#1b2a44!important}
}
form button:disabled{opacity:.6;cursor:progress!important}
a:has(>h3){transition:border-color .25s ease}
a:has(>h3):hover{opacity:1;border-top-color:#b5553a!important}
a:has(>h3)>span{text-decoration:underline transparent;text-underline-offset:4px;transition:text-decoration-color .25s ease}
a:has(>h3):hover>span{text-decoration-color:currentColor}
:focus-visible{outline:2px solid #b5553a;outline-offset:3px}
#talk :focus-visible{outline-color:#f6f2ea}
input,textarea{transition:border-color .2s ease,box-shadow .2s ease}
input:focus,textarea:focus{outline:none;border-color:#b5553a!important;box-shadow:0 0 0 2px #b5553a}
::selection{background:#b5553a;color:#f6f2ea}

/* Contact form states */
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.field-error{color:#f4b9a7;font-size:14px}
[aria-invalid="true"]{border-color:#e08a70!important}
.form-status{margin:0;color:#f4b9a7}
.form-status a{text-decoration:underline;text-underline-offset:3px}
.form-thanks{display:flex;flex-direction:column;gap:12px}
.form-thanks:focus{outline:none}
.form-thanks h3{margin:0;font:400 28px/1.15 'Newsreader',serif}
.form-thanks p{margin:0;color:#d3d9e6}
.motion .form-thanks{animation:thanks-in .6s var(--ease) both}
@keyframes thanks-in{from{opacity:0;transform:translateY(10px)}}
