/* ==== One design language across the site, taken from the new Home (html.ed keeps its own home-ed.css).
   Loaded last on every other page. Six rules: one ground, one set of margins, one heading rhythm, no gradients
   over photographs, one button rule, one motion vocabulary (motion in site-ed.js). ==== */


/* 2 · one set of outer margins: the same as Home's grid */
html:not(.ed){--gx:clamp(20px,4.6vw,72px)}
html:not(.ed) .wrap{max-width:1440px}

/* 3 · one heading rhythm: Marsha set tight, as on Home */
html:not(.ed) .d1,html:not(.ed) .d2{line-height:.92;letter-spacing:-.01em}

/* 4 · no gradients over photographs: a flat Deep Red veil where words sit on a picture */
html:not(.ed) .hero .ph::before,html:not(.ed) .hero-one .ph::before{display:none!important}
html:not(.ed) .hero-one .ph::after{content:"";position:absolute;inset:0;height:auto;background:var(--dr)!important;opacity:.34;pointer-events:none}
html:not(.ed) .hero .ph::after{display:none!important}
@media (max-width:900px){
 html:not(.ed) .hf-fold>.sec.hf-copy{background:var(--dr)!important}
}

/* 4b · the menu sits on its own Deep Red strip above an opening photograph (as on Book a table), so nothing lies over the picture */
html:not(.ed):not(.sd) [data-hero]:is(.hero,.hero-one):not(.bk-hero){border-top:calc(var(--mb) + var(--nv)) solid var(--dr);box-sizing:border-box}

/* 5 · one button rule: the main ask is the filled box; the second ask is an italic line that draws its underline.
   The phone dock, the sticky bars and the masthead keep their boxes. */
html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *){border-color:transparent!important;background:none!important;padding:6px 0!important;font-style:italic;position:relative;flex:0 0 auto!important;text-align:left}
html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *)::before,
html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *)::after,
html:not(.ed) .hx-more::before,html:not(.ed) .hx-more::after,html:not(.ed) .sd-ix-go::before,html:not(.ed) .sd-ix-go::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor}
html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *)::before,html:not(.ed) .hx-more::before,html:not(.ed) .sd-ix-go::before{opacity:.32}
html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *)::after,html:not(.ed) .hx-more::after,html:not(.ed) .sd-ix-go::after{transform:scaleX(0);transform-origin:0 50%;transition:transform .3s cubic-bezier(.215,.61,.355,1)}
html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *):hover::after,html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *):focus-visible::after,
html:not(.ed) .hx-more:hover::after,html:not(.ed) .sd-ix-go:hover::after{transform:scaleX(1)}
html:not(.ed) a.cta:not(.cta-fill):not(.sticky-cta *):not(.mast *):not(.dock *):hover{color:inherit!important;background:none!important}
html:not(.ed) .hx-more,html:not(.ed) .sd-ix-go{position:relative;display:inline-block;text-decoration:none}
html:not(.ed) .cta-row{column-gap:24px}

/* 6 · motion: the same vocabulary as Home (set only once site-ed.js runs and motion is welcome) */
html.se-js:not(.se-calm) [data-se-h] .se-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
html.se-js:not(.se-calm) [data-se-h] .se-wi{display:inline-block;transform:translate3d(0,110%,0);opacity:0;transition:transform .9s cubic-bezier(.215,.61,.355,1) var(--d,0ms),opacity .9s cubic-bezier(.215,.61,.355,1) var(--d,0ms)}
html.se-js:not(.se-calm) [data-se-h].in .se-wi{transform:none;opacity:1}
html.se-js:not(.se-calm) [data-se-p]{transform:translate3d(0,16px,0);opacity:0;transition:transform .5s cubic-bezier(.215,.61,.355,1) var(--d,0ms),opacity .5s cubic-bezier(.215,.61,.355,1) var(--d,0ms)}
html.se-js:not(.se-calm) [data-se-p].in{transform:none;opacity:1}
/* photographs open through a mask while settling from 1.08 (replaces the old fade) */
html.se-js:not(.se-calm) .rv:not([data-hero] .rv):not(.sd-cover .rv){clip-path:inset(100% 0 0 0);transition:clip-path 1.2s cubic-bezier(.215,.61,.355,1)}
html.se-js:not(.se-calm) .rv:not([data-hero] .rv):not(.sd-cover .rv) img{opacity:1;transform:scale(1.08);transition:transform 1.2s cubic-bezier(.215,.61,.355,1)}
html.se-js:not(.se-calm) .rv.se-in:not([data-hero] .rv):not(.sd-cover .rv){clip-path:inset(0 0 0 0)}
html.se-js:not(.se-calm) .rv.se-in:not([data-hero] .rv):not(.sd-cover .rv) img{transform:none}
@media (max-width:860px){html.se-js:not(.se-calm) [data-se-h] .se-wi{transition-duration:.75s}html.se-js:not(.se-calm) .rv:not([data-hero] .rv),html.se-js:not(.se-calm) .rv:not([data-hero] .rv) img{transition-duration:1s}}
@media (prefers-reduced-motion:reduce){html:not(.ed) a.cta::after,html:not(.ed) .hx-more::after{transition:none}}

/* ==== Paper is the ground again (owner, Nov 2026): Paper on every light section, the events cream included;
   Almond stays the ink on Deep Red and the hero cards ==== */
html.sd:not(.ed){--cr:var(--pp)}
html:not(.ed) body,html:not(.ed) .sec.almond{background:var(--pp)}
html:not(.ed) .sec.almond{--gr:var(--pp)}
/* ==== One hero photograph on every page (owner, Nov 2026): where a hero carried two, it keeps the one the phone
   showed (or the first), at full width on every screen ==== */
html:not(.ed) .sec.hero[data-hero]:has(>.ph:nth-of-type(2)){grid-template-columns:minmax(0,1fr)!important}
html:not(.ed) .sec.hero[data-hero]:has(>.ph-m)>.ph:not(.ph-m),
html:not(.ed) .sec.hero[data-hero]:not(:has(>.ph-m))>.ph:nth-of-type(n+2){display:none!important}
html:not(.ed) .sec.hero[data-hero]:has(>.ph-m)>.ph-m{display:block!important}
/* owner, Nov 2026: no tint over photographs; the film layer is the only treatment */
html:not(.ed) .hero-one .ph::after,html:not(.ed) .hero .ph::after{display:none!important}
/* hero words on a photograph (Vouchers, Contact, Menus): on a solid Deep Red card, never loose on the picture */
html:not(.ed) .hero-one:not(.bk-hero) .hero-cap{background:var(--dr);padding:clamp(20px,2.4vw,32px) clamp(22px,2.6vw,36px);max-width:min(560px,calc(100% - 2 * var(--gx)));width:auto;right:auto}
html:not(.ed) .hero-one:not(.bk-hero) .hero-cap .cta-row{margin-top:6px}
