/*
Theme Name: Hello Elementor — Lavana
Theme URI: https://lavana.restaurant
Description: Child theme for Lavana Restaurant. Holds the 2026 design tokens, base typography and coded menu-page templates. Built to match the Lavana design canvas.
Author: Get Digitally
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-lavana
*/

/* ==========================================================================
   1. Design tokens — Lavana 2026
   ========================================================================== */
:root {
  /* Surfaces */
  --lv-bg:            #F4F1EA;  /* page background */
  --lv-bg-alt:        #D8D6CB;  /* banded / secondary surface */
  --lv-ink:           #2C2A26;  /* body text */
  --lv-navy:          #161A3C;  /* footer, deep surfaces */
  --lv-accent:        #232860;  /* links, buttons, rules */

  /* Derived */
  --lv-header-bg:     rgba(244, 241, 234, 0.96);
  --lv-rule:          rgba(35, 40, 96, 0.14);
  --lv-rule-strong:   rgba(35, 40, 96, 0.30);
  --lv-on-navy:       rgba(244, 241, 234, 0.86);
  --lv-on-navy-mute:  rgba(244, 241, 234, 0.55);
  --lv-on-navy-rule:  rgba(244, 241, 234, 0.18);

  /* Type */
  --lv-serif:         'EB Garamond', Georgia, 'Times New Roman', serif;
  --lv-display:       'Playfair Display', Georgia, serif;

  /* Layout */
  --lv-container:     1180px;
  --lv-gutter:        40px;
  --lv-gutter-sm:     22px;

  /* Tracking */
  --lv-track-xs:      0.26em;
  --lv-track-sm:      0.20em;
  --lv-track-md:      0.18em;
  --lv-track-lg:      0.12em;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
body.lv {
  background: var(--lv-bg);
  color: var(--lv-ink);
  font-family: var(--lv-serif);
  font-size: 17px;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
}

body.lv h1, body.lv h2, body.lv h3,
body.lv .lv-display {
  font-family: var(--lv-display);
  font-weight: 400;
  line-height: 1.08;
  color: var(--lv-accent);
}

body.lv a { color: var(--lv-accent); text-decoration: none; }

/* ==========================================================================
   3. Layout helpers
   ========================================================================== */
.lv-container {
  max-width: var(--lv-container);
  margin-inline: auto;
  padding-inline: var(--lv-gutter);
}

.lv-section      { padding-block: 96px; }
.lv-section--tight { padding-block: 72px; }

/* Eyebrow / label */
.lv-eyebrow {
  font-size: 11px;
  letter-spacing: var(--lv-track-xs);
  text-transform: uppercase;
  color: var(--lv-accent);
}

/* Buttons */
.lv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 14px 22px;
  font-family: var(--lv-serif);
  font-size: 12.5px;
  letter-spacing: var(--lv-track-md);
  text-transform: uppercase;
  white-space: nowrap;
  border-radius: 0;
  border: 1px solid transparent;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}
.lv-btn--solid   { background: var(--lv-accent); color: var(--lv-bg); }
.lv-btn--solid:hover  { background: var(--lv-navy); color: var(--lv-bg); }
.lv-btn--outline { background: transparent; color: var(--lv-accent); border-color: var(--lv-rule-strong); }
.lv-btn--outline:hover { border-color: var(--lv-accent); }

/* Rules */
.lv-hr { border: 0; border-top: 1px solid var(--lv-rule); margin: 0; }

/* ==========================================================================
   4. Responsive — single breakpoint, matching the design
   ========================================================================== */
@media (max-width: 820px) {
  .lv-container { padding-inline: var(--lv-gutter-sm); }
  .lv-section       { padding-block: 64px; }
  .lv-section--tight{ padding-block: 56px; }

  /* helpers carried over from the design canvas */
  [data-mob="gut"]          { padding-left: var(--lv-gutter-sm) !important;
                              padding-right: var(--lv-gutter-sm) !important; }
  [data-mob="nav-desktop"]  { display: none !important; }
  [data-mob="nav-mobile"]   { display: flex !important; }
  [data-mob="subnav"]       { overflow-x: auto; flex-wrap: nowrap !important; }
  [data-mob="hero-panel"]   { display: none !important; }
  [data-mob="tight"]        { padding-top: 56px !important;
                              padding-bottom: 56px !important; }
}