/* =============================================================
   Sweet Basil Thyme Pro — base.css
   Tokens, reset, typography, @font-face, base elements.
   ============================================================= */

:root {
  --sbt-basil:    #1b4332;
  --sbt-herb:     #2d6a4f;
  --sbt-sage:     #95d5b2;
  --sbt-spice:    #f4a261;
  --sbt-cream:    #fff7ec;
  --sbt-rustic:   #6b4226;
  --sbt-ink:      #14241c;
  --sbt-mist:     #f3efe6;

  --sbt-radius-xs: 4px;
  --sbt-radius-sm: 8px;
  --sbt-radius-md: 12px;
  --sbt-radius-lg: 20px;
  --sbt-radius-pill: 999px;

  --sbt-shadow-1: 0 1px 2px rgba(20,36,28,.06), 0 1px 3px rgba(20,36,28,.04);
  --sbt-shadow-2: 0 6px 16px -8px rgba(20,36,28,.18), 0 2px 6px rgba(20,36,28,.06);
  --sbt-shadow-3: 0 20px 50px -20px rgba(20,36,28,.30), 0 6px 16px rgba(20,36,28,.10);

  --sbt-space-1: 4px;
  --sbt-space-2: 8px;
  --sbt-space-3: 12px;
  --sbt-space-4: 16px;
  --sbt-space-5: 24px;
  --sbt-space-6: 32px;
  --sbt-space-7: 48px;
  --sbt-space-8: 64px;
  --sbt-space-9: 96px;
  --sbt-space-10:128px;

  --sbt-content-max: 1280px;
  --sbt-gutter:      72px;
  --sbt-gutter-mob:  20px;

  --sbt-ease:        cubic-bezier(.2,.7,.2,1);
  --sbt-dur-1: 180ms;
  --sbt-dur-2: 320ms;

  --sbt-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --sbt-font-editorial: "Cormorant Garamond", Georgia, serif;
  --sbt-font-body: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --sbt-font-tool: Poppins, var(--sbt-font-body);
}

/* -- @font-face: self-hosted woff2 (subset Latin) -- */
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/inter-v13-latin-regular.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/inter-v13-latin-500.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/inter-v13-latin-600.woff2") format("woff2");
}
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/playfair-display-v30-latin-600.woff2") format("woff2");
}
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("../fonts/playfair-display-v30-latin-700.woff2") format("woff2");
}
@font-face {
  font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/cormorant-garamond-v16-latin-500.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/poppins-v20-latin-500.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/poppins-v20-latin-600.woff2") format("woff2");
}

/* -- reset -- */
*,*::before,*::after{ box-sizing:border-box }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{ margin:0; min-height:100vh; line-height:1.6; color:var(--sbt-ink); background:var(--sbt-cream); font-family:var(--sbt-font-body); font-weight:400; font-feature-settings:"kern","liga","clig"; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
img,video,svg{ max-width:100%; height:auto; display:block }
button,input,select,textarea{ font:inherit; color:inherit }
button{ background:none; border:0; cursor:pointer; padding:0 }
a{ color:var(--sbt-herb); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; transition:color var(--sbt-dur-1) var(--sbt-ease) }
a:hover{ color:var(--sbt-basil) }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--sbt-spice); outline-offset:3px; border-radius:var(--sbt-radius-xs);
}
hr{ border:0; border-top:1px solid color-mix(in srgb, var(--sbt-rustic) 20%, transparent); margin:var(--sbt-space-6) 0 }

h1,h2,h3,h4,h5,h6{
  font-family:var(--sbt-font-display);
  color:var(--sbt-basil);
  line-height:1.15;
  margin:0 0 .5em;
  font-weight:700;
  letter-spacing:-0.01em;
}
h1{ font-size: clamp(2.25rem, 1.4rem + 3.5vw, 4rem); font-weight:700 }
h2{ font-size: clamp(1.75rem, 1.2rem + 2vw, 2.75rem) }
h3{ font-size: clamp(1.25rem, 1.05rem + 1vw, 1.75rem) }
h4{ font-size: 1.25rem; font-family:var(--sbt-font-body); font-weight:600; color:var(--sbt-ink); letter-spacing:0 }

p{ margin:0 0 1em }
small{ font-size:.875rem }
mark{ background:color-mix(in srgb, var(--sbt-spice) 35%, transparent); color:inherit; padding:0 .2em; border-radius:var(--sbt-radius-xs) }

blockquote{
  border-left:3px solid var(--sbt-spice);
  margin:var(--sbt-space-5) 0;
  padding:var(--sbt-space-2) var(--sbt-space-5);
  font-family:var(--sbt-font-editorial);
  font-size:1.35rem;
  color:var(--sbt-rustic);
}

ul,ol{ padding-left:1.25em }
ul li, ol li{ margin:.25em 0 }

table{ border-collapse:collapse; width:100% }
th,td{ padding:.65em .75em; text-align:left; border-bottom:1px solid color-mix(in srgb, var(--sbt-rustic) 18%, transparent) }
th{ font-weight:600; color:var(--sbt-basil); background:var(--sbt-mist) }

::selection{ background:color-mix(in srgb, var(--sbt-spice) 45%, transparent); color:var(--sbt-ink) }

.sbt-screen-reader-text{
  border:0; clip:rect(1px,1px,1px,1px); -webkit-clip-path:inset(50%); clip-path:inset(50%);
  height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; word-wrap:normal !important;
}
.sbt-screen-reader-text:focus{
  background:var(--sbt-cream); clip:auto; -webkit-clip-path:none; clip-path:none; color:var(--sbt-basil);
  display:block; font-size:1rem; font-weight:700; height:auto; left:5px; line-height:normal; padding:15px 23px 14px; text-decoration:none; top:5px; width:auto; z-index:100000;
}

.sbt-skip-link{
  position:absolute; top:-40px; left:0; background:var(--sbt-basil); color:var(--sbt-cream);
  padding:.75em 1em; z-index:99999; text-decoration:none; border-radius:0 0 var(--sbt-radius-sm) 0;
}
.sbt-skip-link:focus{ top:0; color:var(--sbt-cream) }

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}
