/* Live sash.digital header and footer. Generated by _build/chrome.mjs from the sash-digital repo, do not edit by hand. */
.sdn, .sdf { --font-bricolage: "Bricolage Grotesque"; --font-figtree: "Figtree"; --font-jetbrains: "JetBrains Mono"; }
:where(.sd-chrome-pastel) a { color: inherit; text-decoration: none; }
:where(.sd-chrome-pastel) ul { list-style: none; margin: 0; padding: 0; }
:where(.sd-chrome-pastel) :where(p, h1, h2, h3, h4) { margin: 0; }
.sd-chrome-pastel *, .sd-chrome-pastel *::before, .sd-chrome-pastel *::after { box-sizing: border-box; }
.sd-chrome-pastel img { max-width: 100%; }
/* Pastel header (rail mega menu) and footer. Only rendered on pastel routes. */
.sdn, .sdf {
  --ink: #16161D; --ink-soft: #5B5A66; --ink-mute: #8C8A94;
  --ground: #FBF8F1; --line: #ECE6DA;
  --butter: #FFE69A; --knob: #F7BFCF;
  --f-display: var(--font-bricolage), "Segoe UI", system-ui, sans-serif;
  --f-body: var(--font-figtree), "Segoe UI", system-ui, sans-serif;
  --f-mono: var(--font-jetbrains), ui-monospace, Consolas, monospace;
  font-family: var(--f-body);
  -webkit-font-smoothing: antialiased;
}
:where(.sdn, .sdf) button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
.sdn :focus-visible, .sdf :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 8px; }

/* shared bits */
.sd-lab { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
:where(.sdn, .sdf) .sd-cta { display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 6px 0 20px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 14.5px; font-weight: 600; white-space: nowrap; transition: transform .25s; }
:where(.sdn, .sdf) .sd-cta:hover { transform: translateY(-1px); }
:where(.sdn, .sdf) .sd-cta-butter { background: var(--butter); color: var(--ink); }
:where(.sdn, .sdf) .sd-knob { width: 34px; height: 34px; border-radius: 50%; background: var(--knob); color: var(--ink); display: grid; place-items: center; flex: none; transition: translate .3s; }
:where(.sdn, .sdf) .sd-knob svg { width: 14px; height: 14px; }
:where(.sdn, .sdf) .sd-cta:hover .sd-knob { translate: 3px 0; }
.sd-link-arrow { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px; color: var(--ink); }
.sd-link-arrow svg { width: 13px; height: 13px; transition: translate .25s; }
.sd-link-arrow:hover svg { translate: 3px 0; }

/* ---------- header bar ---------- */
.sdn-bar { position: fixed; top: 0; left: 0; right: 0; z-index: 50; background: rgba(251, 248, 241, .86); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid rgba(22, 22, 29, .08); color: var(--ink); }
.sdn-inner { max-width: 1280px; margin: 0 auto; height: 76px; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.sdn-logo { display: flex; align-items: center; flex: none; }
.sdn-logo img { height: 46px; width: auto; display: block; }

.sdn-links { display: flex; align-items: center; gap: 2px; padding: 5px; border-radius: 999px; background: rgba(255, 255, 255, .75); border: 1px solid rgba(22, 22, 29, .08); }
.sdn-link { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 999px; font-size: 14.5px; font-weight: 500; color: var(--ink-soft); transition: color .2s, background .2s; }
.sdn-link:hover, .sdn-link[aria-expanded="true"] { color: var(--ink); background: #FFF6D8; }
.sdn-link[aria-current="page"] { background: var(--ink); color: #fff; }
.sdn-chev { width: 10px; height: 10px; transition: rotate .25s; }
.sdn-link[aria-expanded="true"] .sdn-chev { rotate: 180deg; }
.sdn-right { display: flex; align-items: center; gap: 10px; }

.sdn-burger { display: none; width: 46px; height: 46px; border-radius: 50%; background: #fff !important; border: 1px solid rgba(22, 22, 29, .1) !important; position: relative; z-index: 2; }
.sdn-burger span { position: absolute; left: 14px; right: 14px; height: 2px; border-radius: 2px; background: var(--ink); transition: transform .3s, top .3s; }
.sdn-burger span:first-child { top: 18px; }
.sdn-burger span:last-child { top: 26px; }
.sdn-burger[aria-expanded="true"] span:first-child { top: 22px; transform: rotate(45deg); }
.sdn-burger[aria-expanded="true"] span:last-child { top: 22px; transform: rotate(-45deg); }

/* ---------- desktop mega (rail) ---------- */
.sdn-mega { position: absolute; top: calc(100% + 8px); left: 50%; width: min(1232px, calc(100vw - 48px)); translate: -50% -8px; display: grid; grid-template-columns: 290px minmax(0, 1fr) 300px; min-height: 420px; background: #fff; border: 1px solid var(--line); border-radius: 26px; box-shadow: 0 30px 80px rgba(22, 22, 29, .12); opacity: 0; pointer-events: none; transition: opacity .22s, translate .22s; color: var(--ink); }
.sdn-mega.is-open { opacity: 1; translate: -50% 0; pointer-events: auto; }
.sdn-rail { padding: 16px; border-right: 1px solid var(--line); display: grid; gap: 4px; align-content: start; }
.sdn-rail button { text-align: left; padding: 14px 16px; border-radius: 16px; display: grid; gap: 2px; transition: background .2s; }
.sdn-rail button b { font-family: var(--f-display); font-weight: 500; font-size: 18px; letter-spacing: -0.02em; display: flex; justify-content: space-between; align-items: center; }
.sdn-rail button b em { font-style: normal; font-family: var(--f-mono); font-size: 11px; color: var(--ink-mute); font-weight: 400; letter-spacing: 0; }
.sdn-rail button span { font-size: 13px; color: var(--ink-soft); line-height: 1.35; }
.sdn-rail button:hover { background: var(--ground); }
.sdn-rail button[aria-selected="true"] { background: var(--cp); }
.sdn-rail button[aria-selected="true"] b em { color: var(--ink); }
.sdn-list { padding: 26px 28px; display: grid; gap: 16px; align-content: start; }
.sdn-group { display: grid; gap: 16px; }
.sdn-group[hidden] { display: none; }
.sdn-list ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 24px; }
.sdn-list li a { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; margin-inline: -12px; border-radius: 12px; font-size: 14.5px; font-weight: 500; color: var(--ink); }
.sdn-list li a svg { width: 13px; height: 13px; opacity: 0; translate: -4px 0; transition: .2s; flex: none; }
.sdn-list li a:hover { background: var(--ground); }
.sdn-list li a:hover svg { opacity: 1; translate: 0 0; }
.sdn-tile { margin: 16px; border-radius: 22px; background: var(--c); padding: 24px; display: grid; align-content: space-between; gap: 22px; position: relative; overflow: hidden; transition: background .3s; }
.sdn-tile-h { font-family: var(--f-display); font-weight: 500; font-size: 30px; line-height: 1.02; letter-spacing: -0.035em; position: relative; }
.sdn-tile p { margin: 0; font-size: 14.5px; color: var(--ink); opacity: .78; position: relative; line-height: 1.5; }
.sdn-tile .sd-cta { justify-self: start; position: relative; }
.sdn-glyph { position: absolute; right: -30px; bottom: -30px; width: 170px; height: 170px; border-radius: 46px; background: #fff; opacity: .45; rotate: 18deg; }
.sdn-glyph::after { content: ""; position: absolute; inset: 34px; border-radius: 28px; background: #fff; opacity: .8; }
.sdn-scrim { position: fixed; inset: 0; z-index: 40; background: rgba(251, 248, 241, .55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity .25s; }
.sdn-scrim.is-open { opacity: 1; pointer-events: auto; }

/* ---------- phone sheet ---------- */
.sdn-sheet { position: fixed; inset: 0; z-index: 45; background: var(--ground); color: var(--ink); padding: calc(88px + env(safe-area-inset-top, 0px)) 0 0; display: flex; flex-direction: column; opacity: 0; pointer-events: none; transition: opacity .25s; }
.sdn-sheet.is-open { opacity: 1; pointer-events: auto; }
.sdn-levels { flex: 1; min-height: 0; display: flex; width: 300%; translate: calc(var(--lv) * -33.3333%) 0; transition: translate .38s cubic-bezier(.2, .7, .2, 1); }
.sdn-level { width: 33.3333%; overflow-y: auto; padding: 8px 20px 24px; display: flex; flex-direction: column; gap: 14px; }
.sdn-big { list-style: none; margin: 0; padding: 0; }
.sdn-big li { border-bottom: 1px solid var(--line); }
.sdn-big a, .sdn-big button { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 16px 2px; font-family: var(--f-display); font-weight: 500; font-size: 30px; letter-spacing: -0.035em; color: var(--ink); text-align: left; }
.sdn-chev-r { width: 16px; height: 16px; rotate: -90deg; color: var(--ink-soft); flex: none; }
.sdn-back { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14.5px; color: var(--ink-soft); align-self: flex-start; padding: 8px 0; }
.sdn-back svg { width: 16px; height: 16px; }
.sdn-cats { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sdn-cats button { width: 100%; display: flex; align-items: center; gap: 14px; padding: 16px; border-radius: 18px; background: #fff; border: 1px solid var(--line); text-align: left; }
.sdn-sw { width: 30px; height: 30px; border-radius: 10px; background: var(--c); flex: none; }
.sdn-nm { flex: 1; font-family: var(--f-display); font-weight: 500; font-size: 20px; letter-spacing: -0.02em; }
.sdn-cats em { font-style: normal; font-family: var(--f-mono); font-size: 12px; color: var(--ink-mute); }
.sdn-cat-head { background: var(--c); border-radius: 20px; padding: 20px; display: grid; gap: 6px; }
.sdn-cat-h { font-family: var(--f-display); font-weight: 500; font-size: 26px; letter-spacing: -0.035em; line-height: 1.05; }
.sdn-cat-head p { margin: 0; font-size: 14.5px; opacity: .8; line-height: 1.45; }
.sdn-svc { list-style: none; margin: 0; padding: 0; }
.sdn-svc li { border-bottom: 1px solid var(--line); }
.sdn-svc a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 15px 2px; min-height: 48px; font-size: 16px; font-weight: 500; color: var(--ink); }
.sdn-svc a svg { width: 14px; height: 14px; color: var(--ink-soft); flex: none; }
.sdn-sheet-foot { padding: 14px 20px calc(16px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--line); background: var(--ground); display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 14px; color: var(--ink-soft); }
.sdn-sheet-foot a:not(.sd-cta) { color: inherit; overflow-wrap: anywhere; }
.sdn-sheet-foot .sd-cta { height: 52px; flex: 1 1 auto; justify-content: space-between; max-width: 320px; }

@media (max-width: 1023px) {
  .sdn-links, .sdn-cta-desk, .sdn-mega, .sdn-scrim { display: none; }
  .sdn-burger { display: block; }
  .sdn-inner { height: 68px; padding: 0 16px; }
  .sdn-logo img { height: 38px; }
  .sdn-sheet { padding-top: calc(80px + env(safe-area-inset-top, 0px)); }
}
@media (min-width: 1024px) { .sdn-sheet { display: none; } }
@media (min-width: 1024px) and (max-width: 1180px) {
  .sdn-mega { grid-template-columns: 250px minmax(0, 1fr); }
  .sdn-tile { display: none; }
  .sdn-link { padding: 9px 12px; }
}

/* ---------- footer (ink) ----------
   Prefixed with .sd-chrome-pastel so these beat the older generic
   ".sd-chrome-pastel footer a/span/li" rules in pastel.css. */
.sd-chrome-pastel .sdf a:hover { translate: none; }
.sd-chrome-pastel .sdf span, .sd-chrome-pastel .sdf li, .sd-chrome-pastel .sdf p { color: inherit; }
.sd-chrome-pastel .sdf { background: var(--ground); color: #fff; padding: 24px 16px 0; }
.sd-chrome-pastel .sdf-inner { max-width: 1280px; margin: 0 auto; background: var(--ink); border-radius: 36px 36px 0 0; padding: 56px 40px 0; }
.sd-chrome-pastel .sdf .sd-lab { color: rgba(255, 255, 255, .6); }
.sd-chrome-pastel :where(.sdf) a { color: inherit; text-decoration: none; }
.sd-chrome-pastel .sdf-top { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 40px; align-items: end; padding-bottom: 44px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.sd-chrome-pastel .sdf-mail { display: block; margin-top: 12px; font-family: var(--f-display); font-weight: 500; letter-spacing: -0.04em; font-size: clamp(30px, 4.4vw, 60px); line-height: 1.05; color: #fff; overflow-wrap: break-word; transition: color .2s; }
.sd-chrome-pastel .sdf-mail:hover { color: var(--butter); }
.sd-chrome-pastel .sdf-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.sd-chrome-pastel .sdf-actions .sd-cta { height: 52px; padding-left: 22px; color: #fff; }
.sd-chrome-pastel .sdf-actions .sd-cta-butter { color: var(--ink); }
.sd-chrome-pastel .sdf-ghost { height: 52px; padding: 0 20px !important; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .22) !important; color: #fff; font-weight: 600; font-size: 14px; transition: background .2s; }
.sd-chrome-pastel .sdf-ghost:hover { background: rgba(255, 255, 255, .08) !important; }

.sd-chrome-pastel .sdf-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, 1fr); gap: 48px; padding-block: 44px; }
.sd-chrome-pastel .sdf-h { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .55); margin-bottom: 14px; }
.sd-chrome-pastel .sdf-cats { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.sd-chrome-pastel .sdf-cats li { border-bottom: 1px solid rgba(255, 255, 255, .12); }
.sd-chrome-pastel .sdf-cats a { display: flex; align-items: center; gap: 16px; padding: 16px 4px; font-family: var(--f-display); font-weight: 500; font-size: 24px; letter-spacing: -0.03em; color: #fff; }
.sd-chrome-pastel .sdf-sw { width: 14px; height: 14px; border-radius: 5px; background: var(--c); flex: none; }
.sd-chrome-pastel .sdf-nm { flex: 1; min-width: 0; transition: color .2s; }
.sd-chrome-pastel .sdf-cats svg { width: 18px; height: 18px; color: rgba(255, 255, 255, .4); flex: none; transition: translate .25s, color .2s; }
.sd-chrome-pastel .sdf-cats a:hover svg { color: #fff; }

.sd-chrome-pastel .sdf-co { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.sd-chrome-pastel .sdf-co a { display: inline-flex; align-items: center; gap: 0; padding: 6px 0; font-size: 16px; color: rgba(255, 255, 255, .75); transition: color .2s; }
.sd-chrome-pastel .sdf-co a:hover { color: #fff; }
.sd-chrome-pastel .sdf-addr { font-style: normal; color: rgba(255, 255, 255, .75); font-size: 15px; line-height: 1.65; }
.sd-chrome-pastel .sdf-phone { display: inline-block; margin-top: 14px; font-size: 15px; color: rgba(255, 255, 255, .75); transition: color .2s; }
.sd-chrome-pastel .sdf-phone:hover { color: #fff; }

.sd-chrome-pastel .sdf-bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px 24px; flex-wrap: wrap; padding: 20px 0 24px; border-top: 1px solid rgba(255, 255, 255, .12); font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .03em; color: rgba(255, 255, 255, .55); }
.sd-chrome-pastel .sdf-bottom nav { display: flex; gap: 18px; flex-wrap: wrap; align-items: center; }
.sd-chrome-pastel .sdf-bottom a { color: rgba(255, 255, 255, .7); transition: color .2s; }
.sd-chrome-pastel .sdf-bottom a:hover { color: #fff; }
.sd-chrome-pastel .sdf-bottom nav span a { text-decoration: underline; text-underline-offset: 3px; }
.sd-chrome-pastel .sdf-social { display: flex; gap: 8px; }
.sd-chrome-pastel .sdf-social a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .2); display: grid; place-items: center; color: #fff; transition: background .2s, color .2s; }
.sd-chrome-pastel .sdf-social a:hover { background: #F9D5DE; color: var(--ink); }
.sd-chrome-pastel .sdf-social svg { width: 15px; height: 15px; }

@media (max-width: 1023px) {
  .sd-chrome-pastel .sdf-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .sd-chrome-pastel .sdf-svc { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .sd-chrome-pastel .sdf { padding: 16px 8px 0; }
  .sd-chrome-pastel .sdf-inner { padding: 40px 20px 0; border-radius: 28px 28px 0 0; }
  .sd-chrome-pastel .sdf-top { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .sd-chrome-pastel .sdf-actions { justify-content: flex-start; }
  .sd-chrome-pastel .sdf-grid { gap: 32px 20px; }
  .sd-chrome-pastel .sdf-cats a { font-size: 20px; padding: 14px 2px; }
}

@media (prefers-reduced-motion: reduce) {
  .sdn *, .sdf *, .sdn-mega, .sdn-sheet, .sdn-levels, .sdn-scrim { transition: none !important; }
}

/* ---------- cookie consent card (components/CookieBanner.tsx) ---------- */
.sd-cookie { position: fixed; left: 20px; bottom: 20px; z-index: 60; width: min(420px, calc(100vw - 40px)); background: #fff; color: #16161D; border: 1px solid #ECE6DA; border-radius: 22px; padding: 20px 22px; box-shadow: 0 24px 60px rgba(22, 22, 29, .16); font-family: var(--font-figtree), "Segoe UI", system-ui, sans-serif; }
.sd-cookie-h { font-family: var(--font-bricolage), "Segoe UI", system-ui, sans-serif; font-weight: 600; font-size: 18px; letter-spacing: -0.01em; margin: 0 0 6px; }
.sd-cookie-p { font-size: 14.5px; line-height: 1.55; color: #5B5A66; margin: 0; }
.sd-cookie-p a { color: #16161D; text-decoration: underline; text-underline-offset: 3px; }
.sd-cookie-actions { display: flex; gap: 10px; margin-top: 14px; }
.sd-cookie-actions button { height: 42px; padding: 0 20px; border-radius: 999px; font: inherit; font-size: 14.5px; font-weight: 600; cursor: pointer; transition: translate .2s; }
.sd-cookie-actions button:hover { translate: 0 -1px; }
.sd-cookie-yes { background: #16161D; color: #fff; border: 0; }
.sd-cookie-no { background: #fff; color: #16161D; border: 1px solid #ECE6DA; }
@media (max-width: 520px) { .sd-cookie { left: 12px; right: 12px; bottom: 12px; width: auto; } .sd-cookie-actions button { flex: 1; } }
