/*==================================================
KOTHARI LAMINATES — HOMEPAGE
==================================================*/

:root{
    /* Matches the site-wide navy + beige system in style.css. Kept as a
       separate block (rather than relying on style.css's :root) because
       the homepage hero sits on photography and needs its own on-dark
       variants of the same palette. */
    --kc-ink:#172840;
    --kc-charcoal:#223457;
    --kc-cream:#f3ece0;
    --kc-cream-soft:#e9ddc8;
    --kc-gold:#c7a874;
    --kc-gold-light:#ddc9a3;
    --kc-line:rgba(247,238,222,.28);
}

.kc-home{
    position:relative;
    font-family:"Inter","Segoe UI",Arial,sans-serif;
    color:var(--kc-cream);
    /* Beige, not navy: this wrapper covers the WHOLE homepage, not just
       the hero, and the sections below the hero (Collections) use dark
       navy headings that need a light backdrop. The hero supplies its
       own navy fallback (see .kc-home-hero) for the area behind its
       photo slides. */
    background:var(--kc-cream);
    overflow:hidden;

    /* Break out of the theme's centered content column so the hero runs
       truly edge-to-edge, no matter how the active theme wraps page
       content. */
    width:100vw;
    max-width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
}

body:has(.kc-home){
    overflow-x:hidden;
}

/* Defensive fallback: hides the most common theme page-title/header
   patterns specifically on the homepage, in case the theme's own
   "disable title" setting isn't used for this page. Scoped tightly so
   it never affects titles on any other page. */
body:has(.kc-home) .entry-hero,
body:has(.kc-home) .page-header,
body:has(.kc-home) .page-title,
body:has(.kc-home) .kadence-title-comments-wrap,
body:has(.kc-home) .entry-header,
body:has(.kc-home) header.entry-header{
    display:none !important;
}

.kc-home,
.kc-home *{
    box-sizing:border-box;
}

/*=========================
TOP BAR
=========================*/

.kc-home-topbar{
    position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:30;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:26px clamp(20px,4vw,56px) 0;
}

.kc-home-logo{
    display:flex;
    align-items:center;
    gap:12px;
}

.kc-home-logo-mark{
    width:38px;
    height:38px;
    border:1px solid var(--kc-gold-light);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:"Playfair Display",Georgia,serif;
    font-size:18px;
    color:var(--kc-gold-light);
    letter-spacing:0;
}

.kc-home-logo-text{
    font-family:"Playfair Display",Georgia,serif;
    font-weight:600;
    font-size:clamp(15px,1.6vw,19px);
    letter-spacing:.04em;
    color:#fff;
    text-transform:uppercase;
}

/*=========================
CONTACT PANEL
=========================*/

.kc-home-contact{
    position:relative;
}

.kc-home-contact-toggle{
    background:rgba(255,255,255,.08);
    border:1px solid var(--kc-line);
    color:#fff;
    font-family:"Inter",sans-serif;
    font-size:13px;
    letter-spacing:.06em;
    text-transform:uppercase;
    padding:11px 20px;
    border-radius:999px;
    cursor:pointer;
    transition:background .2s ease, border-color .2s ease;
}

.kc-home-contact-toggle:hover,
.kc-home-contact-toggle[aria-expanded="true"]{
    background:var(--kc-gold);
    border-color:var(--kc-gold);
    color:var(--kc-ink);
}

.kc-home-contact-panel{
    position:absolute;
    top:calc(100% + 12px);
    right:0;
    min-width:280px;
    background:rgba(23,40,64,.97);
    border:1px solid var(--kc-line);
    border-radius:16px;
    padding:10px;
    opacity:0;
    transform:translateY(-8px);
    pointer-events:none;
    transition:opacity .2s ease, transform .2s ease;
    box-shadow:0 20px 45px rgba(0,0,0,.4);
    backdrop-filter:blur(6px);
}

.kc-home-contact-panel.open{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
}

.kc-home-contact-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:12px 14px;
    border-radius:10px;
    text-decoration:none;
    color:#fff;
    transition:background .15s ease;
}

.kc-home-contact-row:hover{
    background:rgba(255,255,255,.08);
}

.kc-home-contact-row + .kc-home-contact-row{
    border-top:1px solid rgba(255,255,255,.08);
}

.kc-home-contact-name{
    font-size:14px;
    font-weight:500;
}

.kc-home-contact-phone{
    font-size:13px;
    color:var(--kc-gold-light);
    letter-spacing:.02em;
}

.kc-home-contact-email .kc-home-contact-phone{
    font-size:12px;
    word-break:break-all;
    text-align:right;
}

/*=========================
HERO
=========================*/

.kc-home-hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--kc-ink);
    color:var(--kc-cream);
}

.kc-home-slides{
    position:absolute;
    inset:0;
    z-index:0;
}

.kc-home-slide{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    opacity:0;
    transform:scale(1.04);
    transition:opacity 1.6s ease, transform 8s ease;
}

.kc-home-slide.is-active{
    opacity:.72;
    transform:scale(1);
}

.kc-home-hero-scrim{
    position:absolute;
    inset:0;
    background:
        radial-gradient(ellipse at center, rgba(23,40,64,.22) 0%, rgba(23,40,64,.6) 78%),
        linear-gradient(180deg, rgba(23,40,64,.5) 0%, rgba(23,40,64,.18) 40%, rgba(23,40,64,.6) 100%);
}

.kc-home-hero-content{
    position:relative;
    z-index:10;
    text-align:center;
    max-width:820px;
    padding:0 24px;
}

.kc-home-eyebrow{
    font-size:13px;
    letter-spacing:.32em;
    text-transform:uppercase;
    color:var(--kc-gold-light);
    margin-bottom:22px;
}

.kc-home-headline{
    font-family:"Playfair Display",Georgia,serif;
    font-weight:600;
    font-size:clamp(38px,6.4vw,76px);
    line-height:1.12;
    color:#fff;
    margin-bottom:22px;
    letter-spacing:.01em;
    text-shadow:0 4px 24px rgba(23,40,64,.55);
}

.kc-home-subline{
    font-size:clamp(15px,1.6vw,18px);
    color:rgba(255,255,255,.85);
    max-width:520px;
    margin:0 auto 40px;
    line-height:1.6;
    text-shadow:0 2px 14px rgba(23,40,64,.5);
}

.kc-home-cta{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:transparent;
    border:1px solid var(--kc-gold-light);
    color:#fff;
    font-size:14px;
    letter-spacing:.14em;
    text-transform:uppercase;
    text-decoration:none;
    padding:17px 34px;
    border-radius:999px;
    transition:background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
}

.kc-home-cta:hover{
    background:var(--kc-gold);
    border-color:var(--kc-gold);
    color:var(--kc-ink);
    transform:translateY(-2px);
}

.kc-home-cta-arrow{
    transition:transform .25s ease;
}

.kc-home-cta:hover .kc-home-cta-arrow{
    transform:translateX(4px);
}

/*=========================
SCROLL HINT
=========================*/

.kc-home-scroll-hint{
    position:absolute;
    bottom:34px;
    left:50%;
    transform:translateX(-50%);
    width:26px;
    height:42px;
    border:1px solid rgba(255,255,255,.4);
    border-radius:14px;
    z-index:10;
}

.kc-home-scroll-hint span{
    position:absolute;
    top:8px;
    left:50%;
    width:4px;
    height:8px;
    margin-left:-2px;
    background:var(--kc-gold-light);
    border-radius:2px;
    animation:kc-scroll-bounce 1.8s ease infinite;
}

@keyframes kc-scroll-bounce{
    0%{ transform:translateY(0); opacity:1; }
    70%{ transform:translateY(14px); opacity:0; }
    100%{ transform:translateY(14px); opacity:0; }
}

/*=========================
RESPONSIVE
=========================*/

@media(max-width:640px){

    .kc-home-topbar{
        padding:18px 16px 0;
    }

    .kc-home-logo-text{
        display:none;
    }

    .kc-home-contact-panel{
        min-width:240px;
    }

    .kc-home-headline{
        font-size:34px;
    }

    .kc-home-scroll-hint{
        display:none;
    }
}

/*==================================================
3D RENDERS TEASER
==================================================*/

.kc-home-renders-teaser{
    max-width:1400px;
    margin:0 auto;
    padding:64px 24px;
}

.kc-home-renders-block{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    background:var(--kc-ink);
    color:#fff;
    text-decoration:none;
    border-radius:28px;
    padding:44px 48px;
    transition:transform .25s ease, background .25s ease;
}

.kc-home-renders-block:hover{
    transform:translateY(-2px);
    background:var(--kc-charcoal);
}

.kc-home-renders-eyebrow{
    display:block;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--kc-gold-light);
    margin-bottom:10px;
}

.kc-home-renders-text h2{
    font-family:"Playfair Display",Georgia,serif;
    font-size:clamp(24px,3vw,34px);
    color:#fff;
    margin-bottom:8px;
}

.kc-home-renders-text p{
    font-size:14px;
    color:rgba(255,255,255,.75);
    max-width:520px;
}

.kc-home-renders-arrow{
    flex-shrink:0;
    width:56px;
    height:56px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.35);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    transition:background .2s ease, transform .2s ease;
}

.kc-home-renders-block:hover .kc-home-renders-arrow{
    background:rgba(255,255,255,.12);
    transform:translateX(4px);
}

@media(max-width:640px){
    .kc-home-renders-block{
        flex-direction:column;
        align-items:flex-start;
        padding:32px 28px;
    }
}

/*==================================================
COLLECTIONS
==================================================*/

.kc-home-collections{
    max-width:1400px;
    margin:0 auto;
    padding:20px 24px 80px;
}

.kc-home-collections-heading{
    text-align:center;
    margin-bottom:36px;
}

.kc-home-collections-heading .kc-home-eyebrow{
    color:var(--kc-gold);
    font-size:19px;
    font-weight:500;
    letter-spacing:.18em;
    margin-bottom:16px;
}

.kc-home-collections-heading h2{
    font-family:"Playfair Display",Georgia,serif;
    font-size:clamp(26px,3.2vw,38px);
    color:var(--kc-ink);
}

.kc-home-collections-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:20px;
}

.kc-collection-tile{
    position:relative;
    display:block;
    text-decoration:none;
    border-radius:20px;
    overflow:hidden;
    aspect-ratio:3 / 4;
    background:var(--kc-cream);
}

.kc-collection-image{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    background-color:var(--kc-cream-soft);
    transition:transform .5s ease;
}

.kc-collection-tile:hover .kc-collection-image{
    transform:scale(1.05);
}

.kc-collection-tile::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(23,40,64,.05) 20%, rgba(23,40,64,.7) 60%, rgba(23,40,64,.96) 100%);
}

.kc-collection-text{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    z-index:2;
    padding:22px;
    color:#fff;
}

.kc-collection-text h3{
    font-family:"Playfair Display",Georgia,serif;
    font-weight:600;
    font-size:22px;
    letter-spacing:.04em;
    margin-bottom:8px;
    color:#fff !important;
    text-shadow:0 2px 10px rgba(0,0,0,.35);
}

.kc-collection-text p{
    font-size:13px;
    line-height:1.55;
    color:rgba(255,255,255,.92) !important;
    text-shadow:0 1px 6px rgba(0,0,0,.3);
}

@media(max-width:900px){
    .kc-home-collections-grid{
        grid-template-columns:repeat(2, 1fr);
    }
}

@media(max-width:480px){
    .kc-home-collections-grid{
        grid-template-columns:1fr;
    }
}
