:root {
    --cin-black: #080707;
    --cin-burgundy: #4b0719;
    --cin-red: #8e1e15;
    --cin-cream: #f4e7cd;
    --cin-gold: #d7ad55;
    --cin-gold-light: #f4d88e;
}

.home-2026 {
    background: var(--cin-black);
    color: var(--cin-cream);
}

.cin-hero {
    background: var(--cin-black);
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(245px, 23vw, 360px);
    min-height: 100svh;
    overflow: hidden;
    position: relative;
}

.cin-collage {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    height: 100svh;
    min-height: 720px;
    overflow: hidden;
    padding-right: 1.5rem;
    position: relative;
    transform: skewX(-13deg) translateX(-8%);
    width: 116%;
}

.cin-collage:after {
    background: linear-gradient(0deg, rgba(0, 0, 0, .68) 0%, rgba(0, 0, 0, .38) 28%, rgba(0, 0, 0, .1) 58%);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.cin-panel {
    background: var(--cin-burgundy);
    border-right: 13px solid var(--cin-black);
    height: 100%;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.cin-panel img {
    animation: cin-photo-drift 12s ease-in-out infinite alternate;
    height: 100%;
    left: 50%;
    max-width: none;
    object-fit: cover;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) skewX(13deg) scale(1.22);
    width: 130%;
    will-change: transform;
}

.cin-panel-bar img {
    animation-delay: -4s;
    animation-duration: 14s;
}

.cin-panel-service img {
    animation-delay: -8s;
    animation-duration: 16s;
}

@keyframes cin-photo-drift {
    0% { transform: translate(-52%, -51%) skewX(13deg) scale(1.22); }
    100% { transform: translate(-48%, -49%) skewX(13deg) scale(1.33); }
}

.cin-panel-food img {
    object-position: 49% 50%;
}

.cin-panel-bar img {
    object-position: 50% 50%;
}

.cin-panel-service img {
    object-position: 48% 48%;
}

.cin-hero-copy {
    animation-duration: 1.15s;
    bottom: clamp(2rem, 7vh, 5rem);
    left: clamp(1.25rem, 4.5vw, 5rem);
    max-width: 580px;
    position: absolute;
    text-shadow: 0 2px 22px rgba(0, 0, 0, .55);
    z-index: 3;
}

.cin-hero-copy h1 {
    color: #fff8e9;
    font-size: clamp(3.8rem, 7.5vw, 8.25rem);
    font-weight: 300;
    letter-spacing: -.045em;
    line-height: .82;
    margin: 0 0 1.5rem;
    text-decoration: none;
    text-transform: uppercase;
}

.cin-hero-copy > p:not(.cin-eyebrow) {
    font-size: clamp(1rem, 1.25vw, 1.25rem);
    max-width: 480px;
}

.cin-eyebrow,
.cin-section-label {
    color: var(--cin-gold-light);
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .22em;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.cin-outline-link {
    border-bottom: 1px solid var(--cin-gold);
    color: #fff8e9;
    display: inline-block;
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .16em;
    padding: .4rem 0;
    text-transform: uppercase;
}

.cin-outline-link:hover,
.cin-outline-link:focus-visible {
    color: var(--cin-gold-light);
    text-decoration: none;
}

.cin-hero-nav {
    align-items: center;
    background: var(--cin-black);
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
    padding: 3rem 2rem;
    position: relative;
    z-index: 4;
    animation-duration: 1.4s;
}

.cin-brand {
    margin-bottom: clamp(2rem, 5vh, 4rem);
}

.cin-brand img,
.cin-mobile-brand img {
    filter: brightness(0) saturate(100%) invert(79%) sepia(49%) saturate(560%) hue-rotate(358deg) brightness(92%) contrast(87%);
}

.cin-hero-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}

.cin-hero-nav li {
    margin: .28rem 0;
}

.cin-hero-nav li a {
    color: var(--cin-gold-light);
    font-size: clamp(1.15rem, 1.7vw, 1.7rem);
    font-weight: 400;
    letter-spacing: .06em;
    text-transform: uppercase;
    transition: color .25s ease, letter-spacing .25s ease;
}

.cin-hero-nav li a:hover,
.cin-hero-nav li a:focus-visible {
    color: #fff8e9;
    letter-spacing: .1em;
    text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
    .cin-panel img,
    .animate__animated {
        animation: none !important;
        transition: none !important;
    }
}

.cin-instagram {
    color: var(--cin-gold-light);
    font-size: 1.25rem;
    margin-top: clamp(2rem, 5vh, 4rem);
}

.cin-mobile-brand {
    display: none;
}

.cin-mobile-carousel,
.cin-menu-toggle {
    display: none;
}

.cin-intro {
    background: var(--cin-cream);
    color: #261512;
    padding: clamp(5rem, 9vw, 9rem) 0;
}

.cin-intro h2 {
    color: var(--cin-burgundy);
    font-size: clamp(2.6rem, 5vw, 5.5rem);
    font-weight: 300;
    letter-spacing: -.035em;
    line-height: .95;
    margin: 0;
    text-decoration: none;
}

.cin-intro .cin-section-label {
    color: var(--cin-red);
}

.cin-intro-lead {
    color: var(--cin-burgundy);
    font-size: clamp(1.25rem, 2vw, 1.75rem);
    line-height: 1.45;
}

.cin-intro-links {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2rem;
    margin-top: 2rem;
}

.cin-intro-links a {
    border-bottom: 1px solid var(--cin-red);
    color: var(--cin-burgundy);
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .15em;
    padding-bottom: .35rem;
    text-transform: uppercase;
}

.cin-intro-links a:hover,
.cin-intro-links a:focus-visible {
    color: var(--cin-red);
    text-decoration: none;
}

.home-2026 .menu-section {
    scroll-margin-top: 0;
}

@media (max-width: 991px) {
    .cin-intro .row {
        --bs-gutter-x: 1.5rem;
        --bs-gutter-y: 3rem;
    }

    .cin-hero {
        display: block;
        min-height: 100svh;
    }

    .cin-collage {
        grid-template-columns: 1fr 1fr;
        min-height: 100svh;
        padding: 0;
        transform: none;
        width: 100%;
    }

    .cin-panel {
        border: 0;
    }

    .cin-panel img {
        transform: translate(-50%, -50%);
        width: 100%;
    }

    .cin-panel-food {
        display: none;
    }

    .cin-collage:after {
        background: linear-gradient(180deg, rgba(0, 0, 0, .2), rgba(0, 0, 0, .75));
        content: "";
        inset: 0;
        position: absolute;
    }

    .cin-hero-nav {
        align-items: flex-end;
        background: rgba(8, 7, 7, .84);
        inset: 0 0 auto;
        min-height: 0;
        padding: 1.2rem 1.25rem;
        position: absolute;
    }

    .cin-brand,
    .cin-instagram {
        display: none;
    }

    .cin-hero-nav ul {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem 1rem;
        justify-content: flex-end;
        max-width: calc(100% - 90px);
    }

    .cin-hero-nav li {
        margin: 0;
    }

    .cin-hero-nav li a {
        font-size: .72rem;
        letter-spacing: .08em;
    }

    .cin-mobile-brand {
        display: block;
        left: 1.25rem;
        position: absolute;
        top: .5rem;
        z-index: 5;
    }
}

@media (max-width: 575px) {
    .cin-collage {
        display: block;
        min-height: 100svh;
    }

    .cin-panel-service {
        display: none;
    }

    .cin-panel-bar {
        height: 100svh;
    }

    .cin-panel-bar img {
        object-position: 51% 50%;
    }

    .cin-hero-copy {
        bottom: 2rem;
        left: 1.25rem;
        right: 1.25rem;
    }

    .cin-hero-copy h1 {
        font-size: clamp(3.4rem, 19vw, 5.5rem);
    }

    .cin-hero-nav {
        padding-bottom: .9rem;
        padding-top: .9rem;
    }

    .cin-hero-nav ul {
        gap: .3rem .75rem;
    }

    .cin-mobile-brand {
        top: .15rem;
    }
}

@media (max-width: 767px) {
    .cin-hero {
        background: #eee1ca;
        color: #351d18;
        min-height: 100svh;
    }

    .cin-collage {
        display: none;
    }

    .cin-mobile-carousel {
        display: block;
        height: 100svh;
        overflow: hidden;
        position: absolute;
        inset: 0;
    }

    .cin-mobile-carousel:after {
        background: linear-gradient(180deg, transparent 0%, transparent 52%, rgba(249, 241, 225, .75) 76%, #f9f1e1 100%);
        content: "";
        inset: 0;
        pointer-events: none;
        position: absolute;
        z-index: 2;
    }

    .cin-mobile-carousel:has(.cin-mobile-featured.slick-current):after {
        background: linear-gradient(180deg, transparent 0%, transparent 44%, rgba(249, 241, 225, .78) 71%, #f9f1e1 100%);
    }

    .cin-mobile-carousel .slick-list,
    .cin-mobile-carousel .slick-track,
    .cin-mobile-carousel .slick-slide,
    .cin-mobile-carousel figure {
        height: 100svh;
        margin: 0;
    }

    .cin-mobile-carousel img {
        height: 100%;
        object-fit: cover;
        object-position: center 42%;
        width: 100%;
    }

    .cin-mobile-carousel .slick-dots {
        bottom: 1.25rem;
        display: flex;
        gap: .55rem;
        justify-content: center;
        z-index: 5;
    }

    .cin-mobile-carousel .slick-dots li {
        height: auto;
        margin: 0;
        width: auto;
    }

    .cin-mobile-carousel .slick-dots li button {
        background: rgba(69, 31, 24, .3);
        border-radius: 50%;
        height: 7px;
        padding: 0;
        width: 7px;
    }

    .cin-mobile-carousel .slick-dots li button:before {
        display: none;
    }

    .cin-mobile-carousel .slick-dots li.slick-active button {
        background: #652b27;
        transform: scale(1.35);
    }

    .cin-mobile-brand {
        left: 1rem;
        top: .55rem;
    }

    .cin-brand,
    .cin-instagram {
        display: none;
    }

    .cin-mobile-brand img {
        filter: brightness(0) saturate(100%) invert(79%) sepia(49%) saturate(560%) hue-rotate(358deg) brightness(92%) contrast(87%);
    }

    .cin-hero-nav {
        align-items: flex-end;
        background: rgba(8, 7, 7, .94);
        min-height: 72px;
        padding: 1rem;
    }

    .cin-menu-toggle {
        background: transparent;
        border: 0;
        display: grid;
        gap: 5px;
        padding: .55rem .2rem;
        position: relative;
        z-index: 2;
    }

    .cin-menu-toggle span {
        background: var(--cin-gold-light);
        display: block;
        height: 1px;
        transition: transform .25s ease, opacity .2s ease;
        width: 27px;
    }

    .cin-menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(6px) rotate(45deg); }
    .cin-menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
    .cin-menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-6px) rotate(-45deg); }

    .cin-hero-nav ul {
        align-items: flex-end;
        background: rgba(8, 7, 7, .98);
        border-bottom: 1px solid rgba(201, 166, 94, .45);
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: .8rem;
        left: 0;
        margin: 0;
        max-width: none;
        opacity: 0;
        padding: 5.5rem 1.25rem 1.5rem;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: 0;
        transform: translateY(-1rem);
        transition: opacity .25s ease, transform .25s ease;
        visibility: hidden;
    }

    .cin-hero-nav.cin-menu-open ul {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
        visibility: visible;
    }

    .cin-hero-nav li a {
        color: var(--cin-gold-light);
        font-size: 1rem;
        letter-spacing: .1em;
    }

    .cin-hero-nav li a:hover,
    .cin-hero-nav li a:focus-visible {
        color: #fff8e9;
    }

    .cin-hero-copy {
        bottom: 4.25rem;
        color: #351d18;
        left: 1.25rem;
        right: 1.25rem;
        text-shadow: none;
    }

    .cin-hero-copy h1 {
        color: #4b211d;
        font-size: clamp(3.2rem, 18vw, 5rem);
    }

    .cin-hero-copy > p:not(.cin-eyebrow) {
        color: #422d26;
    }

    .cin-eyebrow {
        color: #8e1e15;
    }

    .cin-outline-link {
        border-color: #8e1e15;
        color: #4b211d;
    }
}
