/* ===========================================================================
   Pages: how each band is composed — the heroes, the home page's sections,
   and the few page-specific arrangements. Shared pieces are in
   40-components.css; the widget vocabulary in 30-elementor.css.
   =========================================================================== */

/* ------------------------------------------------------------- the heroes */

/* The decor box at full scale: the photograph (the section's own Elementor
   background) seen through a cream frame of willow leaves and a black rule —
   the restaurant's signature box from the old site, now the whole first
   screen. The frame is an inset shadow (cream, over the photo), the leaves a
   masked ::after on it, the scrim a ::before inside it. */
body .elementor .hero,body .elementor .page-hero{
  isolation:isolate;display:flex;align-items:center;overflow:hidden;
  background-color:var(--navy-deep);background-size:cover;background-position:center;
  box-shadow:inset 0 0 0 var(--frame) var(--cream);
}
body .elementor .hero.hero-home{min-height:clamp(620px, 94vh, 1040px);padding:calc(var(--frame) + clamp(4rem, 3rem + 4vw, 7rem)) 0 calc(var(--frame) + clamp(6.5rem, 5rem + 4vw, 9rem))}
body .elementor .page-hero{min-height:clamp(440px, 64vh, 700px);padding:calc(var(--frame) + clamp(3.4rem, 2.4rem + 4vw, 6rem)) 0 calc(var(--frame) + clamp(3.6rem, 2.6rem + 4vw, 6.4rem))}
body .elementor .hero::before,body .elementor .page-hero::before{
  content:"";position:absolute;inset:var(--frame);z-index:-1;pointer-events:none;
  border:2px solid var(--navy-ink);
  background:
    radial-gradient(75% 70% at 50% 45%,rgba(8,19,48,.42),rgba(8,19,48,.78)),
    linear-gradient(180deg,rgba(8,19,48,.5),rgba(8,19,48,.25) 40%,rgba(8,19,48,.7));
}
body .elementor .hero::after,body .elementor .page-hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--navy);
  -webkit-mask:var(--willow-top) left top / auto var(--frame) repeat-x,var(--willow-bottom) left bottom / auto var(--frame) repeat-x,
               var(--willow-left) left top / var(--frame) auto repeat-y,var(--willow-right) right top / var(--frame) auto repeat-y;
          mask:var(--willow-top) left top / auto var(--frame) repeat-x,var(--willow-bottom) left bottom / auto var(--frame) repeat-x,
               var(--willow-left) left top / var(--frame) auto repeat-y,var(--willow-right) right top / var(--frame) auto repeat-y;
}
body .elementor .hero > .elementor-container,body .elementor .page-hero > .elementor-container{position:relative;z-index:2;width:100%;max-width:min(1180px,100%);padding-inline:calc(var(--frame) + var(--gutter))}
body .elementor .hero-copy > .elementor-widget-wrap,body .elementor .page-hero-copy > .elementor-widget-wrap{justify-content:center;text-align:center}
body .elementor .hero .elementor-widget.btnw,body .elementor .page-hero .elementor-widget.btnw{margin-inline:.35rem}

body .elementor .hero-emblem img{width:clamp(130px, 7vw + 80px, 210px);margin-inline:auto;filter:drop-shadow(0 18px 30px rgba(0,0,0,.45))}
body .elementor .elementor-widget.hero-emblem{margin-bottom:1.6rem}
body .elementor .hero .title-hero .elementor-heading-title{color:var(--cream);text-shadow:0 2px 30px rgba(8,19,48,.45)}
body .elementor .hero .title-hero .elementor-heading-title em{display:block;margin:.08em 0 .02em;font-size:.62em;line-height:1;font-stretch:var(--stretch-italic);text-transform:none;color:var(--brass-hi)}
body .elementor .hero-lede p{max-width:44ch;margin-inline:auto;text-wrap:balance}
body .elementor .hero .lede{font-size:clamp(1.18rem, 1.04rem + .6vw, 1.6rem)}
body .elementor .page-hero .title-page .elementor-heading-title{text-shadow:0 2px 30px rgba(8,19,48,.4)}
body .elementor .page-hero .title-page .elementor-heading-title em{display:inline-block;font-stretch:var(--stretch-italic);text-transform:none;font-weight:400}

/* short screens (a phone on its side): the hero must not hide its buttons */
@media (max-height:560px) and (orientation:landscape){
  body .elementor .hero{min-height:0}
  body .elementor .page-hero{min-height:0}
}

/* ---------------------------------------------------------------- welcome */

body .elementor .welcome-media > .elementor-widget-wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:end}
body .elementor .welcome-steak{grid-column:1 / 12;grid-row:1}
body .elementor .welcome-plate{grid-column:8 / 13;grid-row:1;align-self:end;margin:0 0 -12% 0;z-index:3}
body .elementor .welcome-media .elementor-widget{margin-bottom:0}
body .elementor .welcome-steak img{aspect-ratio:4 / 3.2}
@media (max-width:1024px){ body .elementor .welcome-media > .elementor-widget-wrap{padding-bottom:12%} }

/* -------------------------------------------------------------- the grill */

body .elementor .sec-grill-foot{padding-top:0}
body .elementor .grill-honor > .elementor-widget-wrap{position:sticky;top:calc(var(--header-h) + 2rem)}

/* --------------------------------------------------------- the salad bar */

body .elementor .salad-media > .elementor-widget-wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto;align-items:start}
body .elementor .salad-photo{grid-column:2 / 13;grid-row:1 / 3}
body .elementor .salad-plate-a{grid-column:1 / 5;grid-row:2;align-self:end;margin:0 0 -10% 0;z-index:3}
body .elementor .salad-plate-b{grid-column:10 / 13;grid-row:1;margin:-14% -6% 0 0;z-index:3}
body .elementor .salad-media .elementor-widget{margin-bottom:0}
body .elementor .salad-photo img{aspect-ratio:4 / 3.3}
@media (max-width:1024px){ body .elementor .salad-media > .elementor-widget-wrap{padding:6% 6% 10% 0} }

/* ------------------------------------------------- the certificates band */

body .elementor .gift-band-art > .elementor-widget-wrap{padding:3.5rem 0}
@media (max-width:1024px){ body .elementor .gift-band-art > .elementor-widget-wrap{padding:1rem 0 0} }

/* ---------------------------------------------------------- private rooms */

body .elementor .host-photo img{aspect-ratio:4 / 3}

/* ------------------------------------------------------------------ visit */

body .elementor .sec-visit{position:relative;isolation:isolate;overflow:hidden}
/* the building, in pen and ink, behind it all */
body .elementor .sec-visit::after{
  content:"";position:absolute;right:-6%;bottom:-2%;width:min(1100px,90vw);aspect-ratio:2000 / 914;z-index:0;pointer-events:none;
  background:var(--navy);opacity:.07;
  -webkit-mask:var(--sketch) center bottom / contain no-repeat;mask:var(--sketch) center bottom / contain no-repeat;
}
body .elementor .visit-hours > .elementor-widget-wrap{
  padding:clamp(1.6rem, 1rem + 2vw, 2.8rem);border-radius:var(--r-sm);background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow-2);position:relative;
}
body .elementor .visit-hours > .elementor-widget-wrap::before{content:"";position:absolute;inset:8px;border:1px solid rgba(20,41,90,.1);border-radius:3px;pointer-events:none}

/* ------------------------------------------------------------- menu page */

body .elementor .sec-menu{background:var(--paper)}
body .elementor .sec-menu > .elementor-container{max-width:min(1180px,100%)}

/* -------------------------------------------------------------- about */

body .elementor .story-photo img{aspect-ratio:3 / 2}
body .elementor .sec-sketch-band .sketch-art img{max-width:760px;margin-inline:auto}
body .elementor .sec-sketch-band .hours-card{max-width:480px}

/* ------------------------------------------------------------ the forms */

body .elementor .form-side > .elementor-widget-wrap{align-content:flex-start}
body .elementor .sec-form .contact{margin-top:1.4rem}

/* ----------------------------------------------------- gift certificates */

body .elementor .sec-builder{background:var(--paper)}
body .elementor .sec-builder > .elementor-container{max-width:min(1360px,100%)}

/* ------------------------------------------------------------ the map */

body .elementor .sec-map{background:var(--linen)}

/* ------------------------------------------------------------- 404 */

.bp .page-head-404{min-height:60vh;display:grid;align-content:center}
