﻿    :root {
      --ink: #191513;
      --cream: #f6efe5;
      --warm-white: #fffaf3;
      --wine: #4b1f22;
      --wine-dark: #2b1113;
      --gold: #b8955a;
      --olive: #3f4334;
      --charcoal: #262321;
      --soft: #e8ddcc;
      --topline-height: 42px;
    }

    * {
      box-sizing: border-box;
    }

    body {
      margin: 0;
      font-family: Georgia, 'Times New Roman', serif;
      color: var(--ink);
      line-height: 1.55;
    }

    img {
      max-width: 100%;
      display: block;
    }

    a {
      color: inherit;
    }

    .home-page .topbar {
      top: var(--topline-height);
      transform: translateY(-120%);
      opacity: 0;
    }

    .home-page .topbar.is-visible {
      transform: translateY(0);
      opacity: 1;
    }

    .inside-page .topbar {
      top: 0;
      transform: translateY(0);
      opacity: 1;
    }

    body.topline-hidden .topbar {
      top: 0;
    }

    .inside-page main {
      background: var(--cream);
      min-height: calc(100vh - 170px);
      padding-top: 78px;
    }

    /* Buttons */

    .button {
      display: inline-block;
      padding: 13px 22px;
      border-radius: 999px;
      background: var(--gold);
      color: #1e1713 !important;
      text-decoration: none;
      font-family: Arial, sans-serif;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      font-size: 12px;
      transition: transform .2s ease, background .2s ease;
    }

    .button:hover {
      transform: translateY(-1px);
      background: #d0ad6c;
    }

    .button.secondary {
      background: transparent;
      color: var(--warm-white) !important;
      border: 1px solid rgba(255, 255, 255, .45);
    }

    .actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }

    /* Topline */

    .site-topline {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1100;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 18px;
      min-height: var(--topline-height);
      padding: 9px 5vw;
      background: var(--wine);
      color: #fffaf3;
      font-family: Arial, sans-serif;
      font-size: 13px;
      letter-spacing: .04em;
      text-align: center;
    }

    .site-topline a {
      color: #1e1713;
      background: var(--gold);
      padding: 7px 14px;
      border-radius: 999px;
      text-decoration: none;
      font-weight: 700;
      text-transform: uppercase;
      font-size: 11px;
      letter-spacing: .08em;
      white-space: nowrap;
    }

    .site-topline-close {
      width: 28px;
      height: 28px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: rgba(255, 255, 255, .16);
      color: #fffaf3;
      font-size: 22px;
      line-height: 28px;
      cursor: pointer;
      flex: 0 0 auto;
    }

    .site-topline.is-hidden {
      display: none;
    }

    body.topline-hidden .topbar {
      top: 0;
    }

    /* Header and navigation */

    .topbar {
      position: fixed;
      top: var(--topline-height);
      left: 0;
      right: 0;
      z-index: 1000;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 5vw;
      background: var(--charcoal);
      backdrop-filter: blur(10px);
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      transform: translateY(-120%);
      transition: transform .3s ease, opacity .3s ease, top .2s ease;
    }

    .topbar.is-visible {
      transform: translateY(0);
      opacity: 1;
    }

    .logo img {
      height: 42px;
      width: auto;
      filter: brightness(0) invert(1);
    }

    .menu-toggle {
      display: none;
    }

    .menu-toggle-label,
    .mobile-menu-close {
      display: none;
    }

    .u-nav,
    .u-nav ul {
      list-style: none;
      margin: 0;
      padding: 0;
    }

    .u-nav-container {
      font-family: Arial, sans-serif;
      font-size: 13px;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .u-nav-1 {
      display: flex;
      align-items: center;
      gap: 5px;
    }

    .u-nav-item {
      position: relative;
    }

    .u-nav-link {
      display: block;
      color: #fff4e8;
      text-decoration: none;
    }

    .u-nav-link:hover {
      color: var(--gold);
    }

    .u-nav-popup {
      display: none;
      position: absolute;
      top: 100%;
      left: -16px;
      z-index: 1001;
      min-width: 210px;
      padding-top: 10px;
    }

    .u-nav-popup::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 10px;
    }

    .has-popup:hover>.u-nav-popup,
    .has-popup:focus-within>.u-nav-popup {
      display: block;
    }

    .u-nav-2 {
      display: block;
      background: rgba(25, 21, 19, 0.97);
      border: 1px solid rgba(255, 255, 255, .12);
      box-shadow: 0 18px 35px rgba(0, 0, 0, .22);
      padding: 8px 0;
    }

    .u-nav-2 .u-nav-link {
      padding: 12px 18px !important;
      white-space: nowrap;
      color: #1e1713;
      background: #fffaf3;
      border-bottom: 1px solid rgba(0, 0, 0, .08);
      font-family: Arial, sans-serif;
      font-size: 13px;
      letter-spacing: .08em;
      text-transform: uppercase;
    }

    .u-nav-2 .u-nav-link:hover {
      color: var(--wine);
      background: #f0e4d3;
    }

    .rzNavButton {
      background-color: var(--gold);
      border-radius: 10px;
      color: var(--charcoal) !important;
    }

    .rzNavButton:hover {
      background-color: var(--cream);
      color: var(--charcoal) !important;
    }

    /* Hero */

    .hero {
      min-height: 94vh;
      position: relative;
      color: white;
      overflow: hidden;
      display: grid;
      align-items: end;
      padding: 150px 5vw 84px;
      background: #111;
    }

    .hero-slider,
    .hero-slide,
    .hero-slide::after {
      position: absolute;
      inset: 0;
    }

    .hero-slider {
      z-index: 0;
    }

    .hero-slide {
      background-position: center;
      background-size: cover;
      opacity: 0;
      transform: scale(1.04);
      animation: heroFade 24s infinite;
    }

    .hero-slide::after {
      content: '';
      background:
        linear-gradient(90deg,
          rgba(25, 21, 19, .65) 0%,
          rgba(25, 21, 19, .65) 18%,
          rgba(25, 21, 19, .30) 48%,
          rgba(25, 21, 19, .02) 100%),
        linear-gradient(to top,
          rgba(25, 21, 19, .28),
          rgba(25, 21, 19, 0));
    }

    .hero-slide:nth-child(1) {
      background-image: url('images/CYN2026-149-3653.jpg');
      animation-delay: 0s;
    }

    .hero-slide:nth-child(2) {
      background-image: url('images/CYN2026-139-3601.jpg');
      animation-delay: 6s;
    }

    .hero-slide:nth-child(3) {
      background-image: url('images/CYN2026-114-2915.jpg');
      animation-delay: 12s;
    }

    .hero-slide:nth-child(4) {
      background-image: url('images/CYN2026-009-3722.jpg');
      animation-delay: 18s;
    }

    @keyframes heroFade {
      0% {
        opacity: 0;
        transform: scale(1.04);
      }

      4% {
        opacity: 1;
      }

      22% {
        opacity: 1;
      }

      28% {
        opacity: 0;
        transform: scale(1);
      }

      100% {
        opacity: 0;
        transform: scale(1.04);
      }
    }

    .hero-content {
      position: relative;
      z-index: 2;
      max-width: 760px;
    }

    .home-page h1,
    .home-page h1,
    .home-page h2,
    .home-page h3 {
      font-family: Georgia, 'Times New Roman', serif;
    }

    .hero-content h1,
    .feature-grid h3,
    .feature-grid h3,
    .open-kitchen h2,
    .cyranos-video-section h2,
    .egifts h2,
    .quick-reservation-section h2 {
      color: var(--warm-white);

    }

    .hero-logo {
      position: relative;
      z-index: 3;
      width: min(420px, 70vw);
      margin-bottom: 34px;
      filter: brightness(0) invert(1);
      transition: opacity .35s ease, transform .35s ease;
    }

    .hero-logo.is-hidden {
      opacity: 0;
      transform: translateY(-20px);
      pointer-events: none;
    }

    .eyebrow {
      font-family: Arial, sans-serif;
      text-transform: uppercase;
      letter-spacing: .18em;
      color: var(--gold);
      font-size: 13px;
      margin-bottom: 18px;
    }

    h1 {
      font-size: clamp(48px, 8vw, 92px);
      line-height: .92;
      margin: 0 0 22px;
      font-weight: 500;
    }

    .hero p {
      font-size: clamp(19px, 2.2vw, 26px);
      max-width: 680px;
      margin: 0 0 34px;
      color: #fff3e4;
    }

    /* Page sections */

    section {
      padding: 88px 5vw;
    }

    .section-kicker {
      font-family: Arial, sans-serif;
      text-transform: uppercase;
      letter-spacing: .18em;
      color: var(--gold);
      font-weight: 700;
      font-size: 12px;
      margin-bottom: 16px;
    }

    h2 {
      font-size: clamp(34px, 4.5vw, 58px);
      line-height: 1.05;
      margin: 0 0 24px;
      font-weight: 500;
    }

    .lead {
      font-size: 21px;
      color: #3b322d;
      margin-bottom: 18px;
    }

    .intro,
    .menu-section,
    .takeout-section,
    .private-events {
      display: grid;
      align-items: center;
      gap: 50px;
    }

    .quick-reservation-content {
      text-align: center;
    }

    .quick-reservation-section {
      height: auto;
      min-height: 0;
      overflow: visible;
      background: #151210;
    }

    .quick-reservation-inner,
    #dnn_dnnReservations_pnlQuickReservation,
    .SQBM,
    .SQBO,
    .SQBW,
    .SQB {
      height: auto;
      min-height: 0;
      overflow: visible;
    }

    @media (max-width: 760px) {
      .quick-reservation-section {
        padding-top: 56px;
        padding-bottom: 64px;
      }

      .SQB {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
      }

      .SQB>div,
      .SQB select,
      .SQB input[type="submit"] {
        width: min(340px, 90vw) !important;
      }
    }

    .intro {
      grid-template-columns: 1.1fr .9fr;
      gap: 60px;
      background: var(--cream);
    }

    .intro-card {
      background: var(--wine-dark);
      color: var(--cream);
      padding: 34px;
      border-radius: 4px;
      box-shadow: 0 20px 50px rgba(0, 0, 0, .18);
    }

    .intro-card img {
      border-radius: 3px;
      margin-bottom: 24px;
    }

    .intro-card p {
      margin: 0;
      font-size: 18px;
    }

    .feature-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      background: var(--charcoal);
      color: var(--cream);
    }

    .feature {
      min-height: 430px;
      padding: 34px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      position: relative;
      overflow: hidden;
      border-radius: 3px;
      background: #111;
    }

    .feature::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(0, 0, 0, .82), rgba(0, 0, 0, .12));
      z-index: 1;
    }

    .feature.one {
      background: url('images/CYN2026-135-3638.jpg') center / cover no-repeat;
    }

    .feature.two {
      background: url('images/CYN2026-106-2810.jpg') center / cover no-repeat;
    }

    .feature.three {
      background: url('images/CYN2026-110-2852.jpg') center / cover no-repeat;
    }

    .feature>* {
      position: relative;
      z-index: 2;
    }

    .feature h3 {
      font-size: 31px;
      line-height: 1.05;
      margin: 0 0 12px;
      font-weight: 500;
    }

    .feature p {
      margin: 0;
      font-size: 17px;
      color: #f4e7d7;
    }

    .menu-section {
      grid-template-columns: .8fr 1.2fr;
      gap: 58px;
      background: var(--cream);
    }

    .menu-list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 18px;
      font-family: Arial, sans-serif;
    }

    .menu-item {
      padding: 22px;
      background: var(--warm-white);
      border-left: 4px solid var(--gold);
      box-shadow: 0 8px 25px rgba(0, 0, 0, .06);
    }

    .menu-item strong {
      display: block;
      font-family: Georgia, 'Times New Roman', serif;
      font-size: 22px;
      margin-bottom: 6px;
      color: var(--wine);
    }

    .photo-band {
      display: grid;
      grid-template-columns: 1.2fr .8fr 1fr;
      gap: 16px;
      background: var(--warm-white);
      padding-top: 0;
    }

    .photo-band img {
      width: 100%;
      height: 360px;
      object-fit: cover;
      border-radius: 3px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, .12);
    }

    .photo-band img:nth-child(2) {
      height: 460px;
    }

    .open-kitchen {
      background:
        linear-gradient(rgba(43, 17, 19, .88), rgba(43, 17, 19, .88)),
        url('images/CYN2026-113-2914.jpg') center / cover fixed;
      color: var(--cream);
      text-align: center;
    }

    .open-kitchen .inner {
      max-width: 850px;
      margin: 0 auto;
    }

    .open-kitchen p {
      font-size: 22px;
      color: #f5e7d3;
    }

    .takeout-section {
      grid-template-columns: .95fr 1.05fr;
      background: var(--cream);
    }

    .takeout-section img,
    .private-events img {
      border-radius: 3px;
      box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
    }

    .private-events {
      grid-template-columns: 1.1fr .9fr;
      background: var(--warm-white);
    }

    .cta-strip {
      background: var(--olive);
      color: var(--cream);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
      padding: 54px 5vw;
    }

    .cta-strip h2 {
      font-size: clamp(30px, 4vw, 48px);
      margin: 0;
    }

    footer {
      background: #151210;
      color: #cfc1ad;
      padding: 48px 5vw;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 30px;
      font-family: Arial, sans-serif;
      font-size: 14px;
    }

    footer strong {
      display: block;
      color: var(--gold);
      margin-bottom: 12px;
      text-transform: uppercase;
      letter-spacing: .12em;
      font-size: 12px;
    }

    .site-footer {
      background: #2f2d25;
      color: #f4efe6;
      padding: 34px 5vw 28px;
      font-family: Arial, sans-serif;
      display: block;
    }

    .footer-logo {
      display: flex;
      justify-content: center;
      margin-bottom: 42px;
    }

    .footer-logo img {
      width: min(320px, 70vw);
      filter: brightness(0) invert(1);
    }

    .footer-columns {
      max-width: 1140px;
      margin: 0 auto 34px;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 70px;
      text-align: center;
    }

    .footer-column h3 {
      margin: 0 0 10px;
      color: #f4efe6;
      font-size: 21px;
      font-weight: 400;
      text-transform: uppercase;
    }

    .footer-column p {
      margin: 0;
      font-size: 14px;
      line-height: 1.6;
      font-weight: 700;
    }

    .footer-column a {
      color: #f4efe6;
      text-decoration: none;
    }

    .footer-hours {
      display: grid;
      grid-template-columns: auto auto;
      gap: 8px 26px;
      justify-content: center;
      font-size: 14px;
      font-weight: 700;
      text-align: left;
    }

    .footer-social {
      display: flex;
      justify-content: center;
      gap: 86px;
      margin: 28px 0 28px;
    }

    .footer-social a {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #2f2d25;
      background: #f4efe6;
      text-decoration: none;
      font-size: 22px;
      font-weight: 700;
    }

    .footer-bottom {
      max-width: 1140px;
      margin: 0 auto;
      padding-top: 14px;
      border-top: 1px solid rgba(244, 239, 230, .65);
      display: flex;
      justify-content: space-between;
      gap: 20px;
      font-size: 14px;
      font-weight: 700;
    }

    @media (max-width: 800px) {
      .footer-columns {
        grid-template-columns: 1fr;
        gap: 34px;
      }

      .footer-bottom {
        flex-direction: column;
        text-align: center;
      }
    }

    /* Spotlight popup */

    .spotlight-popup {
      position: fixed;
      inset: 0;
      z-index: 9999;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(25, 21, 19, 0.58);
    }

    .spotlight-popup.is-hidden {
      display: none;
    }

    .spotlight-popup-box {
      position: relative;
      width: min(520px, 92vw);
      background: #fffaf3;
      box-shadow: 0 24px 70px rgba(0, 0, 0, .35);
      border-radius: 6px;
      overflow: hidden;
      text-align: center;
    }

    .spotlight-image {
      width: 100%;
      height: 280px;
      object-fit: cover;
    }

    .spotlight-content {
      padding: 32px 34px 36px;
    }

    .spotlight-content h2 {
      margin: 0 0 14px;
      color: var(--wine);
      font-size: 38px;
    }

    .spotlight-content p {
      margin: 0 0 24px;
      font-size: 18px;
      color: #3b322d;
    }

    a.spotlight-button {
      display: inline-block;
      padding: 13px 24px;
      border-radius: 999px;
      background: var(--gold);
      color: #1e1713;
      text-decoration: none;
      font-family: Arial, sans-serif;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      font-size: 12px;
      border: solid 1px transparent;
    }

    a.spotlight-button:hover {
      background: var(--cream);
      border: solid 1px var(--charcoal);
    }

    .spotlight-close {
      position: absolute;
      top: 12px;
      right: 14px;
      z-index: 2;
      width: 38px;
      height: 38px;
      border: 0;
      border-radius: 50%;
      background: rgba(25, 21, 19, .75);
      color: #fffaf3;
      font-size: 28px;
      line-height: 38px;
      cursor: pointer;
    }

    /* Mobile */

    @media (max-width: 900px) {
      .topbar {
        flex-direction: row;
        gap: 0;
      }

      .menu-toggle-label {
        display: block;
        color: #fff4e8;
        font-family: Arial, sans-serif;
        font-size: 30px;
        line-height: 1;
        cursor: pointer;
        z-index: 1002;
      }

      nav.u-nav-container {
        display: block;
        position: fixed;
        top: 0;
        left: -320px;
        width: 300px;
        height: 100vh;
        background: #191513;
        padding: 90px 28px 28px;
        z-index: 1001;
        transition: left .3s ease;
        box-shadow: 15px 0 40px rgba(0, 0, 0, .35);
        overflow-y: auto;
      }

      .menu-toggle:checked~nav.u-nav-container {
        left: 0;
      }

      .mobile-menu-close {
        display: block;
        position: absolute;
        top: 22px;
        right: 26px;
        width: 44px;
        height: 44px;
        padding: 0;
        margin: 0;
        color: #fff4e8;
        font-family: Arial, sans-serif;
        font-size: 38px;
        line-height: 44px;
        text-align: center;
        cursor: pointer;
        z-index: 1003;
      }

      .u-nav-1 {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
      }

      .u-nav-item {
        width: 100%;
      }

      .u-nav-link {
        display: block;
        width: 100%;
        padding: 14px 0 !important;
        color: #fff4e8;
        border-bottom: 1px solid rgba(255, 255, 255, .12);
      }

      .u-nav-popup {
        display: block;
        position: static;
        min-width: 0;
        padding: 0 0 0 18px;
        background: transparent;
        border: none;
        box-shadow: none;
      }

      .u-nav-popup::before {
        display: none;
      }

      .u-nav-2 {
        background: transparent;
        border: 0;
        box-shadow: none;
        padding: 0 0 8px;
      }

      .u-nav-2 .u-nav-link {
        background: transparent;
        color: #fff4e8;
        opacity: .82;
        border-bottom: none;
        padding: 10px 0 !important;
        font-size: 12px;
      }

      .rzNavButton .u-nav-link {
        text-align: center;
        border-bottom: none;
      }

      li.rzNavButton {
        margin-top: 18px;
      }

      .u-nav-popup {
        display: none;
        position: static;
        min-width: 0;
        padding: 0 0 0 18px;
        background: transparent;
        border: none;
        box-shadow: none;
      }

      .u-nav-item.is-open>.u-nav-popup {
        display: block;
      }

      .has-popup>.u-nav-link::after {
        float: right;
      }

      .hero {
        min-height: 84vh;
        padding-top: 190px;
      }

      .intro,
      .menu-section,
      .takeout-section,
      .private-events,
      .feature-grid,
      .photo-band,
      footer {
        grid-template-columns: 1fr;
      }

      .photo-band img,
      .photo-band img:nth-child(2) {
        height: 320px;
      }

      .cta-strip {
        flex-direction: column;
        align-items: flex-start;
      }
    }

    @media (max-width: 600px) {
      :root {
        --topline-height: 76px;
      }

      .site-topline {
        flex-direction: column;
        gap: 6px;
        padding-right: 48px;
      }

      .site-topline-close {
        position: absolute;
        right: 12px;
        top: 50%;
        transform: translateY(-50%);
      }

      .spotlight-image {
        height: 220px;
      }

      .spotlight-content {
        padding: 26px 24px 30px;
      }

      .spotlight-content h2 {
        font-size: 32px;
      }
    }

/*  Customize  */

.u-image,
.u-video-poster {
  object-fit: cover;
  display: block;
  vertical-align: middle;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.u-section-1 h1 {
  color:#fff;
}
.ContentPane {
    display: flow-root;
}
