/* santachris.net — editorial / letterpress direction
   Paper & ink, oxblood and spruce, brass hairlines. Signature: the marginalia rail. */

@font-face{font-family:Fraunces;src:url(/assets/fonts/fraunces-var.woff2) format('woff2-variations');font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:Fraunces;src:url(/assets/fonts/fraunces-italic-var.woff2) format('woff2-variations');font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:Karla;src:url(/assets/fonts/karla-var.woff2) format('woff2-variations');font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:Karla;src:url(/assets/fonts/karla-italic-var.woff2) format('woff2-variations');font-weight:300 700;font-style:italic;font-display:swap}

:root{
  --paper:#F6F1E7; --paper-2:#EFE7D6; --ink:#1E1B18; --ink-60:#5A544C;
  --oxblood:#7A1220; --spruce:#0F3D2E; --brass:#B98A2E;
  --rail:7rem; --measure:64rem;
  --display:Fraunces,Georgia,'Times New Roman',serif;
  --text:Karla,'Helvetica Neue',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--text);font-size:1.1875rem;line-height:1.65;font-weight:400;
  font-variant-numeric:oldstyle-nums;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--oxblood);text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{color:var(--ink)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;background:var(--ink);color:var(--paper);padding:.6rem 1rem;z-index:99}
:focus-visible{outline:2px solid var(--oxblood);outline-offset:3px}

h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.04;margin:0;
  font-variation-settings:'SOFT' 0,'WONK' 0,'opsz' 100;letter-spacing:-.012em}
p{margin:0 0 1.15em}
.muted{color:var(--ink-60)}

/* ——— topbar: season line, phone and Book Santa on every page ——— */
.topbar{background:var(--spruce);color:var(--paper)}
.topbar__in{max-width:88rem;margin:0 auto;padding:.6rem 2rem;display:flex;flex-wrap:wrap;
  align-items:center;justify-content:space-between;gap:.4rem 1.5rem}
.topbar p{margin:0;font-size:.72rem;letter-spacing:.09em;line-height:1.4}
.topbar__season{color:rgba(246,241,231,.86)}
.topbar__act{display:flex;align-items:center;gap:1.2rem;white-space:nowrap}
.topbar__act a{color:var(--paper);text-decoration:none;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.topbar__act a:hover{color:var(--brass)}
.topbar__cta{background:var(--brass);color:var(--spruce)!important;padding:.4rem .95rem}
.topbar__cta:hover{background:var(--paper);color:var(--spruce)!important}

/* ——— masthead ——— */
.masthead{border-bottom:1px solid rgba(122,18,32,.18)}
.masthead__in{max-width:88rem;margin:0 auto;padding:1.5rem 2rem 1.25rem;
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 2rem}
.wordmark{display:block;text-decoration:none;color:var(--ink)}
.wordmark{font-family:var(--display);font-size:1.85rem;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;font-variation-settings:'opsz' 120,'SOFT' 0,'WONK' 0;line-height:1}
.wordmark__rule{display:block;height:1px;background:var(--brass);margin:.55rem 0 .4rem;width:100%}
.wordmark__sub{display:block;font-family:var(--text);font-size:.68rem;letter-spacing:.19em;
  text-transform:uppercase;color:var(--ink-60);font-weight:500}
.nav{display:flex;flex-wrap:wrap;gap:.25rem 1.65rem;padding-bottom:.35rem}
.nav a{font-size:.8rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;
  color:var(--ink);text-decoration:none;padding-bottom:.2rem;border-bottom:1px solid transparent}
.nav a:hover{border-bottom-color:var(--brass)}
.nav a[aria-current=page]{color:var(--oxblood);border-bottom-color:var(--oxblood)}

/* ——— the marginalia rail ——— */
.band{display:grid;grid-template-columns:var(--rail) minmax(0,var(--measure)) var(--rail);
  justify-content:center;padding-block:5rem;position:relative}
.band__in{grid-column:2}
.rail{grid-column:1;position:relative}
.rail::after{content:"";position:absolute;right:0;top:-1.5rem;bottom:-1.5rem;width:1px;
  background:linear-gradient(180deg,transparent,var(--brass) 8%,var(--brass) 92%,transparent)}
.rail__num{position:absolute;right:1.35rem;top:.15rem;font-family:var(--display);font-size:1.35rem;
  font-weight:500;color:var(--brass);font-variant-numeric:lining-nums;letter-spacing:.04em}
.rail__label{position:absolute;right:.55rem;top:50%;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);
  font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-60);font-weight:600}
/* headlines deliberately break left across the rail, clearing the numeral above */
.band__in>h2:first-child,.band__in>h1:first-child,.breakout{margin-left:-3.2rem}
.band__in>h2:first-child,.band__in>h1:first-child{margin-top:2.7rem}

.band--tint{background:var(--paper-2)}
.band--invert{background:var(--spruce);color:var(--paper)}
.band--invert .rail::after{background:linear-gradient(180deg,transparent,var(--brass) 8%,var(--brass) 92%,transparent);opacity:.75}
.band--invert .rail__label{color:rgba(246,241,231,.62)}
.band--invert a{color:var(--paper)}
.band--invert h2,.band--invert h3{color:var(--paper)}

/* ——— display type ——— */
.kicker{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;font-weight:600;color:var(--oxblood);margin:0 0 1.4rem}
.band--invert .kicker{color:var(--brass)}
.h-xl{font-size:clamp(2.9rem,7.2vw,5.4rem);font-variation-settings:'opsz' 144,'SOFT' 0,'WONK' 0;letter-spacing:-.022em}
.h-lg{font-size:clamp(2.1rem,4.6vw,3.4rem);font-variation-settings:'opsz' 144,'SOFT' 0,'WONK' 0;letter-spacing:-.018em}
.h-md{font-size:clamp(1.55rem,2.6vw,2.1rem)}
.lede{font-size:1.32rem;line-height:1.5;max-width:34em}
.prose{max-width:36em}
.prose p{margin-bottom:1.35em}
.prose h3{font-size:1.5rem;margin:2.6em 0 .7em;font-variation-settings:'opsz' 60,'SOFT' 0,'WONK' 0}
.prose h3:first-child{margin-top:0}
.dropcap::first-letter{float:left;font-family:var(--display);font-size:4.1em;line-height:.78;
  font-weight:600;padding:.06em .12em 0 0;color:var(--oxblood);font-variation-settings:'opsz' 144}
.rule-orn{width:min(300px,55%);margin:2.6rem 0 2.8rem;mix-blend-mode:multiply;opacity:.75}
.band--invert .rule-orn{display:none}

/* ——— hero ——— */
.hero{border-bottom:1px solid rgba(122,18,32,.18);overflow:hidden}
.hero__grid{max-width:88rem;margin:0 auto;display:grid;grid-template-columns:minmax(0,42fr) minmax(0,58fr);
  align-items:end;gap:2rem}
.hero__text{padding:5.5rem 2rem 5rem;max-width:34rem;justify-self:end}
.hero__creds{display:flex;flex-wrap:wrap;gap:.45rem 1rem;font-size:.63rem;letter-spacing:.15em;
  text-transform:uppercase;font-weight:600;color:var(--ink-60);border-top:1px solid var(--brass);
  border-bottom:1px solid var(--brass);padding:.75rem 0;margin:2.2rem 0 2rem}
.hero__figure{position:relative;align-self:stretch;min-height:34rem}
.hero__figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.hero figcaption{position:absolute;left:0;bottom:0;background:var(--paper);color:var(--ink-60);
  font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;padding:.7rem 1.1rem;font-weight:600}

/* ——— links & buttons (text-first, no pills) ——— */
.tlink{display:inline-block;font-family:var(--text);font-size:.79rem;letter-spacing:.19em;
  text-transform:uppercase;font-weight:700;color:var(--oxblood);text-decoration:none;
  border-bottom:2px solid var(--brass);padding-bottom:.3rem}
.tlink:hover{color:var(--ink);border-bottom-color:var(--ink)}
.band--invert .tlink{color:var(--paper);border-bottom-color:var(--brass)}
.band--invert .tlink:hover{border-bottom-color:var(--paper)}

/* ——— services index ——— */
.index{list-style:none;margin:2.5rem 0 0;padding:0;columns:2;column-gap:4rem}
.index li{break-inside:avoid;border-bottom:1px solid rgba(185,138,46,.45);padding:.85rem 0;
  display:flex;gap:1.1rem;align-items:baseline;font-size:1.16rem}
.index li span{font-family:var(--display);font-size:.82rem;color:var(--brass);font-variant-numeric:lining-nums;
  letter-spacing:.06em;min-width:1.9rem}

/* ——— rates ledger ——— */
.ledger{font-size:clamp(3.4rem,8vw,5.6rem);font-family:var(--display);font-weight:600;
  font-variation-settings:'opsz' 144,'SOFT' 0,'WONK' 0;line-height:.95;color:var(--oxblood);
  font-variant-numeric:lining-nums;letter-spacing:-.03em;margin:0}
.ledger-note{font-size:1.2rem;max-width:32em;margin-top:1.1rem}
.tiers{width:100%;max-width:34rem;border-collapse:collapse;margin:2.6rem 0 1rem}
.tiers th{text-align:left;font-family:var(--text);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink-60);font-weight:600;padding-bottom:.7rem;border-bottom:1px solid var(--brass)}
.tiers td{padding:.72rem 0;border-bottom:1px dotted rgba(30,27,24,.32);font-size:1.05rem}
.tiers td:last-child{text-align:right;font-family:var(--display);font-variant-numeric:lining-nums;font-weight:500}

/* ——— pull quote / the moment ——— */
.moment{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);gap:3.5rem;align-items:center}
.pull{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.18;font-style:italic;
  font-variation-settings:'opsz' 144,'SOFT' 0,'WONK' 0;margin:0}
.pull--sm{font-size:clamp(1.35rem,2.4vw,1.8rem)}
figure{margin:0}
figcaption{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-60);
  margin-top:.75rem;font-weight:600}

/* ——— essay teasers ——— */
.asks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem;margin-top:2.5rem}
.ask{border-top:1px solid var(--brass);padding-top:1.4rem}
.ask h3{font-style:italic;font-size:clamp(1.35rem,2.3vw,1.75rem);line-height:1.15;margin-bottom:.8rem}
.ask p{font-size:1.05rem}

/* ——— trust marks ——— */
.marks{display:flex;flex-wrap:wrap;gap:0;margin:2.4rem 0 2rem;border-top:1px solid var(--brass);border-bottom:1px solid var(--brass)}
.marks span{padding:.9rem 1.6rem .9rem 0;margin-right:1.6rem;font-size:.74rem;letter-spacing:.22em;
  text-transform:uppercase;font-weight:600;border-right:1px solid rgba(185,138,46,.5)}
.marks span:last-child{border-right:0;margin-right:0}

/* ——— season ——— */
.season{font-family:var(--display);font-size:clamp(1.8rem,3.4vw,2.7rem);line-height:1.15;
  font-variation-settings:'opsz' 144,'SOFT' 0,'WONK' 0;max-width:20em;margin:0 0 1.6rem}

/* ——— photographs ——— */
.plates{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:2.6rem;margin-top:2.5rem}
.plate img{width:100%}
.plate--wide{grid-column:1/-1}

/* ——— form ——— */
.form{max-width:40rem;margin-top:2.5rem}
.field{margin-bottom:1.5rem}
.field label{display:block;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;
  color:var(--ink-60);margin-bottom:.45rem}
.field input,.field select,.field textarea{width:100%;font-family:var(--text);font-size:1.05rem;
  color:var(--ink);background:transparent;border:0;border-bottom:1px solid rgba(30,27,24,.4);
  padding:.6rem 0;border-radius:0}
.field textarea{border:1px solid rgba(30,27,24,.4);padding:.8rem;min-height:9rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--oxblood);
  box-shadow:0 1px 0 0 var(--oxblood)}
.field--2{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.98rem;margin-bottom:1.4rem}
.check input{margin-top:.42rem;accent-color:var(--oxblood)}
.check label{font-size:.98rem;letter-spacing:0;text-transform:none;color:var(--ink);font-weight:400;margin:0}
.hp{position:absolute;left:-9999px}
.submit{font-family:var(--text);font-size:.82rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;
  background:var(--oxblood);color:var(--paper);border:0;padding:1.05rem 2.4rem;cursor:pointer;border-radius:0}
.submit:hover{background:var(--ink)}
.note{font-size:.95rem;color:var(--ink-60);max-width:34em}
.errors{border-left:3px solid var(--oxblood);padding:.9rem 1.2rem;margin-bottom:2rem;background:var(--paper-2)}
.errors ul{margin:.3rem 0 0;padding-left:1.1rem}

/* ——— footer ——— */
.foot{background:var(--ink);color:var(--paper);margin-top:0}
.foot__in{max-width:88rem;margin:0 auto;padding:4.5rem 2rem 3rem}
.foot__mark{font-family:var(--display);font-size:clamp(2.6rem,8vw,5rem);text-transform:uppercase;
  letter-spacing:.08em;font-weight:600;font-variation-settings:'opsz' 144,'SOFT' 0,'WONK' 0;
  border-bottom:1px solid var(--brass);padding-bottom:1.2rem;margin-bottom:2.6rem;color:var(--paper)}
.foot__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:2.5rem}
.foot h2{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;font-family:var(--text);
  font-weight:600;color:var(--brass);margin-bottom:.8rem}
.foot p{font-size:.98rem;line-height:1.85;color:rgba(246,241,231,.82)}
.foot a{color:rgba(246,241,231,.82);text-decoration:none;border-bottom:1px solid rgba(185,138,46,.45)}
.foot a:hover{color:var(--paper);border-bottom-color:var(--brass)}
.foot .muted{color:rgba(246,241,231,.5)}
.foot__legal{margin-top:3.2rem;padding-top:1.4rem;border-top:1px solid rgba(246,241,231,.16);
  font-size:.76rem;letter-spacing:.1em;color:rgba(246,241,231,.55)}

/* ——— responsive ——— */
@media (max-width:1080px){
  :root{--rail:5rem}
  .band__in>h2:first-child,.band__in>h1:first-child,.breakout{margin-left:-2.2rem}
  .hero__text{padding:4rem 1.5rem 3.5rem}
}
@media (max-width:900px){
  body{font-size:1.09rem}
  .masthead__in{padding:1.15rem 1.25rem;align-items:flex-start;flex-direction:column}
  .topbar__in{padding:.55rem 1.25rem;flex-direction:column;align-items:flex-start;gap:.5rem}
  .topbar__season{font-size:.7rem}
  .topbar__act{width:100%;justify-content:space-between;gap:.8rem}
  .wordmark{font-size:1.5rem}
  .nav{gap:.55rem 1.2rem;padding-bottom:0}
  .band{display:block;padding:3.5rem 1.25rem}
  .band__in>h2:first-child,.band__in>h1:first-child,.breakout{margin-left:0}
  .band__in>h2:first-child,.band__in>h1:first-child{margin-top:0}
  /* rail collapses to a horizontal brass rule + numeral */
  .rail{display:flex;align-items:center;gap:.9rem;margin-bottom:1.5rem}
  .rail::after{position:static;height:1px;width:auto;flex:1;top:auto;bottom:auto;
    background:var(--brass);opacity:.6}
  .rail__num,.rail__label{position:static;writing-mode:horizontal-tb;transform:none}
  .rail__num{font-size:1.05rem}
  .rail__label{order:-1}
  .rail__num{order:-2}
  .hero__grid{grid-template-columns:1fr;gap:0}
  .hero__text{max-width:none;justify-self:stretch;order:2;padding-top:2.5rem}
  .hero__figure{order:1;min-height:min(78vh,30rem)}
  .index{columns:1}
  .moment,.asks,.field--2{grid-template-columns:1fr;gap:2.2rem}
  .foot__in{padding:3rem 1.25rem 2.5rem}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* headline → first paragraph breathing room (inline margins still win) */
.band__in h1+p,.band__in h2+p,.band__in h3+p{margin-top:1.15rem}

/* hero: primary action plus a quieter telephone link */
.hero__acts{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem;margin:0}
.tlink--quiet{color:var(--ink-60);border-bottom-color:rgba(30,27,24,.28)}
.tlink--quiet:hover{color:var(--ink);border-bottom-color:var(--ink)}

/* ——— question & answer ——— */
.qa{margin:3rem 0 0}
.qa__item{border-top:1px solid rgba(185,138,46,.55);padding:2rem 0;
  display:grid;grid-template-columns:minmax(0,16rem) minmax(0,1fr);gap:2.5rem}
.qa__item:last-child{border-bottom:1px solid rgba(185,138,46,.55)}
.qa dt{font-family:var(--display);font-style:italic;font-size:1.32rem;line-height:1.2;font-weight:600;
  font-variation-settings:'SOFT' 0,'WONK' 0,'opsz' 72;position:relative}
.qa__num{display:block;font-style:normal;font-size:.72rem;letter-spacing:.2em;color:var(--brass);
  font-variant-numeric:lining-nums;margin-bottom:.6rem;font-family:var(--text);font-weight:700}
.qa dd{margin:0;font-size:1.04rem}
.qa dd p{margin-bottom:.9em}
.qa dd p:last-child{margin-bottom:0}
@media (max-width:900px){.qa__item{grid-template-columns:1fr;gap:1rem;padding:1.6rem 0}.qa dt{font-size:1.2rem}}

/* ——— form groupings ——— */
.form__legend{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;font-weight:700;
  color:var(--oxblood);border-bottom:1px solid var(--brass);padding-bottom:.6rem;margin:2.8rem 0 1.6rem}
.form__legend:first-child{margin-top:0}
.field--3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
@media (max-width:900px){.field--3{grid-template-columns:1fr;gap:0}}

/* service index rows are links into the booking form */
.index li a{color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}
.index li a:hover{color:var(--oxblood);border-bottom-color:var(--oxblood)}