/* KNIGHTLY / editorial direction
   Quiet typography, real coffee information, original letters.
   Loaded after legacy refinements to give the site one considered type scale. */
:root {
  --knightly-display: "Cormorant Garamond", Georgia, serif;
  --knightly-subhead: "IM Fell Double Pica", Georgia, serif;
  --knightly-body: "Roboto", Arial, sans-serif;
}

body { font-family:var(--knightly-body); }
.display-text,
.hero h1,
.display-text em,
.hero h1 em {
  font-family:var(--knightly-display)!important;
  font-weight:400!important;
  text-transform:none;
  text-wrap:balance;
  letter-spacing:-.027em;
}
.display-text,.hero h1 { line-height:1.04; }
.display-text em,.hero h1 em { font-style:italic; color:#c7a982; }
.hero h1 { font-size:clamp(80px,9vw,139px);line-height:.95; }
.philosophy-copy .display-text { font-size:clamp(72px,7.4vw,116px); }
.ritual-content .display-text { font-size:clamp(75px,8.2vw,129px); }
.heritage-statement .display-text { font-size:clamp(80px,9vw,140px); }
.horsemen-copy .display-text { font-size:clamp(67px,6.5vw,98px); }
.letter-heading .display-text { font-size:clamp(60px,6.3vw,92px);line-height:1.05; }
.menu-intro .display-text { font-size:clamp(79px,7.9vw,116px); }
.atmosphere-content .display-text { font-size:clamp(73px,6.9vw,107px); }
.invitation-inner .display-text { font-size:clamp(92px,9.6vw,143px);line-height:1.03; }

.editorial-paragraph,
.menu-item h3,
.visit-details address,
.visit-details .hours,
.visit-details .contact-phone,
.mobile-nav a {
  font-family:var(--knightly-subhead)!important;
  font-weight:400!important;
  letter-spacing:0;
}
.editorial-paragraph {font-size:clamp(25px,2.55vw,34px);line-height:1.45;max-width:630px;}
.menu-item h3 {font-size:clamp(24px,2.15vw,32px);line-height:1.25;}
.visit-details address,.visit-details .hours,.visit-details .contact-phone {
  font-size:clamp(23px,2.4vw,33px);line-height:1.34;overflow-wrap:normal;
}
.desktop-nav a,.header-visit,.menu-tab,.eyebrow,.chapter-rule {
  font-family:var(--knightly-body)!important;
  font-weight:400!important;
  letter-spacing:.065em;
}
.desktop-nav a,.header-visit {font-size:11px;}
.underlined-link {font-family:var(--knightly-body)!important;}
.hero-description {font-family:var(--knightly-body)!important;font-size:18px;}

/* Original invitations: only one artwork visible at once.
   No mock picture frame, dark filler card, or artificial writing animation. */
.founder-letter {
  padding:clamp(95px,9vw,140px) 24px clamp(95px,10vw,150px);
  background:#14100e;
  overflow:hidden;
}
.letter-heading {margin:0 auto 42px;max-width:1100px;}
.letter-heading .display-text {max-width:100%;}
.letter-carousel {width:min(100%,550px);margin:0 auto;}
.letter-carousel-stage {
  width:100%;
  aspect-ratio:1122 / 1402;
  position:relative;
  overflow:hidden;
  background:#19120e;
}
.letter-slide {
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  visibility:hidden;
  transform:translateX(12px);
  transition:opacity .75s ease, transform .75s cubic-bezier(.2,.7,.25,1),visibility 0s linear .75s;
  pointer-events:none;
}
.letter-slide.is-active {
  visibility:visible;
  opacity:1;
  transform:translateX(0);
  transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.25,1);
  pointer-events:auto;
}
.letter-slide img {
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:contain;
  filter:none;
  clip-path:none!important;
  transform:none!important;
}
.letter-carousel-controls {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  padding-top:27px;
  min-height:60px;
}
.letter-choice,.letter-playback {
  background:none;
  border:0;
  padding:7px 0;
  font:400 13px/1.5 var(--knightly-body);
  color:#908073;
  cursor:pointer;
  transition:color .2s ease;
}
.letter-choice.is-active {color:#e9dfd0;border-bottom:1px solid #bda17c;}
.letter-choice:hover,.letter-playback:hover {color:#fff;}
.letter-choice:focus-visible,.letter-playback:focus-visible {
  outline:1px solid #c7a982;outline-offset:5px;
}
.letter-control-divider {width:1px;height:12px;background:#524539;}
.letter-playback {margin-left:22px;color:#b1a399;font-size:12px;}
.letter-playback[aria-pressed="true"] {color:#e3d2bd;}

/* A coffee section worth keeping: profiles from the owner's supplier list.
   Editorial layout instead of false tasting-note cards. */
.bean-collection {
  background:#e7ddcc;
  color:#241a13;
  padding:clamp(110px,10vw,160px) clamp(26px,7vw,115px) clamp(120px,10vw,165px);
  display:grid;
  grid-template-columns:minmax(0, .82fr) minmax(0, 1.2fr);
  gap:clamp(45px,7.5vw,125px);
  align-items:start;
}
.bean-intro {position:sticky;top:125px;max-width:520px;}
.bean-intro .display-text {
  color:#2b2018;
  font-size:clamp(58px,6.3vw,99px);
  line-height:.98;
  margin:0 0 28px;
  overflow-wrap:normal;
}
.bean-intro .display-text em {color:#897053;}
.bean-intro>p {
  font:400 17px/1.8 var(--knightly-body);
  color:#6d5b4d;
  max-width:370px;
  margin:0;
}
.bean-selections {min-width:0;}
.bean-group+.bean-group {margin-top:70px;}
.bean-group h3 {
  font:400 clamp(31px,3vw,44px)/1.15 var(--knightly-subhead);
  margin:0 0 18px;
  color:#2c2018;
  letter-spacing:0;
}
.bean-group-note {font:400 14px/1.7 var(--knightly-body);color:#78695b;margin:0 0 22px;max-width:380px;}
.bean-entry {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  padding:21px 0 22px;
  border-top:1px solid rgba(64,46,30,.23);
}
.bean-entry:last-child {border-bottom:1px solid rgba(64,46,30,.23);}
.bean-entry>div {min-width:0;}
.bean-entry h4 {
  font:400 clamp(22px,2.1vw,29px)/1.25 var(--knightly-subhead);
  letter-spacing:-.01em;
  margin:0;
  color:#32251d;
}
.bean-entry p {
  font:400 14px/1.65 var(--knightly-body);
  color:#7f6b57;
  margin:9px 0 0;
}
.bean-entry>span {
  flex:0 0 auto;
  font:400 11px/1.5 var(--knightly-body);
  letter-spacing:.09em;
  text-transform:uppercase;
  color:#8c7761;
  padding-top:7px;
}
.bean-group:last-child .bean-entry {padding:15px 0;}
.bean-group:last-child .bean-entry p {margin-top:4px;}

/* Desktop spacing remains structured, mobile gets natural line lengths. */
@media(max-width:980px) {
  .bean-collection {gap:50px;grid-template-columns:.85fr 1.15fr;padding-left:5vw;padding-right:5vw;}
  .bean-intro .display-text {font-size:clamp(49px,6.2vw,75px);}
}
@media(max-width:760px) {
  .hero h1 {font-size:clamp(68px,15vw,103px);line-height:.98;}
  .philosophy-copy .display-text {font-size:clamp(57px,12vw,87px);}
  .ritual-content .display-text {font-size:clamp(62px,12.5vw,90px);}
  .heritage-statement .display-text {font-size:clamp(71px,14vw,110px);}
  .horsemen-copy .display-text {font-size:clamp(60px,11.7vw,84px);}
  .letter-heading .display-text {font-size:clamp(49px,10.8vw,76px);}
  .menu-intro .display-text {font-size:clamp(74px,13vw,103px);}
  .atmosphere-content .display-text {font-size:clamp(58px,11.6vw,83px);}
  .invitation-inner .display-text {font-size:clamp(74px,14vw,107px);}
  .editorial-paragraph {font-size:clamp(23px,5.1vw,30px);}
  .menu-item h3 {font-size:clamp(25px,5.5vw,30px);}
  .visit-details address,.visit-details .hours,.visit-details .contact-phone {font-size:clamp(25px,5.6vw,32px);}
  .hero-description {font-size:16px;}
  .bean-collection {display:block;padding:100px 25px 110px;}
  .bean-intro {position:static;max-width:none;margin-bottom:58px;}
  .bean-intro .display-text {font-size:clamp(64px,12vw,82px);line-height:1;}
  .bean-intro>p {font-size:16px;}
  .bean-group h3 {font-size:36px;}
  .bean-entry {gap:12px;}
  .bean-entry h4 {font-size:clamp(23px,5.2vw,29px);}
  .bean-entry>span {font-size:10px;max-width:76px;text-align:right;}
  .founder-letter {padding:95px 25px 105px;}
  .letter-heading {margin-bottom:35px;}
  .letter-carousel {max-width:500px;}
  .letter-carousel-controls {padding-top:20px;gap:15px;}
  .letter-playback {margin-left:14px;}
}
@media(max-width:390px) {
  .hero h1 {font-size:clamp(58px,15vw,66px);}
  .ritual-content .display-text {font-size:clamp(54px,12vw,65px);}
  .horsemen-copy .display-text {font-size:clamp(53px,11.5vw,65px);}
  .atmosphere-content .display-text {font-size:clamp(53px,11.5vw,67px);}
  .bean-intro .display-text {font-size:clamp(57px,12vw,70px);}
}
@media(prefers-reduced-motion:reduce) {
  .letter-slide {transition:none!important;transform:none!important;}
}
