/* ==========================================================================
   Restaurant SEO Kit — refined hospitality design system
   Fraunces (display) / Hanken Grotesk (text). Restraint over noise.
   ========================================================================== */
:root{
  --ink:#211d18; --teal:#123a4b; --teal-2:#0d2c39; --coral:#d2533a; --coral-dk:#b8412b;
  --gold:#c79a52; --paper:#ffffff; --cream:#f8f4ec; --cream-2:#f1ebe0;
  --muted:#6e6459; --line:rgba(18,58,75,.12); --line-2:rgba(18,58,75,.18);
  --maxw:1160px; --gutter:clamp(22px,5vw,56px); --sp:clamp(64px,9vw,120px);
  --radius:14px; --shadow:0 24px 60px -34px rgba(18,58,75,.40);
  --ease:cubic-bezier(.22,.61,.36,1); --head-h:74px;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:hidden; }
html body{
  margin:0; background:var(--paper); color:var(--ink); overflow-x:hidden; max-width:100%;
  font-family:'Hanken Grotesk',system-ui,sans-serif !important;
  font-size:clamp(15.5px,1vw,17px); line-height:1.7; -webkit-font-smoothing:antialiased; letter-spacing:.002em;
}
html body h1,html body h2,html body h3,html body h4,html body .wp-block-heading,html body .entry-title{
  font-family:'Fraunces','Playfair Display',Georgia,serif !important; color:var(--teal);
  font-weight:560; line-height:1.1; letter-spacing:-.012em; font-optical-sizing:auto; text-wrap:balance; margin:0 0 .5em;
}
html body a{ color:var(--coral-dk); text-decoration:none; } html body a:hover{ color:var(--coral); }
img{ max-width:100%; height:auto; display:block; }

.rsk-eyebrow{ display:inline-block; font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:.72rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--coral-dk); margin:0 0 .9rem; }

/* ==========================================================================
   Hide theme header/footer — kit renders its own
   ========================================================================== */
.site-header,.elementor-location-header,.site-footer,.page-footer{ display:none !important; }

/* ==========================================================================
   Custom header — transparent over hero, solid on scroll
   ========================================================================== */
.rsk-head{ position:fixed; inset:0 0 auto 0; z-index:300; height:var(--head-h); background:var(--teal);
  display:flex; align-items:center; border-bottom:1px solid rgba(255,255,255,.1); transition:background .35s var(--ease),box-shadow .35s; }
.rsk-head__inner{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter);
  display:flex; align-items:center; gap:24px; }
.rsk-head__brand{ display:flex; align-items:center; margin-right:auto; text-decoration:none;
  font-family:'Fraunces',serif; font-weight:600; font-size:1.4rem; letter-spacing:-.02em; color:#fff; }
.rsk-head__logo{ height:46px; width:auto; display:block; }
.rsk-head__nav{ display:flex; gap:30px; align-items:center; }
.rsk-head__nav a{ color:rgba(255,255,255,.88); font-weight:500; font-size:.95rem; text-decoration:none; position:relative; transition:color .25s; }
.rsk-head__nav a::after{ content:""; position:absolute; left:0; right:0; bottom:-6px; height:1.5px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.rsk-head__nav a:hover{ color:#fff; } .rsk-head__nav a:hover::after{ transform:scaleX(1); }
.rsk-head__cta{ font-weight:600; font-size:.9rem; letter-spacing:.02em; color:#fff; background:var(--coral); border:1.5px solid var(--coral);
  padding:10px 24px; border-radius:999px; text-decoration:none; transition:all .25s var(--ease); white-space:nowrap; }
.rsk-head__cta:hover{ background:var(--coral-dk); border-color:var(--coral-dk); transform:translateY(-1px); }
.rsk-head__toggle{ display:none; background:none; border:0; color:#fff; font-size:1.5rem; cursor:pointer; line-height:1; }
.rsk-head.rsk-scrolled{ background:var(--teal-2); box-shadow:0 12px 30px -22px rgba(0,0,0,.6); }

/* ==========================================================================
   Content scaffolding (within Hello's .entry-content)
   ========================================================================== */
/* Hello Elementor constrains + centers .site-main (content-width); force full width so our sections control layout. */
body .site-main, body .site-main > article, body .page-content, body .entry-content{
  max-width:100% !important; width:100% !important; margin:0 !important; padding:0 !important; }
/* WP core align* uses 100vw breakout (incl. scrollbar) → overflow. Content is already full-width, so pin to 100%. */
.page-content .alignfull, .entry-content .alignfull{
  width:100% !important; max-width:100% !important; margin-left:0 !important; margin-right:0 !important; }
.page-content .alignwide, .entry-content .alignwide{
  width:auto !important; max-width:var(--maxw) !important; margin-left:auto !important; margin-right:auto !important; }
.rsk-wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.wp-block-group.alignfull{ padding-block:var(--sp); }
.wp-block-group.alignfull + .wp-block-group.alignfull{ padding-top:0; } /* avoid double gaps when stacking same bg */
.rsk-band-cream{ background:var(--cream); }
.rsk-band{ background:var(--teal); color:#f3ede3; }
.rsk-band h2,.rsk-band h3,.rsk-band .rsk-nap__name{ color:#fff !important; }
.rsk-band .rsk-eyebrow{ color:var(--gold); }

.entry-content h2{ font-size:clamp(1.7rem,3.2vw,2.5rem); }
.entry-content h3{ font-size:clamp(1.15rem,1.7vw,1.4rem); color:var(--ink); }
.entry-content p{ max-width:64ch; }

/* ==========================================================================
   Hero (wp:cover)
   ========================================================================== */
.wp-block-cover.alignfull{ min-height:clamp(520px,82vh,820px); align-items:center; justify-content:center;
  text-align:center; margin:0; }
.wp-block-cover .wp-block-cover__background{
  background:linear-gradient(180deg,rgba(13,28,37,.34) 0%,rgba(13,28,37,.30) 45%,rgba(13,28,37,.62) 100%) !important;
  opacity:1 !important; }
.wp-block-cover__inner-container{ max-width:760px; padding:calc(var(--head-h) + 20px) var(--gutter) 30px; }
.wp-block-cover .rsk-eyebrow{ color:var(--gold); letter-spacing:.26em; }
.wp-block-cover h1,.wp-block-cover h2{ color:#fff !important; font-weight:500;
  font-size:clamp(2.1rem,4.6vw,3.7rem); line-height:1.06; margin:0 0 .5em; text-shadow:0 1px 24px rgba(0,0,0,.18); }
.wp-block-cover p{ color:rgba(255,255,255,.92); font-size:clamp(1rem,1.35vw,1.2rem); max-width:54ch; margin:0 auto 1.8em; }

/* Hero YouTube background video — covers the image, under the dim overlay + text.
   image:z0, video:z0 (paints above image via DOM order), overlay:z1 (core), text:z1 (core, above overlay via DOM). */
.wp-block-cover.rsk-has-video .wp-block-cover__image-background{ z-index:0; }
.rsk-hero-video{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; background:var(--teal-2); }
.rsk-hero-video iframe{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:100vw; height:56.25vw; min-height:100%; min-width:177.78vh; border:0; pointer-events:none; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.rsk-btn,.rsk-reserve-btn,.wp-block-button__link,.wp-block-button .wp-element-button{
  display:inline-block; background:var(--coral); color:#fff !important; font-family:'Hanken Grotesk',sans-serif;
  font-weight:600; font-size:.96rem; letter-spacing:.01em; padding:14px 30px; border-radius:999px; border:1.5px solid var(--coral);
  text-decoration:none; transition:all .22s var(--ease); }
.rsk-btn:hover,.rsk-reserve-btn:hover,.wp-block-button__link:hover,.wp-block-button .wp-element-button:hover{
  background:var(--coral-dk); border-color:var(--coral-dk); transform:translateY(-1px); }
.rsk-btn-ghost{ background:transparent; color:#fff !important; border-color:rgba(255,255,255,.6); }
.rsk-btn-ghost:hover{ background:#fff; color:var(--teal) !important; border-color:#fff; }
.wp-block-buttons{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:.4rem; }

/* ==========================================================================
   Columns + cards (hairline, restrained)
   ========================================================================== */
.wp-block-columns{ display:flex; gap:clamp(18px,2.2vw,28px); align-items:stretch; flex-wrap:wrap; }
.rsk-card,.wp-block-column.rsk-card{ flex:1; min-width:240px; background:var(--paper); border:1px solid var(--line);
  border-radius:var(--radius); padding:30px; transition:transform .35s var(--ease),box-shadow .35s,border-color .35s; }
.rsk-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--line-2); }
.rsk-card h3{ color:var(--teal); margin:.6rem 0 .35rem; font-size:1.25rem; }
.rsk-card p{ color:var(--muted); font-size:.97rem; margin:0; }
.rsk-card .wp-block-image{ margin:0 0 4px; } .rsk-card .wp-block-image img{ border-radius:10px; aspect-ratio:3/2; object-fit:cover; width:100%; }
.rsk-band .rsk-card{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.16); }
.rsk-band .rsk-card p{ color:rgba(243,237,227,.82); }

/* section heading block */
.rsk-band-cream .rsk-eyebrow,.entry-content .rsk-eyebrow{ }

/* ==========================================================================
   Ticker — slim, understated
   ========================================================================== */
.rsk-ticker{ background:var(--teal-2); color:#e8e0d3; overflow:hidden; white-space:nowrap; padding:11px 0;
  font-family:'Hanken Grotesk',sans-serif; font-size:.74rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.rsk-ticker__track{ display:inline-block; padding-left:100%; animation:rsk-marq 42s linear infinite; }
.rsk-ticker span{ padding:0 1rem; opacity:.85; } .rsk-ticker b{ color:var(--gold); font-weight:700; }
@keyframes rsk-marq{ to{ transform:translateX(-100%); } }

/* ==========================================================================
   Menu — clean typographic rows
   ========================================================================== */
.rsk-menu{ display:block; margin:1.2rem auto 0; max-width:720px; }
.rsk-menu__item{ display:grid; grid-template-columns:1fr auto; align-items:baseline; column-gap:18px;
  padding:18px 0; border-bottom:1px solid var(--line); }
.rsk-menu__item:first-child{ border-top:1px solid var(--line); }
.rsk-menu__name{ font-family:'Fraunces',serif; font-weight:560; color:var(--teal); font-size:1.18rem; }
.rsk-menu__price{ font-family:'Fraunces',serif; font-weight:600; color:var(--coral-dk); font-size:1.05rem; font-variant-numeric:tabular-nums; }
.rsk-menu__desc{ grid-column:1/-1; color:var(--muted); font-size:.95rem; margin-top:5px; max-width:62ch; line-height:1.55; }

/* ==========================================================================
   Gallery
   ========================================================================== */
.wp-block-gallery{ display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:14px !important;
  max-width:var(--maxw); margin-inline:auto !important; justify-content:center; }
.wp-block-gallery .wp-block-image{ width:100% !important; max-width:100% !important; margin:0 !important; overflow:hidden; border-radius:12px; }
.wp-block-gallery img{ width:100% !important; height:auto !important; aspect-ratio:1; object-fit:cover; display:block; transition:transform .7s var(--ease); }
.wp-block-gallery .wp-block-image:hover img{ transform:scale(1.06); }
.entry-content .wp-block-image img{ border-radius:12px; }

/* Instagram-style feed */
.rsk-ig__head{ text-align:center; max-width:620px; margin:0 auto 38px; }
.rsk-ig__head h2{ margin:.2rem 0 .5rem; }
.rsk-ig__head .rsk-btn{ margin-top:12px; }
.rsk-ig__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; max-width:var(--maxw); margin-inline:auto; }
.rsk-ig__tile{ position:relative; display:block; overflow:hidden; border-radius:12px; aspect-ratio:1; }
.rsk-ig__tile img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--ease); }
.rsk-ig__tile:hover img{ transform:scale(1.06); }
.rsk-ig__icon{ position:absolute; inset:0; display:grid; place-items:center; color:#fff; opacity:0; background:rgba(13,28,37,0); transition:.28s var(--ease); }
.rsk-ig__tile:hover .rsk-ig__icon{ opacity:1; background:rgba(13,28,37,.42); }
.rsk-ig__icon svg{ width:34px; height:34px; }
@media (max-width:880px){ .rsk-ig__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:520px){ .rsk-ig__grid{ grid-template-columns:repeat(2,1fr); } }

/* ==========================================================================
   NAP / hours / map
   ========================================================================== */
.rsk-nap{ font-style:normal; display:grid; gap:3px; font-size:1.05rem; line-height:1.5; }
.rsk-nap__name{ font-family:'Fraunces',serif; font-weight:600; font-size:1.3rem; color:var(--teal); margin-bottom:2px; }
.rsk-nap__phone{ color:var(--coral-dk); font-weight:600; text-decoration:none; margin-top:6px; }
.rsk-hours{ list-style:none; margin:.3rem 0; padding:0; max-width:380px; }
.rsk-hours__row{ display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--line); }
.rsk-hours__day{ font-weight:600; color:var(--teal); } .rsk-hours__time{ color:var(--muted); }
.rsk-band .rsk-hours__row{ border-color:rgba(255,255,255,.16); }
.rsk-band .rsk-hours__day{ color:#fff; } .rsk-band .rsk-hours__time{ color:rgba(243,237,227,.7); }
.rsk-band .rsk-nap,.rsk-band .rsk-nap__phone{ color:#f3ede3; } .rsk-band .rsk-nap__phone{ color:var(--gold); }
.rsk-map{ border-radius:var(--radius); margin:.6rem 0 0; width:100%; min-height:320px; box-shadow:var(--shadow); }

/* ==========================================================================
   Footer
   ========================================================================== */
.rsk-footer{ background:var(--teal-2); color:#cdd6d3; }
.rsk-footer__top{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; padding:var(--sp) var(--gutter) 44px;
  max-width:var(--maxw); margin-inline:auto; }
.rsk-footer h4{ font-family:'Fraunces',serif; color:#fff; font-size:1.5rem; margin:0 0 16px; }
.rsk-footer .rsk-eyebrow{ color:var(--gold); }
.rsk-footer a{ color:#cdd6d3; } .rsk-footer a:hover{ color:var(--gold); }
.rsk-footer .rsk-nap__name{ color:#fff; } .rsk-footer .rsk-nap,.rsk-footer .rsk-hours{ color:#aab6b4; }
.rsk-footer .rsk-hours__day{ color:#eef2f1; } .rsk-footer .rsk-hours__time{ color:#8a9794; }
.rsk-footer .rsk-hours__row{ border-color:rgba(255,255,255,.1); }
.rsk-footer__menu{ list-style:none; margin:0; padding:0; display:grid; gap:11px; }
.rsk-footer__social{ display:flex; gap:12px; margin-top:18px; }
.rsk-footer__social a{ width:40px; height:40px; display:grid; place-items:center; border-radius:50%;
  border:1px solid rgba(255,255,255,.2); color:#fff; font-weight:600; font-size:.8rem; transition:.22s; }
.rsk-footer__social a:hover{ background:var(--coral); border-color:var(--coral); }
.rsk-footer__bar{ border-top:1px solid rgba(255,255,255,.1); padding:22px var(--gutter); text-align:center;
  font-size:.84rem; color:#8a9794; max-width:var(--maxw); margin-inline:auto; }
.rsk-footer__bar b{ font-family:'Fraunces',serif; color:#fff; font-weight:500; }

/* ==========================================================================
   Motion
   ========================================================================== */
.rsk-reveal{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease),transform .8s var(--ease); }
.rsk-reveal.rsk-in{ opacity:1; transform:none; }
.wp-block-cover .rsk-reveal{ opacity:1; transform:none; } /* never hide hero text */
@media (prefers-reduced-motion:reduce){ .rsk-reveal{ opacity:1; transform:none; } .rsk-ticker__track{ animation:none; padding-left:0; text-align:center; } }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:880px){
  .rsk-head__nav{ display:none; } .rsk-head__toggle{ display:block; }
  .rsk-head.rsk-open .rsk-head__nav{ display:flex; position:absolute; top:var(--head-h); left:0; right:0; flex-direction:column;
    background:var(--teal-2); padding:18px var(--gutter); gap:16px; box-shadow:var(--shadow); }
  .rsk-head.rsk-open .rsk-head__nav a{ color:#fff; }
  .rsk-footer__top{ grid-template-columns:1fr; gap:34px; }
  .wp-block-gallery{ grid-template-columns:repeat(2,1fr); }
}
