@font-face {
      
      font-family: 'bigola_displayregular';
    src: url('../fonts/bigola_display_regular-webfont.woff2') format('woff2'),
         url('../fonts/bigola_display_regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;


    }



    :root {
      --orange: #ff5f2e;
      --orange-2: #ff7a4f;
      --coal: #080808;
      --ink: #111111;
      --panel: #171311;
      --cream: #fff1e4;
      --white: #ffffff;
      --muted: #beb6ad;
      --line: rgba(255, 255, 255, .13);
      --shadow: 0 24px 70px rgba(0, 0, 0, .38);
    }

    * { box-sizing: border-box; }

    html { scroll-behavior: smooth; }

    body {
      margin: 0;
     
      color: var(--white);
      background:
        linear-gradient(rgba(5, 5, 5, .82), rgba(5, 5, 5, .82)),
        url("../images/bgs.png") center top / cover fixed;
      letter-spacing: 0.5px !important;
    }

    img { display: block; max-width: 100%; }
    a { color: inherit; text-decoration: none; }
    button, input, select, textarea { font: inherit; }
    button { cursor: pointer; }

    .page {
      min-height: 100vh;
      overflow: hidden;
      background:
        radial-gradient(circle at 10% 0%, rgba(255, 95, 46, .18), transparent 22rem),
        linear-gradient(180deg, rgba(8, 8, 8, .92) 0%, rgba(21, 16, 14, .9) 52%, rgba(8, 8, 8, .94) 100%),
        url("../images/bgs.png") center top / cover fixed;
    }

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

    .topbar {
      color: var(--coal);
      background: var(--orange);
      font-size: 13px;
      font-weight: 400;
      overflow: hidden;
      white-space: nowrap;
      display: none;
    }

    .ticker {
      display: flex;
      width: max-content;
      animation: ticker 26s linear infinite;
    }

    .ticker span { padding: 9px 28px; }

    @keyframes ticker {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }

    .nav {
      position: absolute;
      top: 0;
      z-index: 20;
      /*! border-bottom: 1px solid var(--line); */
      background: transparent;
      /*! backdrop-filter: blur(18px); */
      width: 100%;
      padding: 0;
    }

    .nav-inner {
      min-height: 94px;
      display: grid;
      grid-template-columns: 350px 1fr auto;
      gap: 22px;
      align-items: center;
    }

    .brand img { width: 450px; height: auto; }

    .menu {
      display: flex;
      justify-content: center;
      gap: 20px;
      font-size: 12px;
      font-weight: 400;
      text-transform: uppercase;
      color: rgba(255, 255, 255, .82);
    }

    .menu a {
      padding: 12px 0;
      position: relative;
      white-space: nowrap;
      font-size: 18px;
      font-weight: 900;
      color: #fff;
    }

    .menu a::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 5px;
      width: 0;
      height: 2px;
      background: var(--orange);
      transition: width .25s ease;
    }

    .menu a:hover::after { width: 100%; }

    .nav-actions {
      display: flex;
      align-items: center;
      gap: 15px;
    }

    .icon-btn {
      width: 44px;
      height: 44px;
      border: 1px solid var(--line);
      border-radius: 999px;
      display: grid;
      place-items: center;
      background: rgba(255, 255, 255, .06);
      color: var(--white);
      position: relative;
    }

    .cart-count {
      position: absolute;
      top: -6px;
      right: -6px;
      width: 21px;
      height: 21px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: var(--coal);
      background: var(--orange);
      font-size: 11px;
      font-weight: 400;
    }

    .btn {
      min-height: 48px;
      border: 0;
      border-radius: 999px;
      padding: 0 23px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      color: #fff;
      background: var(--orange);
      font-weight: 900;
      box-shadow: 0 16px 46px rgba(255, 95, 46, .32);
      transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
      white-space: nowrap;
      text-transform: uppercase;
      border-radius: 8px;
    }

    .btn:hover {
      transform: translateY(-2px);
      background: var(--orange-2);
      box-shadow: 0 20px 56px rgba(255, 95, 46, .44);
    }

    .btn.ghost {
      color: var(--white);
      background: rgba(255, 255, 255, .08);
      border: 1px solid var(--line);
      box-shadow: none;
    }

    .btn.light {
      color: var(--coal);
      background: var(--cream);
      box-shadow: none;
    }

    /* Video banner - reference style */
    .hero {
      min-height: 760px;
      height: calc(100vh - 0px);
      max-height: 860px;
      position: relative;
      overflow: hidden;
      display: grid;
      align-items: center;
      justify-items: center;
      padding: 96px 0;
      text-align: center;
      background:
        linear-gradient(rgba(5, 5, 5, .58), rgba(5, 5, 5, .58)),
        url("https://images.unsplash.com/photo-1529193591184-b1d58069ecdd?auto=format&fit=crop&w=1900&q=86") center/cover;
      isolation: isolate;
    }

    .hero-video {
      position: absolute;
      inset: 0;
      z-index: -3;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      transform: scale(1.02);
      background: #080808;
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -2;
      background:
        linear-gradient(180deg, rgba(0, 0, 0, .34) 0%, rgba(0, 0, 0, .44) 45%, rgba(0, 0, 0, .62) 100%),
        radial-gradient(circle at 48% 48%, rgba(0, 0, 0, .08), rgba(0, 0, 0, .54) 72%);
      pointer-events: none;
    }

    .hero::after {
      content: "";
      position: absolute;
      inset: auto 0 0;
      height: 180px;
      z-index: -1;
      background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .72));
      pointer-events: none;
    }

    .hero-grid {
      position: relative;
      z-index: 2;
      width: min(1120px, calc(100% - 32px));
      display: grid;
      grid-template-columns: 1fr;
      place-items: center;
      gap: 0;
      margin: 0 auto;
    }

    .hero-content {
      width: min(920px, 100%);
      margin: 0 auto;
      text-align: center;
    }

    .smoke-title {
      margin: 0;
      color: #fff;
      /*! font-family: "Playfair Display", Georgia, "Times New Roman", serif; */
      font-size: 82px;
      font-weight: 400;
      line-height: .96;
      letter-spacing: -.035em;
      text-transform: none;
      text-shadow: 0 8px 42px rgba(0, 0, 0, .55);
      font-family: bigola_displayregular;
      letter-spacing: 1.5px;
    }

    .hero-divider {
      display: block;
      width: 126px;
      height: 4px;
      margin: 30px auto 28px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .92);
      box-shadow: 0 4px 18px rgba(0, 0, 0, .35);
    }

    .hero-subtitle {
      margin: 0 0 28px;
      color: #fff;
      /*! font-family: "Playfair Display", Georgia, "Times New Roman", serif; */
      font-size: 25px;
      font-weight: 400;
      line-height: 1.12;
      letter-spacing: -.02em;
      text-shadow: 0 7px 32px rgba(0, 0, 0, .55);
      font-family: bigola_displayregular;
    }

    .hero-banner-btn {
      min-height: 60px;
      padding: 0 34px;
      border-radius: 9px;
      color: #fff;
      background: #e74724;
      box-shadow: 0 18px 50px rgba(231, 71, 36, .36);
      font-family: "Playfair Display", Georgia, "Times New Roman", serif;
      font-size: 22px;
      font-weight: 800;
      text-transform: lowercase;
      letter-spacing: 0;
      font-family: bigola_displayregular;
      letter-spacing: 0;
    }

    .hero-banner-btn:hover {
      background: #ff5f2e;
      transform: translateY(-2px);
      box-shadow: 0 22px 62px rgba(231, 71, 36, .48);
    }

    @media (max-width: 920px) {
      .hero {
        min-height: 650px;
        height: auto;
        padding: 96px 0 86px;
      }

      .hero-divider {
        width: 100px;
        margin: 24px auto 22px;
      }
    }

    @media (max-width: 640px) {
      .hero {
        min-height: 590px;
        padding: 86px 0 74px;
      }

      .smoke-title {
        font-size: clamp(48px, 17vw, 78px);
      }

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

      .hero-banner-btn {
        min-height: 54px;
        padding: 0 26px;
        font-size: 19px;
      }
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: var(--orange);
      font-size: 13px;
      font-weight: 400;
      text-transform: uppercase;
    }

    .eyebrow::before {
      content: "";
      width: 40px;
      height: 2px;
      background: var(--orange);
    }

    h1, h2, h3, p { margin-top: 0; }

    h1, h2 {
      font-family: bigola_displayregular;
      font-weight: 400;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    h1 {
      margin: 18px 0 20px;
      font-size: clamp(70px, 10vw, 138px);
      line-height: .82;
    }

    h2 {
      margin: 18px 0 18px;
      font-size: 3.5vw;
      line-height: 1.06;
    }

    .orange-word { color: var(--orange); }

    .hero p,
    .section-head p,
    .card p,
    .info-card p,
    .faq-card p,
    .checkout-card p {
      color: rgba(255, 255, 255, .72);
      line-height: 1.72;
    }

    .hero-copy {
      max-width: 620px;
      font-size: 18px;
    }

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

    .hero-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 28px;
    }

    .hero-meta span {
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 10px 14px;
      color: rgba(255, 255, 255, .74);
      background: rgba(255, 255, 255, .06);
      font-size: 13px;
      font-weight: 800;
    }

    .hero-card {
      border: 1px solid var(--line);
      border-radius: 24px;
      padding: 20px;
      background: rgba(16, 14, 13, .78);
      box-shadow: var(--shadow);
      backdrop-filter: blur(18px);
      position: relative;
    }

    .deal {
      position: absolute;
      top: -22px;
      right: 22px;
      width: 88px;
      height: 88px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      text-align: center;
      color: var(--coal);
      background: var(--orange);
      font-weight: 400;
      transform: rotate(7deg);
      box-shadow: 0 18px 48px rgba(255, 95, 46, .34);
    }

    .deal strong { display: block; font-size: 25px; line-height: .9; }

    .feature-img {
      min-height: 300px;
      border-radius: 18px;
      display: grid;
      align-items: end;
      padding: 22px;
      overflow: hidden;
      background:
        linear-gradient(180deg, transparent 34%, rgba(0, 0, 0, .78)),
        url("https://images.unsplash.com/photo-1544025162-d76694265947?auto=format&fit=crop&w=900&q=86") center/cover;
    }

    .feature-img h3 { margin-bottom: 6px; font-size: 26px; }
    .feature-img p { margin: 0; color: rgba(255,255,255,.74); }

    .quick-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
      margin-top: 12px;
    }

    .quick-stats div {
      border: 1px solid var(--line);
      border-radius: 14px;
      padding: 14px 10px;
      text-align: center;
      background: rgba(255, 255, 255, .06);
    }

    .quick-stats strong {
      display: block;
      color: var(--orange);
      font-size: 19px;
    }

    .quick-stats span {
      color: rgba(255, 255, 255, .65);
      font-size: 12px;
      font-weight: 700;
    }

    section { padding: 92px 0; position: relative; }

    .section-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 520px);
      align-items: end;
      gap: 36px;
      margin-bottom: 38px;
    }

    .surface,
    .surface-2 {
      overflow: hidden;
      isolation: isolate;
    }

    .surface {
      background:
        radial-gradient(circle at 88% 10%, rgba(255, 95, 46, .13), transparent 22rem),
        linear-gradient(180deg, rgba(14, 14, 14, .9), rgba(10, 9, 8, .94)),
        url("../images/bgs.png") center top / cover fixed;
    }

    .surface-2 {
      background:
        radial-gradient(circle at 9% 18%, rgba(255, 95, 46, .12), transparent 24rem),
        linear-gradient(180deg, rgba(20, 16, 15, .9), rgba(12, 11, 10, .94)),
        url("../images/bgs.png") center top / cover fixed;
    }

    .surface::before,
    .surface-2::before,
    .orange-section::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      opacity: .22;
      background-image:
        radial-gradient(circle at 18px 18px, rgba(255, 95, 46, .38) 0 2px, transparent 2.5px),
        linear-gradient(135deg, transparent 0 42%, rgba(255, 95, 46, .14) 42% 43%, transparent 43% 100%);
      background-size: 92px 92px, 180px 180px;
      mask-image: linear-gradient(90deg, transparent, #000 20%, #000 82%, transparent);
    }

    .surface-2::before {
      opacity: .16;
      transform: rotate(180deg);
    }

    .warm-story {
      padding: 70px 0 80px;
      color: var(--ink);
      background:
        radial-gradient(circle at 85% 14%, rgba(255, 255, 255, .72), transparent 24rem),
        radial-gradient(circle at 50% 50%, rgba(231, 71, 36, .08), transparent 36rem),
        linear-gradient(180deg, #f6ecdc, #f1e3d0);
      overflow: hidden;
      isolation: isolate;
    }

    .warm-story::before {
      content: "";
      position: absolute;
      left: -26px;
      top: -80px;
      width: min(30vw, 430px);
      height: calc(100% + 160px);
      z-index: -1;
      opacity: .7;
      /*! background: url("data:image/svg+xml,%3Csvg width='420' height='930' viewBox='0 0 420 930' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23e74724' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M103 920C67 746 92 643 163 513C227 394 218 249 111 8'/%3E%3Cpath d='M72 922C42 759 61 654 139 508C201 393 194 250 91 28'/%3E%3Cpath d='M46 925C16 772 35 658 111 515C173 398 168 268 72 76'/%3E%3Cpath d='M132 919C105 767 124 658 199 526C270 402 271 264 156 4'/%3E%3Cpath d='M160 918C130 763 151 663 224 533C291 413 295 299 202 96'/%3E%3Cpath d='M20 866C11 744 41 657 95 552C143 459 150 360 99 195'/%3E%3Cpath d='M242 901C195 749 195 639 256 535C315 436 320 334 271 193'/%3E%3Cpath d='M278 892C231 752 229 650 279 554C328 460 342 381 312 256'/%3E%3C/g%3E%3C/svg%3E") left center / contain no-repeat; */
    }

    .warm-story::after {
      content: "";
      position: absolute;
      top: 0;
      right: 25px;
      width: 1px;
      height: 100%;
      /*! background: rgba(231, 71, 36, .72); */
      z-index: -1;
    }

    .warm-story-frame::after {
      /*! content: ""; */
      /*! position: absolute; */
      right: -54px;
      top: 50%;
      width: 18px;
      height: 18px;
      background: #e74724;
      transform: translateY(-50%) rotate(45deg);
      clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%);
    }

    .warm-story-frame {
      width: min(1480px, calc(100%));
      min-height: 560px;
      /*! margin: 0 auto; */
      display: grid;
      grid-template-columns: minmax(420px, .62fr) minmax(520px, 1fr);
      align-items: center;
      /*! gap: clamp(46px, 6vw, 94px); */
      /*! padding: 0 0 0 18%; */
      position: relative;
    }

    .story-copy {
      max-width: 470px;
      margin-left: 0;
      position: relative;
      z-index: 2;
    }

    .story-copy .eyebrow {
      color: #e74724;
      margin-bottom: 20px;
      font-size: 20px;
      letter-spacing: 0;
      justify-content: center;
    }

    .story-copy .eyebrow::before,
    .story-copy .eyebrow::after {
      /*! content: ""; */
      /*! width: 42px; */
      /*! height: 2px; */
      /*! background: #e74724; */
    }

    .story-copy h2 {
      margin: 0 0 30px;
      color: #20201e;
      /*! font-family: Impact, "Arial Black", Inter, sans-serif; */
      font-size: 50px;
      font-weight: 400;
      /*! line-height: .86; */
      /*! letter-spacing: 0; */
    }

    .story-copy h2 span {
      /*! display: block; */
    }

    .story-copy h2::after {
      content: "";
      display: block;
      width: 63px;
      height: 3px;
      margin-top: 28px;
      background: #e74724;
    }

    .story-copy p {
      color: #1d1c1a;
      /*! font-family: Georgia, "Times New Roman", serif; */
      font-size: 19px;
      line-height: 1.32;
      letter-spacing: 0;
    }

    .story-copy strong {
      display: block;
      margin-top: 18px;
      color: #e74724;
      /*! font-family: Georgia, "Times New Roman", serif; */
      font-size: 28px;
    }

    .story-photo {
      width: 100%;
      min-height: 451px;
      margin-right: 0;
      border-radius: 28px;
      background:
        linear-gradient(180deg, rgba(0, 0, 0, .04), rgba(0, 0, 0, .18)),
        url("../images/How-To-Cook-Restaurant.png") center/cover;
      box-shadow: 0 30px 82px rgba(43, 27, 18, .22);
    }

    .story-points {
      display: none;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 14px;
      width: min(1180px, calc(100% - 40px));
      margin: 24px auto 0;
    }

    .story-points .info-card {
      border-color: rgba(231, 71, 36, .3);
      background: rgba(255, 255, 255, .42);
      box-shadow: 0 18px 42px rgba(43, 27, 18, .12);
    }

    .story-points h3,
    .story-points p { color: #111; }

    .warm-story .actions {
      margin-top: 28px;
    }

    .warm-story .hero-banner-btn {
      min-width: 230px;
      min-height: 62px;
      border-radius: 8px;
      padding: 0 30px;
      color: #fff;
      background: linear-gradient(180deg, #f04f27, #df3217);
      font-family: Inter, Arial, sans-serif;
      font-size: 18px;
      font-weight: 400;
      letter-spacing: 2px;
      text-transform: uppercase;
      box-shadow: 0 18px 44px rgba(231, 71, 36, .26);
    }

    .grid-2 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 22px;
    }

    .grid-3 {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
    }

    .grid-4 {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
    }

    .card,
    .info-card,
    .faq-card,
    .checkout-card,
    .form-card {
      border: 1px solid var(--line);
      border-radius: 22px;
      background: rgba(255, 255, 255, .055);
      box-shadow: 0 18px 54px rgba(0, 0, 0, .22);
    }

    .card,
    .info-card,
    .faq-card,
    .checkout-card,
    .form-card { padding: 26px; }

    .card h3,
    .info-card h3,
    .faq-card h3,
    .checkout-card h3 { margin-bottom: 12px; font-size: 24px; }

    .info-card small {
      display: block;
      color: var(--orange);
      font-weight: 400;
      text-transform: uppercase;
      margin-bottom: 8px;
    }

    .menu-card {
      min-height: 260px;
      border-radius: 22px;
      overflow: hidden;
      position: relative;
      display: grid;
      align-items: end;
      box-shadow: var(--shadow);
      isolation: isolate;
      transition: transform .28s ease;
    }

    .menu-card:hover { transform: translateY(-8px); }

    .menu-card::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.84));
    }

    .menu-card.grill { background: url("https://images.unsplash.com/photo-1544025162-d76694265947?auto=format&fit=crop&w=850&q=84") center/cover; }
    .menu-card.bbq { background: url("https://images.unsplash.com/photo-1529193591184-b1d58069ecdd?auto=format&fit=crop&w=850&q=84") center/cover; }
    .menu-card.burger { background: url("https://images.unsplash.com/photo-1600891964092-4316c288032e?auto=format&fit=crop&w=850&q=84") center/cover; }
    .menu-card.side { background: url("https://images.unsplash.com/photo-1555939594-58d7cb561ad1?auto=format&fit=crop&w=850&q=84") center/cover; }

    .menu-card div { padding: 24px; }
    .menu-card h3 { font-family: bigola_displayregular; font-size: 29px; letter-spacing: .5px; margin: 0 0 6px; text-transform: uppercase; }
    .menu-card span { color: var(--orange); font-size: 13px; font-weight: 400; text-transform: uppercase; }

    .search-panel {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      border: 1px solid var(--line);
      border-radius: 20px;
      padding: 12px;
      background: rgba(255, 255, 255, .06);
      margin-bottom: 22px;
    }

    .search-panel input,
    .field {
      width: 100%;
      min-height: 54px;
      border: 1px solid rgba(255, 255, 255, .15);
      border-radius: 8px;
      padding: 0 16px;
      color: var(--white);
      background: rgba(255, 255, 255, .07);
      outline: 0;
    }

    .search-panel input {
      border: 0;
      background: transparent;
    }

    .search-panel input::placeholder,
    .field::placeholder { color: rgba(255, 255, 255, .5); }

    .product-card {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 22px;
      background: rgba(255, 255, 255, .05);
      box-shadow: 0 18px 54px rgba(0, 0, 0, .24);
    }

    .product-img {
      height: 220px;
      background-size: cover;
      background-position: center;
      position: relative;
    }

    .tag {
      position: absolute;
      top: 14px;
      left: 14px;
      border-radius: 999px;
      padding: 8px 12px;
      color: var(--coal);
      background: var(--orange);
      font-size: 11px;
      font-weight: 400;
      text-transform: uppercase;
    }

    .product-body { padding: 20px; }
    .product-body h3 { margin-bottom: 8px; font-size: 22px; }
    .product-body p { min-height: 50px; color: rgba(255,255,255,.68); line-height: 1.55; font-size: 14px; }

    .product-foot {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-top: 16px;
    }

    .price { color: var(--orange); font-size: 22px; font-weight: 800; }

    .add {
      width: 44px;
      height: 44px;
      border: 0;
      border-radius: 50%;
      color: #fff;
      background: var(--orange);
      font-size: 24px;
      font-weight: 400;
    }

    .orange-section {
      color: #fff;
      overflow: hidden;
      isolation: isolate;
      background:
        radial-gradient(circle at 20% -10%, rgba(255,255,255,.35), transparent 20rem),
        linear-gradient(135deg, #f05a2a, var(--orange));
    }

    .orange-section .eyebrow { color: #fff; }
    .orange-section .eyebrow::before { background: #fff; }
    .orange-section .section-head p { color: rgba(255, 255, 255, 0.75); font-weight: 700; }

    .offer {
      min-height: 230px;
      display: grid;
      align-content: end;
      border-radius: 22px;
      padding: 26px;
      color: var(--white);
      background:
        linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.82)),
        url("../images/menu-products/chicken-xl.webp") center/cover;
      box-shadow: var(--shadow);
    }

    .offer:nth-child(2) { background-image: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.82)), url("../images/menu-products/chicken-and-cheese-quesadilla.webp"); }
    .offer:nth-child(3) { background-image: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.82)), url("../images/menu-products/chicken-nachos.webp"); }
    .offer strong { color: var(--orange); font-size: 40px; line-height: 1; font-family: bigola_displayregular;}
    .offer p { color: rgba(255,255,255,.74); margin-bottom: 0; }

    .form-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
    }

    .full { grid-column: 1 / -1; }
    textarea.field { min-height: 112px; padding-top: 16px; resize: vertical; }

    .checkout-list {
      list-style: none;
      padding: 0;
      margin: 0;
      display: grid;
      gap: 13px;
    }

    .checkout-list li {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      padding-bottom: 13px;
      border-bottom: 1px solid var(--line);
      color: rgba(255,255,255,.72);
    }

    .checkout-list li:last-child {
      border-bottom: 0;
      padding-bottom: 0;
      color: var(--white);
      font-weight: 400;
    }

    .payment-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 18px;
    }

    .payment-tags span {
      border-radius: 999px;
      padding: 10px 14px;
      color: var(--coal);
      background: var(--cream);
      font-weight: 400;
      font-size: 12px;
    }

    .wa-panel {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 24px;
      align-items: center;
      border: 1px solid rgba(255,95,46,.35);
      border-radius: 26px;
      padding: 36px;
      background:
        linear-gradient(rgba(0,0,0,.74), rgba(0,0,0,.84)),
        url("https://images.unsplash.com/photo-1529692236671-f1f6cf9683ba?auto=format&fit=crop&w=1800&q=86") center/cover;
      box-shadow: var(--shadow);
    }

    .contact-map {
      min-height: 270px;
      border-radius: 22px;
      background:
        linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.54)),
        url("https://images.unsplash.com/photo-1544025162-d76694265947?auto=format&fit=crop&w=1100&q=84") center/cover;
      box-shadow: var(--shadow);
    }

    .social-links {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 16px;
    }

    .reservation-image-card {
      min-height: 458px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      overflow: hidden;
      position: relative;
      border-color: rgba(255, 95, 46, .34);
      background:
        linear-gradient(180deg, rgba(7, 6, 5, .08) 20%, rgba(7, 6, 5, .94) 78%),
        url("../images/reservation-family-ai.png") center/cover no-repeat;
    }

    .reservation-image-card::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background: linear-gradient(90deg, rgba(0,0,0,.26), transparent 70%);
    }

    .reservation-image-card > * {
      position: relative;
      z-index: 1;
    }

    .reservation-image-card h3,
    .reservation-image-card p {
      color: #fff;
      text-shadow: 0 2px 12px rgba(0,0,0,.65);
    }

    .social-links a {
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 10px 14px;
      background: rgba(255,255,255,.06);
      font-size: 13px;
      font-weight: 400;
    }

    footer {
      position: relative;
      overflow: hidden;
      padding: 60px 0 40px;
      border-top: 1px solid rgba(255, 255, 255, .08);
      color: rgba(255,255,255,.86);
      background:
        radial-gradient(circle at 52% 38%, rgba(255, 255, 255, .05), transparent 23rem),
        linear-gradient(rgba(5, 5, 5, .82), rgba(5, 5, 5, .9)),
        url("../images/bgs.png") center/cover;
      isolation: isolate;
    }

    footer::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      background: radial-gradient(circle at 50% 50%, transparent 0 34%, rgba(0, 0, 0, .42) 100%);
      pointer-events: none;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: minmax(250px, .8fr) minmax(420px, 1.08fr) minmax(320px, .9fr);
      align-items: center;
      gap: clamp(34px, 5vw, 82px);
    }

    .footer-address,
    .footer-newsletter {
      min-height: 360px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .footer-newsletter {
      align-items: flex-end;
      text-align: right;
    }

    .footer-title {
      margin: 0 0 34px;
      color: #fff;
      font-family: bigola_displayregular;
      font-size: 36px;
      line-height: 1;
      letter-spacing: 0;
      text-transform: none;
      text-shadow: 4px 4px 0 rgba(0, 0, 0, .52);
    }

    .footer-contact-list {
      display: grid;
      gap: 22px;
      margin-bottom: 54px;
    }

    .footer-contact-list a,
    .footer-contact-list span {
      display: flex;
      align-items: center;
      gap: 15px;
      color: rgba(255,255,255,.88);
      font-size: 18px;
      line-height: 1.35;
      margin: 0;
    }

    .footer-contact-list svg {
      width: 21px;
      height: 21px;
      flex: 0 0 auto;
      color: #fff;
      fill: currentColor;
    }

    .footer-contact-list > a,
    .footer-contact-list > span {
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr);
      align-items: center;
      column-gap: 14px;
    }

    .footer-contact-list > a > svg,
    .footer-contact-list > span > svg,
    .footer-contact-list .contact-dot {
      width: 38px;
      height: 38px;
      min-width: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      justify-self: center;
      padding: 9px;
      border-radius: 50%;
      box-sizing: border-box;
      color: #fff;
      background: var(--orange);
      font-size: 17px;
      line-height: 1;
    }

    .footer-contact-list .contact-dot svg {
      width: 20px;
      height: 20px;
      color: #fff;
      fill: currentColor;
    }

    .footer-contact-list > a > span:last-child,
    .footer-contact-list > span > span:last-child {
      display: block;
      margin: 0;
    }

    .footer-social {
      display: flex;
      gap: 16px;
    }

    .footer-social a {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #c11618;
      background: #fff;
      font-size: 18px;
      font-weight: 400;
    
      margin: 0;
      transition: transform .25s ease, color .25s ease, background .25s ease;
    }

    .footer-social a:hover {
      color: #fff;
      background: var(--orange);
      transform: translateY(-3px);
    }

    .footer-social svg {
      width: 21px;
      height: 21px;
      display: block;
      fill: currentColor;
    }

    .footer-brand-card {
      min-height: 430px;
      border-radius: 8px;
      padding: 54px 34px 52px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      background: rgba(37, 37, 37, .97);
      box-shadow: 0 22px 70px rgba(0, 0, 0, .34);
    }

    .footer-logo { width: 353px; max-width: 82%; margin: 0 0 26px; }

    .footer-brand-card p {
      max-width: 540px;
      margin: 0 auto;
      color: rgba(255,255,255,.78);
      font-size: 18px;
      line-height: 1.65;
    }

    .footer-rule {
      width: 100%;
      height: 1px;
      margin: 48px 0 42px;
      background: rgba(255, 255, 255, .16);
    }

    .footer-card-nav {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 26px;
    }

    .footer-card-nav a {
      display: inline-flex;
      color: #fff;
      font-family: bigola_displayregular;
      font-size: 18px;
      letter-spacing: 1px;
      text-transform: uppercase;
      margin: 0;
      text-shadow: 3px 3px 0 rgba(0,0,0,.55);
      white-space: nowrap;
    }

    .footer-newsletter p {
      max-width: 500px;
      margin: 0 0 38px;
      color: rgba(255,255,255,.8);
      font-size: 18px;
      line-height: 1.7;
    }

    .newsletter-form {
      width: min(520px, 100%);
      display: grid;
      grid-template-columns: 1fr 78px;
      border: 1px solid rgba(255, 255, 255, .2);
      border-radius: 9px;
      overflow: hidden;
      background: rgba(0, 0, 0, .24);
    }

    .newsletter-form input {
      min-height: 52px;
      width: 100%;
      border: 0;
      padding: 0 20px;
      color: #fff;
      background: transparent;
      outline: 0;
      font-size: 18px;
    }

    .newsletter-form input::placeholder { color: rgba(255,255,255,.45); }

    .newsletter-form button {
      border: 0;
      display: grid;
      place-items: center;
      color: #fff;
      background: #ff5f2e;
    }

    .newsletter-form button svg {
      width: 36px;
      height: 36px;
      fill: currentColor;
    }

    .terms-check {
      display: none;
      align-items: center;
      gap: 12px;
      margin: 18px 0 44px;
      color: rgba(255,255,255,.88);
      font-size: 17px;
    }

    .terms-check input {
      appearance: none;
      width: 22px;
      height: 22px;
      border: 1px solid rgba(255, 255, 255, .26);
      border-radius: 7px;
      background: rgba(255, 255, 255, .04);
    }

    .footer-payments {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 14px;
      display: none;
    }

    .footer-payments span {
      min-width: 86px;
      min-height: 42px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      background: rgba(255, 255, 255, .3);
      font-weight: 400;
      font-size: 17px;
      margin: 0;
    }

    .footer-payments .mc { color: #ffcc1b; }
    .footer-payments .skill { color: #218fd5; }

    .footer-copy {
      margin: 70px 0 0;
      text-align: center;
      color: rgba(255,255,255,.86);
      font-size: 18px;
    }

    .back-top {
      position: absolute;
      right: 26px;
      bottom: 48px;
      width: 66px;
      height: 66px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #fff;
      background: #ff5f2e;
      box-shadow: 0 18px 44px rgba(0, 0, 0, .32);
      margin: 0;
    }

    .back-top svg {
      width: 25px;
      height: 25px;
      fill: currentColor;
    }

    .cart-panel {
      position: fixed;
      right: 22px;
      bottom: 22px;
      z-index: 60;
      width: min(370px, calc(100% - 44px));
      border: 1px solid rgba(255,95,46,.38);
      border-radius: 20px;
      padding: 18px;
      background: rgba(12,12,12,.94);
      box-shadow: var(--shadow);
      transform: translateY(18px);
      opacity: 0;
      pointer-events: none;
      transition: opacity .25s ease, transform .25s ease;
      backdrop-filter: blur(18px);
    }

    .cart-panel.show {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }

    .cart-panel p { color: rgba(255,255,255,.68); }

    .reveal {
      opacity: 0;
      transform: translateY(24px);
      transition: opacity .7s ease, transform .7s ease;
    }

    .reveal.is-visible {
      opacity: 1;
      transform: translateY(0);
    }

    @media (max-width: 1080px) {
      .nav-inner { grid-template-columns: 200px 1fr auto; gap: 14px; }
      .brand img { width: 190px; }
      .menu { gap: 12px; font-size: 11px; }
      .footer-grid {
        grid-template-columns: 1fr;
      }
      .footer-address,
      .footer-newsletter {
        min-height: 0;
        align-items: center;
        text-align: center;
      }
      .footer-contact-list a,
      .footer-contact-list span {
        justify-content: center;
      }
      .footer-payments {
        justify-content: center;
      }
      .warm-story-frame {
        grid-template-columns: 1fr;
        width: min(100% - 48px, 820px);
        padding: 58px 34px 34px;
      }
      .story-copy {
        max-width: 560px;
        margin-left: 0;
      }
      .story-photo {
        width: 100%;
        min-height: 360px;
        margin-right: 0;
      }
    }

    @media (max-width: 920px) {
      .nav-inner { grid-template-columns: 1fr auto; }
      .menu { display: none; }
      .hero-grid, .grid-2, .wa-panel { grid-template-columns: 1fr; }
      .hero-card { max-width: 560px; }
      .grid-4, .grid-3, .footer-grid { grid-template-columns: repeat(2, 1fr); }
      .story-points { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 640px) {
      .container { width: min(100% - 28px, 1160px); }
      .nav-inner { min-height: 74px; }
      .brand img { width: 165px; }
      .nav-actions .btn { display: none; }
      .hero { min-height: auto; padding: 66px 0 58px; }
      h1 { font-size: clamp(62px, 21vw, 90px); }
      .hero-copy { font-size: 16px; }
      section { padding: 21px 0; }
      .section-head, .grid-4, .grid-3, .footer-grid, .form-grid { grid-template-columns: 1fr; }
      .search-panel { grid-template-columns: 1fr; border-radius: 18px; }
      .quick-stats { grid-template-columns: 1fr; }
      .wa-panel, .form-card, .card, .info-card, .faq-card, .checkout-card { padding: 22px; }
      .deal { width: 78px; height: 78px; right: 14px; }
      
      footer {
        padding: 70px 0 42px;
      }
      .footer-brand-card {
        min-height: 0;
        padding: 38px 24px;
      }
      .footer-card-nav {
        gap: 22px;
      }
      .newsletter-form {
        grid-template-columns: 1fr 64px;
      }
      .newsletter-form input {
        min-height: 64px;
        font-size: 15px;
      }
      .footer-payments span {
        min-width: 76px;
        font-size: 14px;
      }
      .back-top {
        position: static;
        margin: 28px auto 0;
      }
      .warm-story {
        padding: 0px 0 !important;
      }
      .warm-story::before {
        left: -92px;
        top: 0;
        width: 250px;
        height: 100%;
        opacity: .45;
      }
      .warm-story::after,
      .warm-story-frame::after {
        display: none;
      }
      .warm-story-frame {
        width: min(100% - 28px, 1160px);
        min-height: 0;
        padding: 0;
      }
      .story-copy {
        margin-left: 0;
      }
      .story-copy p {
        font-size: 19px;
      }
      .story-photo {
        min-height: 230px;
        border-radius: 16px;
      }
      .story-points {
        width: min(100% - 28px, 1160px);
        grid-template-columns: 1fr;
      }
    }

    /* Cinematic automatic banner */
    .hero-slider {
      min-height: 100vh;
      height: 100vh;
      max-height: 100vh;
      padding: 0;
      text-align: left;
      background: #050505;
      align-items: stretch;
      justify-items: stretch;
    }

    

    .hero-slide {
      position: absolute;
      inset: 0;
      z-index: 0;
      opacity: 0;
      background-image: var(--slide-image);
      background-position: center right;
      background-size: cover;
      transform: scale(1.08);
      transition: opacity 1s ease, transform 7s ease;
      will-change: opacity, transform;
    }

    .hero-slide.is-active {
      opacity: 1;
      transform: scale(1);
    }

    .hero-fire {
      position: absolute;
      inset: 0;
      opacity: .42;
      background:
        radial-gradient(ellipse at 67% 52%, rgba(255, 95, 46, .34), transparent 19rem),
        radial-gradient(ellipse at 78% 18%, rgba(255, 167, 38, .22), transparent 16rem);
      mix-blend-mode: screen;
      animation: flamePulse 3.6s ease-in-out infinite alternate;
    }

    .hero-embers {
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
      background-image:
        radial-gradient(circle, rgba(255, 112, 49, .95) 0 1px, transparent 2px),
        radial-gradient(circle, rgba(255, 197, 92, .65) 0 1px, transparent 2px);
      background-size: 140px 140px, 210px 210px;
      animation: emberDrift 14s linear infinite;
      opacity: .34;
      mask-image: linear-gradient(90deg, transparent, #000 35%, #000 95%);
    }

    .hero-slider .hero-grid {
      position: relative;
      z-index: 3;
      width: 100%;
      min-height: 100%;
      display: grid;
      /*! grid-template-columns: minmax(320px, 560px) 1fr; */
      align-items: center;
      gap: 32px;
      margin: 0 auto;
      padding: 82px 0 70px;
    }

    .hero-slider .hero-content {
      width: 100%;
      margin: 0;
      text-align: left;
      animation: heroTextIn .9s ease both;
    }

    .hero-kicker {
      display: block;
      margin-bottom: 18px;
      color: #f15a2b;
      font-size: 13px;
      font-weight: 400;
      letter-spacing: 0;
      text-transform: uppercase;
      text-shadow: 0 3px 18px rgba(0, 0, 0, .75);
    }

    .hero-title {
      margin: 0 0 18px;
      color: #fff;
      font-family: bigola_displayregular;
      font-size: 40px;
      font-weight: 400;
      line-height: 1.05;
      letter-spacing: 1;
      text-transform: uppercase;
      text-shadow: 0 12px 34px rgba(0, 0, 0, .7);
    }

    .hero-title span {
      display: block;
    }

    .hero-title span:last-child {
      color: #f15a2b;
      text-shadow: 0 10px 34px rgba(241, 90, 43, .28), 0 12px 34px rgba(0, 0, 0, .7);
    }

    .hero-slider .hero-copy {
      max-width: 480px;
      margin: 0 0 26px;
      color: rgba(255, 255, 255, .82);
      font-size: 17px;
      font-weight: 700;
      line-height: 1.55;
      text-shadow: 0 8px 28px rgba(0, 0, 0, .72);
    }

    .hero-slider .hero-actions {
      display: flex;
      gap: 14px;
      margin-top: 0;
    }

    .hero-slider .hero-banner-btn,
    .hero-outline-btn {
      min-height: 48px;
      border-radius: 9px;
      padding: 0 22px;
      font-family: Inter, Arial, sans-serif;
      font-size: 16px;
      font-weight: 600;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .hero-slider .hero-banner-btn {
      color: #fff;
      background: #f15a2b;
      box-shadow: 0 0 0 1px rgba(255,255,255,.1) inset, 0 14px 34px rgba(241, 90, 43, .45);
    }

    .hero-outline-btn {
      color: #fff;
      border: 1px solid rgba(241, 90, 43, .55);
      background: rgba(0, 0, 0, .46);
      box-shadow: 0 14px 34px rgba(0, 0, 0, .28);
    }

    .hero-dot {
      width: 34px;
      height: 4px;
      border: 0;
      border-radius: 999px;
      background: rgba(255, 255, 255, .34);
      padding: 0;
      transition: width .3s ease, background .3s ease;
    }

    .hero-dot.is-active {
      width: 52px;
      background: #f15a2b;
    }

    .hero-dots {
      position: absolute;
      left: 0;
      bottom: 34px;
      display: flex;
      align-items: center;
      gap: 9px;
    }

    .hero-card,
    .hero-meta {
      display: none;
    }

    @keyframes flamePulse {
      from { opacity: .24; transform: translateY(8px) scale(.98); }
      to { opacity: .58; transform: translateY(-6px) scale(1.03); }
    }

    @keyframes emberDrift {
      from { background-position: 0 0, 40px 100px; }
      to { background-position: 120px -280px, -80px -180px; }
    }

    @keyframes heroTextIn {
      from { opacity: 0; transform: translateY(22px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @media (max-width: 920px) {
      .hero-slider {
        min-height: 590px;
        height: auto;
      }

      .hero-slider::before {
        background:
          linear-gradient(90deg, rgba(0, 0, 0, .94) 0%, rgba(0, 0, 0, .74) 58%, rgba(0, 0, 0, .46) 100%),
          radial-gradient(circle at 73% 38%, rgba(255, 95, 46, .18), transparent 20rem);
      }

      .hero-slider .hero-grid {
        grid-template-columns: 1fr;
        width: min(100% - 0px, 760px);
        padding: 86px 0 82px;
      }

      .hero-title {
        font-size: 68px;
      }
    }

    @media (max-width: 640px) {
      .hero-slider {
        min-height: 520px;
      }

      .hero-slide {
        background-position: 62% center;
      }

      .hero-title {
        font-size: 35px;
      }

      .hero-slider .hero-copy {
        font-size: 15px;
      }

      .hero-slider .hero-actions {
        align-items: stretch;
        flex-direction: column;
        max-width: 230px;
      }

      .hero-dots {
        bottom: 26px;
      }
    }

  
  
   select {
  color: #a8a8a8 !important;
   }
  
  
   
    /* 2026 brand and experience refinement */
    body, button, input, select, textarea,
    .btn, .menu, .hero-slider .hero-banner-btn, .hero-outline-btn,
    .warm-story .hero-banner-btn, .story-copy p, .footer-brand-card p,
    .footer-newsletter p, .footer-contact-list a, .footer-contact-list span {
      font-family: bigola_displayregular !important;
    }

    body { letter-spacing: .02em !important; }
    p, input, select, textarea { letter-spacing: .035em; }

    .nav { transition: background .3s ease, backdrop-filter .3s ease; }
    .nav:hover { background: rgba(5,5,5,.42); backdrop-filter: blur(14px); }
    .menu a { font-weight: 400; letter-spacing: .06em; }

    .warm-story { padding: 60px 0;}
    .about-intro { display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; }
    .about-intro .eyebrow { margin:0; font-size:18px; }
    .about-number { margin:0; color:rgba(231,71,36,.45); font-size:72px; line-height:1; display:none; }
    .warm-story-frame { grid-template-columns:minmax(380px,.9fr) minmax(520px,1.15fr); gap:clamp(38px,5vw,92px); min-height:600px; }
    .story-copy { max-width:560px; }
    .story-copy h2 { font-size:clamp(60px,5vw,60px); line-height:.9; margin-bottom:34px; }
    .story-copy h2 span { color:#e74724; }
    .story-copy h2::after { width:110px; }
    .story-copy p { font-size:20px; line-height:1.5; }
    .story-copy strong { /*! font-family:"BigolaDisplay-Regular",Impact,sans-serif; */ font-size:30px; }
    .story-visual { position:relative; }
    .story-photo { min-height:590px; border-radius:34px 8px 34px 8px; transform:rotate(1.2deg); transition:transform .55s ease, box-shadow .55s ease; }
    .story-visual:hover .story-photo { transform:rotate(0) scale(1.015); box-shadow:0 38px 100px rgba(43,27,18,.3); }
    .story-badge { position:absolute; left:-34px; bottom:34px; width:160px; height:160px; border-radius:50%; display:grid; place-content:center; text-align:center; color:#fff; background:#e74724; box-shadow:0 22px 50px rgba(231,71,36,.3); animation:badgeFloat 3s ease-in-out infinite; }
    .story-badge span { font-size:16px; }
    .story-badge strong { font-size:23px; }
    .story-points { display:grid; grid-template-columns:repeat(3,1fr); width:100%; margin-top:54px; }
    .story-points .info-card { padding:19px; border-radius:18px; transition:transform .3s ease, box-shadow .3s ease; }
    .story-points .info-card:hover { transform:translateY(-8px); box-shadow:0 26px 60px rgba(43,27,18,.16); }
    .story-points small { font-size:26px; }
    .story-points h3 { font-size:29px; }
    .about-text-link { display:inline-flex; align-items:center; gap:8px; color:#20201e; font-size:18px; border:1px solid rgba(239, 77, 38, 0.51); padding-bottom:5px; background-color: #f7ece2;padding: 20px;border-radius: 9px;border-color: rgba(231, 71, 36, .3);background: rgba(255, 255, 255, .42);box-shadow: 0 18px 42px rgba(43, 27, 18, 0.08);}

    .product-card, .offer, .form-card, .card { transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
    .product-card:hover, .offer:hover, .form-card:hover, .card:hover { transform:translateY(-7px); border-color:rgba(255,95,46,.45); box-shadow:0 28px 70px rgba(0,0,0,.34); }

    .booking-simple { padding:34px; }
    .booking-form-head { margin-bottom:24px; }
    .booking-form-head span { color:var(--orange); text-transform:uppercase; font-size:14px; letter-spacing:.08em; }
    .booking-form-head h3 { margin:8px 0 0; font-size:34px; }
    .booking-note { margin:18px 0 0; color:rgba(255,255,255,.58); font-size:14px; line-height:1.55; }
    .field { transition:border-color .25s ease, background .25s ease, transform .25s ease; }
    .field:focus { border-color:var(--orange); background:rgba(255,95,46,.08); transform:translateY(-1px); }


 .section-head h2 span {
  color: #e74724;
}

    @keyframes badgeFloat { 0%,100%{transform:translateY(0) rotate(-5deg)} 50%{transform:translateY(-10px) rotate(-2deg)} }

    @media (max-width:1080px) {
      .warm-story-frame { grid-template-columns:1fr; }
      .story-photo { min-height:430px; }
      .story-badge { left:18px; }
    }
    @media (max-width:640px) {
      .about-number { font-size:48px; }
      .story-copy h2 { font-size:30px; line-height: 39px;margin-bottom: 15px;}
      .story-copy p { font-size:18px; }
      .story-photo { min-height:330px; }
      .story-badge { width:124px; height:124px; left:12px; bottom:18px; }
      .story-badge strong { font-size:18px; }
      .story-points { grid-template-columns:1fr; }
      .booking-simple { padding:24px; }
       .brand img {
    width: 225px;
  }
    }

  
  
  
  
      @media (max-width:768px) {
 .brand img {
    width: 225px;
  }


  .story-copy h2::after {
  margin-top: 12px;}


.about-intro {
  margin-bottom: 0px;
}
.about-intro .eyebrow {
  font-size: 13px;
}

.story-copy strong {
  font-size: 18px;
}

.warm-story .hero-banner-btn {
  min-width: 206px;
  min-height: 52px;
  border-radius: 8px;
  padding: 0 17px;
  color: #fff;
  background: linear-gradient(180deg, #f04f27, #df3217);
  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 2px;
  text-transform: uppercase;
  box-shadow: 0 18px 44px rgba(231, 71, 36, .26);
}
.story-points h3 {
  font-size: 20px;
}

.story-feature-card {
  min-height: 240px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.story-feature-card h3 {
  margin: 17px 0 10px;
  font-size: 25px;
}

.story-feature-card p {
  max-width: 340px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.story-feature-icon {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--orange);
  box-shadow: 0 12px 30px rgba(231,71,36,.25);
}

.story-feature-icon svg {
  width: 30px;
  height: 30px;
  display: block;
  fill: currentColor;
}

h2 {
  margin: 18px 0 0px;
  font-size: 30px;
  line-height: initial;
}

.section-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 520px);
  align-items: end;
  gap: 14px;
  margin-bottom: 13px;
}
.product-body h3 {
  margin-bottom: 6px;
  font-size: 18px;
}
.hero p, .section-head p, .card p, .info-card p, .faq-card p, .checkout-card p {
  color: rgba(255, 255, 255, .72);
  line-height: 1.12;
}

.card h3, .info-card h3, .faq-card h3, .checkout-card h3 {
  margin-bottom: 12px;
  font-size: 16px;
}
.booking-form-head h3 {
  margin: 8px 0 0;
  font-size: 20px;
}

.footer-title {

  font-size: 25px;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  text-shadow: 4px 4px 0 rgba(0, 0, 0, .52);
}

.footer-contact-list {
  display: grid;
  gap: 9px;
  margin-bottom: 30px;
}

.footer-card-nav a {

  font-size: 14px;}
.footer-newsletter p {
  max-width: 500px;
  margin: 0 0 18px;
  color: rgba(255,255,255,.8);
  font-size: 14px;
  line-height: 1.7;
}
  .newsletter-form input {
    min-height: 46px;
    font-size: 13px;
  }

  .footer-copy {
  margin: 00px 0 0;
  text-align: center;
  color: rgba(255,255,255,.86);
  font-size: 15px;
}

 .back-top {
    position: absolute;
    margin: 23px auto 0;
  }
  .back-top {
  position: absolute;
  right: 26px;
  bottom: 26px;}

      }
  
  
  .pd-top{ padding-top:150px !important; }
  
  
  
 /* Flavour guide: reference artwork arranged as individually linked cards. */
.flavour-section { padding:48px 0 42px; background:#fff; color:#151515; }
.flavour-container { width:min(1600px, calc(100% - 40px)); margin:auto; }
.flavour-heading { text-align:center; margin-bottom:30px; }
.flavour-heading h2 { margin:0 0 12px; font-family:bigola_displayregular, serif; font-size:clamp(30px,4.3vw,70px); font-weight:400; line-height:1.1; letter-spacing:0; text-transform:uppercase; }
.flavour-heading h2 span {   }
.flavour-heading p { display:flex; align-items:center; justify-content:center; gap:22px; margin:0; font:600 clamp(10px,1.15vw,18px)/1.5 Arial,sans-serif; letter-spacing:3px; text-transform:uppercase; color:#626262; }
.flavour-heading p::before,.flavour-heading p::after { content:""; width:70px; height:1px; background:#999; }
.flavour-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:10px; max-width:1120px; margin-inline:auto; }
.flavour-card { display:block; aspect-ratio:300 / 366; border-radius:12%; background-image:url('../images/flavour-guide.png?v=3'); background-repeat:no-repeat; box-shadow:0 14px 22px -12px rgba(65,30,10,.3); transition:transform .2s ease,box-shadow .2s ease; }
.flavour-plain { background-size:723.6666666666666% 197.81420765027323%; background-position:1.389631213254944% 57.54189944134078%; }
.flavour-bbq { background-size:723.6666666666666% 197.81420765027323%; background-position:17.637626937466596% 57.54189944134078%; }
.flavour-mango { background-size:723.6666666666666% 197.81420765027323%; background-position:33.77872795296633% 57.54189944134078%; }
.flavour-lemon { background-size:723.6666666666666% 197.81420765027323%; background-position:49.97327632282202% 57.54189944134078%; }
.flavour-mild { background-size:723.6666666666666% 197.81420765027323%; background-position:66.16782469267771% 57.54189944134078%; }
.flavour-hot { background-size:723.6666666666666% 197.81420765027323%; background-position:82.30892570817745% 57.54189944134078%; }
.flavour-extra { background-size:723.6666666666666% 197.81420765027323%; background-position:98.50347407803314% 57.54189944134078%; }
.flavour-card:hover { transform:translateY(-6px); box-shadow:0 20px 26px -12px rgba(65,30,10,.4); }
.flavour-card:focus-visible { outline:3px solid #151515; outline-offset:5px; transform:translateY(-4px); }
.flavour-footer { display:flex; align-items:center; justify-content:center; margin-top:32px; }
.flavour-footer::before,.flavour-footer::after { content:""; width:20%; height:2px; background:linear-gradient(90deg,transparent,#ff650b); }
.flavour-footer::after { transform:rotate(180deg); }
.flavour-footer p { margin:0; padding:7px 36px; border:2px solid #ff650b; border-radius:50px; font:900 clamp(14px,2vw,20px)/1.2 Arial,sans-serif; text-align:center; text-transform:uppercase; }
.flavour-footer strong { color:#ff650b; font-size:1.4em; font-style:italic; vertical-align:-.04em; }
@media (max-width:900px) {
  .flavour-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; max-width:640px; }
  .flavour-heading p { gap:12px; letter-spacing:2px; }
  .flavour-heading p::before,.flavour-heading p::after { display:none; }
}
@media (max-width:540px) {
  .flavour-section { padding:36px 0; }
  .flavour-container { width:calc(100% - 32px); }
  .flavour-heading { margin-bottom:24px; }
  .flavour-heading h2 { letter-spacing:0; }
  .flavour-heading h2 span { display:block; margin-top:4px; }
  .flavour-heading p { gap:8px; letter-spacing:1px; font-size:9px; }
  .flavour-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; max-width:420px; }
  .flavour-card:last-child { grid-column:2; }
  .flavour-footer { margin-top:26px; }
  .flavour-footer p { padding:9px 14px; white-space:nowrap; }
}
@media (prefers-reduced-motion:reduce) { .flavour-card { transition:none; } }


.edew{    isolation: isolate;
    background: radial-gradient(circle at 20% -10%, rgba(255, 255, 255, .35), transparent 20rem), linear-gradient(135deg, #f05a2a, var(--orange));}
/* Scalable UAE dirham mark; inherits the surrounding price colour. */
.currency-symbol {
  display:inline-block;
  width:.69em;
  height:.60em;
  vertical-align:0;
  fill:currentColor;
  overflow:visible;
  flex-shrink:0;
}