@font-face{
  font-family:'Faustina';
  src:url('font/faustina.woff2') format('woff2-variations');
  font-weight:400 600;
  font-style:normal;
  font-display:swap;
}

:root{
  --paper:#ECEEE9;
  --panel:#DDE1D9;
  --ink:#1E2422;
  --muted:#55605A;
  --accent:#5C2E42;
  --rule:#C2C8BF;

  --s1:13px;
  --s2:15px;
  --s3:18px;
  --s4:22px;
  --s5:30px;
  --s6:44px;

  --pad:max(20px, min(5vw, 56px));
  --col:660px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Faustina',Georgia,'Times New Roman',serif;
  font-size:var(--s3);
  font-weight:400;
  line-height:1.62;
}
img{max-width:100%;width:100%;height:auto;display:block}
figure{margin:0}
h1,h2,h3{font-weight:600;line-height:1.2;margin:0}
p{margin:0}
a{color:inherit}

.skip{
  position:absolute;left:-9999px;top:0;
  background:var(--ink);color:var(--paper);
  padding:14px 20px;text-decoration:none;z-index:50;
}
.skip:focus{left:0}

:where(a,button):focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}

/* ---------- mockup banner ---------- */
.mockup{
  background:var(--ink);
  color:var(--paper);
  font-size:var(--s2);
  line-height:1.5;
  padding:11px var(--pad);
  margin:0;
}

/* ---------- masthead ---------- */
.masthead{border-bottom:1px solid var(--rule)}
.masthead__in{
  max-width:1180px;margin:0 auto;padding:20px var(--pad);
  display:flex;flex-wrap:wrap;gap:10px 28px;
  align-items:baseline;justify-content:space-between;
}
.ident{display:flex;flex-direction:column}
.ident__name{font-size:var(--s4);font-weight:600;line-height:1.25}
.ident__place{font-size:var(--s1);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.tel{
  font-size:var(--s4);font-weight:600;text-decoration:none;
  border-bottom:2px solid var(--accent);
  padding:6px 0;
}
.tel:hover{color:var(--accent)}

/* ---------- opener ---------- */
.opener{
  max-width:1180px;margin:0 auto;
  padding:clamp(48px,8vw,104px) var(--pad) clamp(40px,6vw,72px);
}
h1{font-size:var(--s6);letter-spacing:-.012em;max-width:24ch}
.lead{font-size:var(--s4);max-width:56ch;margin-top:28px;line-height:1.5}
.hours{font-size:var(--s2);color:var(--muted);margin-top:22px;letter-spacing:.01em}
.cta{margin-top:28px}
.btn{
  display:inline-block;
  background:var(--accent);color:#FFFFFF;
  text-decoration:none;
  font-size:var(--s3);font-weight:600;
  padding:15px 30px;
  min-height:48px;
  border:1px solid var(--accent);
}
.btn:hover{background:#48222F;border-color:#48222F}

/* ---------- anchor row ---------- */
.anchors{
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.anchors a{
  display:inline-block;
  font-size:var(--s1);letter-spacing:.09em;text-transform:uppercase;
  text-decoration:none;color:var(--muted);
  padding:18px 0;margin-right:38px;
  border-bottom:2px solid transparent;
}
.anchors a:hover{color:var(--ink);border-bottom-color:var(--ink)}
.anchors{padding:0 var(--pad)}
.anchors>a:first-child{margin-left:0}
@media (min-width:1181px){.anchors{padding:0 calc((100vw - 1180px)/2 + var(--pad))}}

/* ---------- the register ---------- */
.register{
  max-width:1180px;margin:0 auto;
  padding:clamp(44px,6vw,80px) var(--pad) clamp(20px,3vw,36px);
}
.register--two{padding-top:clamp(36px,5vw,64px)}
.sec-h{
  font-size:var(--s1);letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);font-weight:600;
  margin-bottom:clamp(24px,3vw,40px);
}

.entry{
  display:grid;
  grid-template-columns:minmax(0,var(--col)) minmax(0,1fr);
  grid-template-rows:auto auto 1fr;
  column-gap:clamp(28px,5vw,72px);
  align-items:start;
  border-top:1px solid var(--rule);
  padding:clamp(28px,4vw,46px) 0 clamp(30px,4vw,52px);
}
.entry h3{
  grid-column:1;
  font-size:var(--s5);
  letter-spacing:-.006em;
  margin-bottom:16px;
}
.entry__body{grid-column:1;max-width:62ch}
.entry__body p + p{margin-top:1em}

.entry__fig{
  grid-column:2;
  grid-row:1 / span 3;
  align-self:start;
  width:100%;max-width:380px;
}
.entry__fig img{
  aspect-ratio:4 / 5;
  object-fit:cover;
}
.entry__fig--wide img{aspect-ratio:4 / 5;object-position:50% 34%}

.entry__note{
  grid-column:2;
  grid-row:2 / span 2;
  align-self:start;
  font-size:var(--s2);
  color:var(--muted);
  line-height:1.5;
  max-width:26ch;
  border-top:1px solid var(--rule);
  padding-top:12px;
}
.entry__fig + .entry__note{
  grid-row:3;
  grid-column:1;
  align-self:start;
  margin-top:26px;
  max-width:48ch;
}

@media (max-width:900px){
  .entry{grid-template-columns:minmax(0,1fr)}
  .entry h3,.entry__body{grid-column:1}
  .entry__fig{grid-column:1;grid-row:auto;margin-top:28px;max-width:440px}
  .entry__note{grid-column:1;grid-row:auto;margin-top:26px;max-width:48ch}
}

/* ---------- full bleed ---------- */
.bleed{margin:clamp(20px,4vw,44px) 0 0}
.bleed img{
  width:100%;height:auto;
  aspect-ratio:2200 / 1100;
  object-fit:cover;
  object-position:50% 62%;
}

/* ---------- what to say ---------- */
.call{background:var(--panel);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-top:clamp(40px,6vw,72px)}
.call__in{
  max-width:1180px;margin:0 auto;
  padding:clamp(48px,7vw,88px) var(--pad);
}
.call h2{font-size:var(--s5);max-width:20ch}
.call__lead{font-size:var(--s4);max-width:34ch;margin-top:20px;line-height:1.5}
.say{
  list-style:none;margin:0;padding:0;
  max-width:62ch;
}
@media (min-width:1000px){
  .call__in{
    display:grid;
    grid-template-columns:minmax(0,360px) minmax(0,1fr);
    column-gap:clamp(40px,6vw,90px);
    align-items:start;
  }
  .call__left{grid-column:1;grid-row:1 / span 2}
  .say{grid-column:2;grid-row:1}
  .call__close{grid-column:2;grid-row:2;margin-top:26px}
}
.say li{
  border-top:1px solid var(--rule);
  padding:16px 0;
}
.cta--plain{font-size:var(--s4)}
.cta--plain a{
  font-weight:600;text-decoration:none;
  border-bottom:2px solid var(--accent);
  display:inline-block;padding:8px 0;
}
.cta--plain a:hover{color:var(--accent)}
.call__close{margin-top:30px;max-width:62ch;color:var(--muted);font-size:var(--s2);line-height:1.6}
.call .cta{margin-top:32px}
@media (max-width:999px){.say{margin-top:34px}}

/* ---------- where ---------- */
.where{
  max-width:1180px;margin:0 auto;
  padding:clamp(48px,7vw,88px) var(--pad) clamp(44px,6vw,72px);
}
.facts{
  margin:0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(228px,1fr));
  gap:0;
  border-top:1px solid var(--rule);
}
.facts>div{
  padding:26px clamp(20px,3vw,34px) 30px 0;
}
.facts dt{
  font-size:var(--s1);letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);font-weight:600;margin-bottom:10px;
}
.facts dd{margin:0;line-height:1.55}
.facts a{color:var(--ink);text-decoration:none;border-bottom:2px solid var(--accent);display:inline-block;padding:5px 0}
.facts a:hover{color:var(--accent)}

/* ---------- footer ---------- */
.foot{background:var(--panel);border-top:1px solid var(--rule)}
.foot__in{
  max-width:1180px;margin:0 auto;
  padding:clamp(40px,5vw,64px) var(--pad) clamp(48px,6vw,72px);
}
.foot__name{font-size:var(--s4);font-weight:600}
.foot__in>p{margin-top:8px;font-size:var(--s2)}
.foot__note{color:var(--muted);max-width:74ch;line-height:1.6;margin-top:18px !important}
.foot a{color:var(--ink);text-decoration:none;border-bottom:2px solid var(--accent);display:inline-block;padding:5px 0}
.foot a:hover{color:var(--accent)}

/* ---------- motion ---------- */
.js [data-lift]{opacity:0;transform:translateY(14px)}
.js [data-lift].is-in{
  opacity:1;transform:none;
  transition:opacity .7s ease, transform .7s cubic-bezier(.22,.61,.36,1);
}
@media (prefers-reduced-motion:reduce){
  .js [data-lift]{opacity:1;transform:none}
  .js [data-lift].is-in{transition:none}
}

@media (max-width:640px){
  :root{--s5:26px;--s6:33px;--s4:20px}
  h1{max-width:20ch}
  .anchors a{margin-right:26px;padding:14px 0}
}
