:root {
    --espresso: #241509;
    --espresso-2: #34230f;
    --cream: #f7ecd2;
    --parchment: #efdcab;
    --gold: #d9a82c;
    --gold-bright: #f0bf3e;
    --ink: #1b120d;
    --line: rgba(247, 236, 210, 0.18);
    --copper: #d9a82c;
    --copper-bright: #f0bf3e;
    --font-mono: 'Courier New', monospace;
    --font-georgia: Georgia, serif;
    --font-canela: 'Canela', 'Iowan Old Style', Georgia, serif;
    --font-iowan: 'Iowan Old Style', Georgia, serif;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    margin: 0;
    padding: 0;
}

body {
    background: #241509;
    color: #f7ecd2;
    font-family: var(--font-iowan);
    -webkit-font-smoothing: antialiased;
    font-size: 17px;
    margin: 0;
    padding: 0;
}

a,
a:hover {
    text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
}

p {
    margin: 0 0 20px;
}

.position-relative {
    position: relative;
}
.sec-padding40 {
    padding: 40px 0;
}

.container, .grid-container {
    max-width: 540px;
    margin-inline: auto;
    padding: 0 0.75em;
    width: 100%;
}

@media(min-width:768px) {
    .container, .grid-container {
        max-width: 720px;
    }
}

@media(min-width:992px) {
    .container, .grid-container {
        max-width: 960px;
    }
}

@media(min-width:1200px) {
    .container, .grid-container {
        max-width: 1360px;
    }
}

/* Header CSS */
header.site-header {
    border-bottom: 1px solid var(--line);
    background-color: #241509;
    padding: 23px 0;
    position: relative;
}
header.site-header .header-image {
    width: 55px;
}
header .site-branding > .main-title {
    margin: 0;
    font-size: 25px;
    font-weight: 700;
    text-transform: none;
    line-height: normal
}
header .site-branding .site-description {
    color: var(--contrast-2);
    font-size: 0.62rem;
    opacity: 0.65;
    margin: 0px;
    font-family: var(--font-mono);
    letter-spacing: 0.5952px;
    text-transform: uppercase;
    line-height: 1.5;
    font-weight: 400;
    color: var(--cream);
}
header  .site-branding > .main-title a, .site-branding > .main-title a:hover {
    color: var(--contrast);
    font-family: var(--font-canela);
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--cream);
    font-size:20.8px;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li a:focus,
.main-navigation .main-nav ul li a:active{
    opacity: 1 !important;
    color: var(--copper-bright) !important;
     transition: .3s ease-in-out;
}
@media (min-width: 768px) { 
.main-navigation.sub-menu-right {
    background-color: unset;
}
.main-navigation .main-nav ul li a {
    padding: 0;
    line-height: 0;
    font-family: var(--font-mono);
    letter-spacing: 0.6912px;
    text-transform: uppercase;
    display: flex;
    gap: 28px;
    color: var(--cream);
    text-decoration: none;
    opacity: 0.85;
    font-size: 11.52px;
     transition: .3s ease-in-out;
}
.main-navigation .main-nav>ul {
    gap: 28px;
}
}
/* Hero Banner */

.border_bottom_1 {
    border-bottom: 1px solid var(--line);
}

.hero_grid {
    position: relative;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 50px;
    align-items: center;
}
.hero-eyebrow {
    font-size: 12px;
    opacity: 0.75;
    color: var(--copper-bright);
    margin-bottom: 18px;
    display: block;
}
.herobn-content :where(h1, h2, h3, h4, h5, h6) {
    font-family: var(--font-canela);
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1em;
    margin: 0 0 28px;
    font-size: 82px;
}
.herobn-content :where(h1, h2, h3, h4, h5, h6) span {
    font-style: italic;
    color: var(--copper-bright);
}

.herobn-content p {
    max-width: 70%;
    font-size: 18px;
    line-height: 1.55em;
    color: var(--parchment);
    opacity: 0.9;
    margin: 0;
}

.herobn-image img {
    width: 100%;
    display: block;
    border-radius: 4px;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5);
}

.ticket {
    position: absolute;
    right: -14px;
    bottom: -26px;
    width: 200px;
    background: var(--cream);
    color: var(--ink);
    padding: 16px 16px 18px;
    transform: rotate(3deg);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
    z-index: 2;
}
.ticket::before {
    content: "";
    position: absolute;
    inset: 6px;
    border: 1px dashed rgba(36, 23, 18, 0.35);
}
.ticket .mono {
    font-size: 10px;
    color: var(--copper);
}
.ticket .loc {
    font-family: Georgia, serif;
    font-size: 18px;
    margin: 6px 0 5px;
    line-height: 1.2em;
}
.ticket .time {
    font-size: 13px;
    opacity: 0.7;
}

/* Section Title */

.sec_title {
    max-width: 600px;
    text-align: left;
    margin-bottom: 48px;
}
.sec_title > span {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    opacity: 0.75;
    font-family: var(--font-mono);
    letter-spacing: 0.96px;
    text-transform: uppercase;
}
.sec_title > :where(h1, h2, h3, h4, h5, h6) {
    font-size: 39px;
    font-family: var(--font-canela);
    font-weight: 700;
    letter-spacing: -0.16px;
    margin: -0;
    line-height: 1.1em;
}
.serviceGrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: var(--line);
    border: 1px solid var(--line);
}
.serviceGrid > :only-child {
    grid-column: 1 / -1;
}
.serviceGrid > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
}
.serviceCol {
    background: var(--espresso);
    padding: 48px 40px;
    position: relative;
    transition: background 0.3s ease;
}
.serviceCol:hover {
    background: var(--espresso-2);
}
.serviceCol .tag {
    display: inline-block;
    border: 1px solid var(--copper);
    color: var(--copper-bright);
    padding: 4px 10px;
    font-size: 11px;
    margin-bottom: 24px;
    text-transform: uppercase;
    font-family: var(--font-mono);
    letter-spacing: 0.06em;
    line-height: normal;
}
.serviceCol > h3 {
    font-family: var(--font-canela);
    font-weight: 700;
    letter-spacing: -0.304px;
    font-size: 30px;
    margin: 0 0 14px;
}
.serviceCol > p {
    color: var(--parchment);
    opacity: 0.85;
    line-height: 1.55em;
    margin: 0 0 30px;
    max-width: 80%;
    font-size: 17px;
}
.btn-actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}
.commn_btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 26px;
    font-size: 13.6px;
    text-decoration: none;
    border: 1px solid var(--copper-bright);
    color: var(--cream);
    transition: all 0.2s ease;
    cursor: pointer;
    background: none;
}
.btn_bright {
    background: var(--copper-bright);
    color: var(--ink);
    border-color: var(--copper-bright);
    font-weight: 600;
}
.commn_btn:not(.btn_bright):hover {
    background: rgba(224, 143, 62, 0.12);
    color: #ffffff;
}
.btn_bright:hover {
    background: var(--cream);
    border-color: var(--cream);
}


/* Truck Window */

.trckwGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--line);
    border: 1px solid var(--line);
}
.trckwCol {
    background: var(--espresso);
    padding: 32px 28px;
}

.trckwCol > h3 {
    font-size: 15.2px;
    color: var(--gold-bright);
    margin: 0 0 15px;
    text-transform: uppercase;
    letter-spacing: 1.28px;
    font-family: var(--font-mono);
    font-weight: 700;
    line-height: 1em;
}
.trckw-item {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 0;
    border-bottom: 1px solid var(--line);
    font-size: 15px;
}
span.trw-name {
    color: var(--cream);
}
span.trw-note {
    display: block;
    font-size: 12px;
    opacity: 0.55;
    margin-top: 2px;
    font-family: var(--font-georgia);
    line-height: 1em;
}
span.trw-note {
    display: block;
    font-size: 12px;
    opacity: 0.55;
    margin-top: 2px;
    font-family: var(--font-georgia)
}
span.trw-price {
    color: var(--gold-bright);
    white-space: nowrap;
    font-family:var(--font-mono)
}
.trckw-item:last-child {
    border-bottom: none;
}
.trckw-cta{
    margin-top: 30px;
}

/* Schedule  */
.schedule_md{
    background: var(--espresso-2);
}

.WeekGrid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
}

.weekNav {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 0.85rem;
}

.weekNav  > button {
    background: none;
    border: 1px solid var(--line);
    color: var(--cream);
    width: 32px;
    height: 32px;
    cursor: pointer;
    font-family: inherit;
    padding: 0;
}
.weekNav > span {
    font-family: var(--font-mono);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 11.52px;
    color: var(--cream);
    opacity: 0.75;
}
.schedule-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 40px;
}
.schedule-head > .sec_title{
    margin-bottom: 0;
}
.day_bx {
    border: 1px solid var(--line);
    min-height: 170px;
    padding: 14px 12px;
    position: relative;
    display: flex;
    flex-direction: column;
}
.day_bx > .dow {
    font-size: 11px;
    opacity: 0.6;
    margin-bottom: 4px;
    font-family: var(--font-mono);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin: 0;
}

.day_bx > .num {
    font-size: 20px;
    margin-bottom: 12px;
}
.day_bx .stop {
    margin-top: auto;
    font-size: 12.48px;
    line-height: 1.4em;
}
.day_bx .stop .name {
    color: var(--copper-bright);
    display: block;
    margin-bottom: 2px;
}
.day_bx .stop .hrs {
    opacity: 0.65;
    font-size: 0.7rem;
}
.day_bx.off .stop {
    opacity: 0.35;
    font-style: italic;
}
.day_bx.today {
    border-color: var(--copper-bright);
    background: rgba(224, 143, 62, 0.06);
}

/* Book Us */

.bookGrid > .book_title :where(h1, h2, h3, h4, h5, h6){
    margin-bottom: 30px;
    font-size: 38px;
    font-family: var(--font-canela);
    font-weight: 700;
    letter-spacing: -0.16px;
    line-height: 1.1em;
}

.bookGrid > .book_title p,
.bookGrid > .book_title li {
    max-width: 80%;
    font-size: 16px;
    line-height: 1.55em;
    color: var(--parchment);
    opacity: 0.9;
    margin: 0 0 10px;
}

.bookGrid form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.bookGrid label {
    font-size: 0.7rem;
    opacity: 0.6;
    margin-bottom: 6px;
    display: block;
    font-family: var(--font-mono);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.bookGrid .row2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.bookGrid input, .bookGrid select, .bookGrid textarea {
    width: 100%;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid var(--line) !important;
    color: var(--cream) !important;
    padding: 10px 0 !important;
    font-family: inherit;
    font-size: 0.95rem;
}
.bookGrid select {
    appearance: none;
}
.bookGrid button.commn_btn.btn_bright{
    color: var(--espresso);
}
/* Footer CSS */
footer.site-info {
    background-color: var(--espresso);
    padding: 40px 0;
}

footer .inside-site-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    opacity: 0.6;
    flex-wrap: wrap;
    gap: 10px;
}
footer .inside-site-info .footer-bar {
    margin-bottom: 0;
}

footer .footer-bar * {
    font-family: var(--font-mono);
    letter-spacing: 0.72px;
    text-transform: uppercase;
    font-size: 12px;
    margin: 0;
}

footer .inside-site-info .copyright-bar {
    font-size: 12px;
    color: var(--cream);
    font-family: var(--font-iowan);
}
.bookGrid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
}

@media (max-width: 1199.99px) {
    .herobn-content :where(h1, h2, h3, h4, h5, h6){font-size: 55px;}
    .serviceCol {padding: 30px;}
    .WeekGrid {grid-template-columns: repeat(3, 1fr);}
}

@media (max-width: 991.99px) { 
    .hero_grid {grid-template-columns: 1fr;}
    .hero_grid > :first-child {order: 2; }
    .hero_grid > :last-child {order: 1; }
    .herobn-content :where(h1, h2, h3, h4, h5, h6) {margin: 0 0 20px; font-size: 40px;}
    .herobn-content p {max-width: 100%;font-size: 16px;}
    .serviceGrid {grid-template-columns: repeat(1, 1fr);}
    .sec_title {margin-bottom: 25px;}
    .serviceCol > h3 {font-size: 24px;}
    .serviceCol > p {max-width: 100%;font-size: 16px;}
    .trckwGrid {grid-template-columns: repeat(1, 1fr);}
    .trckw-cta {text-align: center;}
    .bookGrid {grid-template-columns: 1fr;gap: 30px;}
    .bookGrid > .book_title p, .bookGrid > .book_title li {margin: 0 0 10px;}
    footer.site-info {padding: 25px 0;}
}

@media (max-width: 767.99px) {
    .main-navigation, .main-navigation ul ul {background-color: #dbae3c;border-radius: 10px;}
    .menu-toggle { padding: 0px 14px; line-height: 43px;font-size: 20px;color: #241509 !important;}
    .main-navigation .main-nav ul li a, .main-navigation .menu-toggle, .main-navigation .menu-bar-items {color: #707070;}
    .main-navigation .main-nav ul li a { transition: .3s ease-in-out;padding: 18px 0;font-family: var(--font-mono); letter-spacing: 0.6912px;text-transform: uppercase;color: var(--cream);opacity: 1;font-size: 14px;line-height: normal;border-bottom: 1px solid var(--line);}
    .main-navigation .main-nav ul li:last-child a {border-bottom: 0;padding-bottom: 0;}
    .main-navigation .main-nav ul li a:hover,.main-navigation .main-nav ul li a:focus,.main-navigation .main-nav ul li a:active{padding-left: 10px; }
    .ticket{right: -5px;}
    .herobn-content :where(h1, h2, h3, h4, h5, h6) {font-size: 30px;}
    .bookGrid > .book_title :where(h1, h2, h3, h4, h5, h6) {  margin-bottom: 20px;  font-size: 30px;}
    .sec_title > :where(h1, h2, h3, h4, h5, h6) {font-size: 30px;}
    .WeekGrid {grid-template-columns: repeat(2, 1fr);}
  
 }
@media (max-width: 479.99px) {
    .WeekGrid {grid-template-columns: repeat(1, 1fr);}
 }


.iframe-popup {
    display: none;
    position: fixed;
    z-index: 99999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
}

.iframe-popup-content {
    position: relative;
    width: 80%;
    height: 80%;
    margin: 5% auto;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}

.close-popup {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 30px;
    cursor: pointer;
    z-index: 10;
    color: #000;
}

#iframePopup iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.popup-content {
    height: 90vh;
    overflow: hidden;
}
#book_us_md{display:none;}