:root {
      --bg: #050403;
      --text: #f5eee6;
      --muted: #b9a99a;
      --line: rgba(255,255,255,.10);
      --gold: #c79a4b;
      --gold-soft: #e0bc78;
      --container: 1180px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }

    body {
      margin: 0;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      background:
        radial-gradient(circle at 15% 8%, rgba(199,154,75,.16), transparent 34%),
        radial-gradient(circle at 78% 20%, rgba(138,79,45,.20), transparent 32%),
        linear-gradient(180deg, #050403 0%, #0a0705 46%, #050403 100%);
      color: var(--text);
    }

    img {
      max-width: 100%;
      height: auto;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    .container {
      width: min(var(--container), calc(100% - 40px));
      margin-inline: auto;
    }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 30;
      background: rgba(5,4,3,.84);
      backdrop-filter: blur(18px);
      border-bottom: 1px solid var(--line);
    }

    .header-inner {
      min-height: 78px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      font-weight: 900;
      letter-spacing: .08em;
      font-size: 18px;
      white-space: nowrap;
    }

    .brand span,
    .hero-title span,
    .footer-logo span {
      color: var(--gold-soft);
    }

    .brand-mark {
      width: 42px;
      height: 34px;
      color: var(--gold-soft);
      flex: 0 0 auto;
    }

    .brand-logo {
      width: 48px;
      height: 48px;
      object-fit: contain;
      flex: 0 0 auto;
      filter: drop-shadow(0 10px 22px rgba(0,0,0,.34));
    }


    .hero-logo-full {
      display: block;
      width: 118px;
      height: auto;
      margin: 0 0 22px;
      object-fit: contain;
      filter: drop-shadow(0 18px 38px rgba(0,0,0,.42));
    }


    .hero-brand-lockup {
      display: inline-flex;
      align-items: center;
      gap: 18px;
      margin: 0 0 22px;
    }

    .hero-logo-full {
      width: 118px;
      height: auto;
      margin: 0;
      object-fit: contain;
      filter: drop-shadow(0 18px 38px rgba(0,0,0,.42));
      flex: 0 0 auto;
    }

    .hero-brand-text {
      font-weight: 950;
      letter-spacing: .08em;
      font-size: clamp(30px, 4vw, 54px);
      line-height: .92;
      color: var(--text);
      white-space: nowrap;
    }

    .hero-brand-text span {
      color: var(--gold-soft);
    }

    .hero-copy {
      max-width: 760px;
      padding: 38px;
    }

    .hero-subtitle {
      font-size: clamp(30px, 3.6vw, 54px);
      line-height: 1.02;
    }

    @media (max-width: 560px) {
      .hero-logo-full {
        width: 92px;
      }

      .hero-brand-lockup {
        gap: 14px;
        margin-bottom: 18px;
      }

      .hero-brand-text {
        font-size: clamp(22px, 7vw, 32px);
        white-space: normal;
      }

      .hero-copy {
        padding: 24px;
      }

      .hero-subtitle {
        font-size: clamp(27px, 8vw, 38px);
      }
    }

    .nav {
      display: flex;
      align-items: center;
      gap: 24px;
      color: var(--muted);
      font-size: 14px;
    }

    .nav a { transition: color .18s ease; }
    .nav a:hover { color: var(--text); }

    .social {
      display: flex;
      gap: 12px;
      color: var(--gold-soft);
      font-weight: 700;
    }

    .hero {
      position: relative;
      min-height: calc(100vh - 78px);
      display: flex;
      align-items: center;
      overflow: hidden;
      isolation: isolate;
      padding: 110px 0 96px;
      background:
        linear-gradient(90deg, rgba(5,4,3,.96) 0%, rgba(5,4,3,.82) 38%, rgba(5,4,3,.34) 67%, rgba(5,4,3,.68) 100%),
        linear-gradient(180deg, rgba(5,4,3,.20) 0%, rgba(5,4,3,.84) 100%),
        url("../images/hero-roastbeef.jpg") center right / cover no-repeat;
      border-bottom: 1px solid var(--line);
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      background:
        radial-gradient(circle at 18% 22%, rgba(199,154,75,.22), transparent 32%),
        radial-gradient(circle at 82% 52%, rgba(199,154,75,.10), transparent 28%);
    }

    .hero-copy {
      max-width: 720px;
      padding: 34px;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 30px;
      background: rgba(5,4,3,.50);
      backdrop-filter: blur(10px);
      box-shadow: 0 30px 90px rgba(0,0,0,.34);
    }

    .hero-title {
      margin: 0 0 12px;
      font-size: clamp(44px, 7vw, 98px);
      line-height: .86;
      letter-spacing: -.06em;
      font-weight: 950;
    }

    .hero-subtitle {
      margin: 0;
      font-size: clamp(30px, 4.2vw, 58px);
      line-height: .98;
      letter-spacing: -.045em;
      max-width: 720px;
    }

    .hero-text {
      margin: 24px 0 0;
      max-width: 610px;
      color: var(--muted);
      font-size: 18px;
      line-height: 1.7;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
      margin-top: 34px;
    }

    .button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 50px;
      padding: 0 22px;
      border-radius: 999px;
      font-weight: 800;
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
    }

    .button:hover { transform: translateY(-2px); }

    .button-primary {
      background: linear-gradient(135deg, var(--gold-soft), var(--gold));
      color: #120c07;
    }

    .button-secondary {
      border: 1px solid var(--line);
      color: var(--text);
      background: rgba(255,255,255,.035);
    }

    .hero-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 30px;
    }

    .badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 11px 14px;
      border: 1px solid var(--line);
      border-radius: 999px;
      color: var(--muted);
      background: rgba(255,255,255,.035);
      font-size: 14px;
    }

    .badge svg {
      width: 18px;
      height: 18px;
      color: var(--gold-soft);
    }

    .section {
      padding: 74px 0;
    }

    .section-heading {
      margin: 0 0 26px;
      font-size: clamp(32px, 4vw, 52px);
      letter-spacing: -.045em;
    }

    .card-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 22px;
    }

    .card {
      overflow: hidden;
      border-radius: 26px;
      border: 1px solid var(--line);
      background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
      box-shadow: 0 18px 55px rgba(0,0,0,.24);
    }

    .prepare-card {
      padding: 24px;
    }

    .prepare-card .icon {
      width: 40px;
      height: 40px;
      color: var(--gold-soft);
      margin-bottom: 14px;
    }

    .prepare-card h3,
    .menu-card h3 {
      margin: 0 0 8px;
      font-size: 23px;
      letter-spacing: -.02em;
    }

    .prepare-card p,
    .menu-card p {
      margin: 0 0 20px;
      color: var(--muted);
      line-height: 1.55;
    }

    .prepare-card picture,
    .menu-card picture {
      display: block;
      overflow: hidden;
      border-radius: 20px;
      background: #120d09;
    }

    .prepare-card img,
    .menu-card img {
      width: 100%;
      height: 230px;
      display: block;
      object-fit: cover;
    }

    .menu-card picture {
      border-radius: 0;
    }

    .menu-card img {
      height: 250px;
    }

    .menu-card-body {
      padding: 22px;
    }


    .menu-layout {
      display: grid;
      gap: 42px;
    }

    .menu-category {
      display: grid;
      gap: 18px;
    }

    .menu-category-title {
      display: flex;
      align-items: center;
      gap: 14px;
      margin: 0;
      font-size: clamp(26px, 3vw, 38px);
      letter-spacing: -.03em;
    }

    .menu-category-title::after {
      content: "";
      flex: 1;
      height: 1px;
      background: linear-gradient(90deg, rgba(224,188,120,.55), rgba(255,255,255,0));
    }

    .menu-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 22px;
    }

    .menu-card {
      display: flex;
      flex-direction: column;
      overflow: hidden;
      border-radius: 26px;
      border: 1px solid var(--line);
      background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
      box-shadow: 0 18px 55px rgba(0,0,0,.24);
      min-height: 100%;
    }

    .menu-card picture {
      display: block;
      overflow: hidden;
      background: #120d09;
      border-bottom: 1px solid rgba(255,255,255,.07);
      border-radius: 0;
    }

    .menu-card img {
      width: 100%;
      height: 190px;
      display: block;
      object-fit: cover;
    }

    .menu-card-body {
      display: grid;
      gap: 10px;
      padding: 20px;
    }

    .menu-head {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: start;
    }

    .menu-head h3 {
      margin: 0;
      font-size: 20px;
      line-height: 1.2;
      letter-spacing: -.02em;
    }

    .menu-price {
      color: var(--gold-soft);
      font-weight: 900;
      white-space: nowrap;
      font-size: 20px;
      line-height: 1.2;
    }

    .menu-weight {
      color: var(--text);
      font-weight: 700;
      font-size: 14px;
      letter-spacing: .02em;
    }

    .menu-desc {
      margin: 0;
      color: var(--muted);
      line-height: 1.55;
      font-size: 15px;
    }

    .menu-allergens {
      margin: 0;
      color: var(--gold-soft);
      font-size: 14px;
      font-style: italic;
    }

    .about {
      margin: 38px 0;
      padding: 70px 0;
      background:
        linear-gradient(90deg, rgba(199,154,75,.14), transparent),
        rgba(255,255,255,.035);
      border-block: 1px solid var(--line);
    }

    .about-inner {
      display: grid;
      grid-template-columns: .8fr 1.2fr;
      gap: 38px;
      align-items: center;
    }

    .about h2 {
      margin: 0 0 16px;
      font-size: clamp(32px, 4vw, 52px);
      letter-spacing: -.04em;
    }

    .about p {
      margin: 0;
      color: var(--muted);
      font-size: 18px;
      line-height: 1.75;
    }

    .about picture {
      display: block;
      overflow: hidden;
      border-radius: 28px;
      border: 1px solid var(--line);
    }

    .about img {
      width: 100%;
      height: 300px;
      display: block;
      object-fit: cover;
    }

    .launch {
      text-align: center;
      padding: 90px 0 110px;
    }

    .launch h2 {
      margin: 0 0 10px;
      font-size: clamp(38px, 5vw, 72px);
      letter-spacing: -.055em;
    }

    .launch p {
      margin: 0 0 28px;
      color: var(--muted);
      font-size: 18px;
    }

    .platforms {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 12px;
    }

    .platform,
    .platform-pickup {
      display: inline-flex;
      min-height: 46px;
      align-items: center;
      border-radius: 999px;
      padding: 0 18px;
      font-weight: 900;
      background: rgba(255,255,255,.06);
      border: 1px solid var(--line);
    }

    .platform-wolt { color: #63d8ff; }
    .platform-bolt { color: #4cff88; }
    .platform-bistro { color: #ffd15c; }
    .platform-pickup { color: var(--text); }

    .contact-box {
      width: min(760px, 100%);
      margin: 34px auto 0;
      padding: 24px;
      border-radius: 24px;
      border: 1px solid var(--line);
      background: rgba(255,255,255,.04);
      color: var(--muted);
      line-height: 1.65;
    }

    .contact-box strong { color: var(--text); }


    .mobile-nav {
      display: none;
      align-items: center;
      gap: 14px;
      margin-left: auto;
      font-weight: 850;
      font-size: 14px;
    }

    .mobile-nav a { color: var(--text); }
    .mobile-nav a:last-child { color: var(--gold-soft); }

    .hero-menu-link {
      display: inline-block;
      margin-top: 14px;
      color: var(--gold-soft);
      font-weight: 850;
      text-decoration: none;
    }

    .hero-menu-link:hover { text-decoration: underline; }

    .opening-status-text {
      font-weight: 850;
      color: var(--text);
    }

    .seo-links {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 18px;
      margin-top: 20px;
    }

    .seo-links a {
      color: var(--gold-soft);
      font-weight: 800;
      text-decoration: none;
    }

    .seo-links a:hover { text-decoration: underline; }

    .site-footer {
      border-top: 1px solid var(--line);
      color: var(--muted);
      background: #050403;
    }

    .footer-inner {
      min-height: 92px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      flex-wrap: wrap;
    }

    .footer-logo {
      font-weight: 950;
      letter-spacing: .08em;
      color: var(--text);
    }

    @media (max-width: 980px) {
      .nav { display: none; }
      .mobile-nav { display: flex; }
      .social { display: none; }

      .hero {
        min-height: auto;
        padding: 82px 0 70px;
        background-position: center center;
      }

      .hero-copy {
        max-width: 100%;
      }

      .card-grid,
      .about-inner {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 560px) {
      .container {
        width: min(100% - 28px, var(--container));
      }

      .header-inner { min-height: 70px; }
      .brand { font-size: 15px; }
      .social { display: none; }

      .hero {
        padding: 56px 0 52px;
      }

      .hero-copy {
        padding: 24px;
        border-radius: 22px;
      }

      .hero-actions {
        flex-direction: column;
        align-items: stretch;
      }

      .button { width: 100%; }
      .section { padding: 48px 0; }

      .prepare-card,
      .menu-card-body { padding: 20px; }

      .prepare-card img,
      .menu-card img { height: 210px; }

      .footer-inner {
        align-items: flex-start;
        flex-direction: column;
        padding: 24px 0;
      }
    }

  
html { scroll-padding-top: 92px; }