/* ==========================================================
   Caramela — Header + Hero (fidelidade à referência)
   Carrega depois de style.css / commercial.css
========================================================== */

.ca-header.lif-header{
    height:88px;
    background:transparent !important;
    box-shadow:none !important;
}

.ca-header.scrolled{
    background:rgba(255,248,242,.88) !important;
    backdrop-filter:blur(18px);
    box-shadow:0 8px 30px rgba(92,61,46,.06) !important;
}

.ca-header-inner{
    width:min(1280px, 92%);
    margin:0 auto;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:1.5rem;
}

.ca-logo-wordmark{
    display:flex;
    flex-direction:column;
    line-height:1;
    text-decoration:none;
    z-index:2;
}

.ca-logo-script{
    font-family:var(--font-script);
    font-size:1.85rem;
    color:#5C3D2E;
    line-height:1;
}

.ca-logo-script .ca-heart{
    font-size:.85rem;
    vertical-align:super;
    margin-left:.1rem;
    color:#D68E8E;
}

.ca-logo-tag{
    margin-top:.2rem;
    font-size:.62rem;
    letter-spacing:.2em;
    text-transform:uppercase;
    font-weight:500;
    color:#5C3D2E;
    opacity:.7;
}

.ca-nav{
    justify-self:center !important;
    display:flex !important;
    align-items:center;
    gap:2.25rem;
}

.ca-header .ca-nav a,
.ca-nav a{
    font-size:.92rem;
    font-weight:400;
    color:#5C3D2E;
    letter-spacing:.01em;
}

.ca-header .ca-nav a::after{
    background:#5C3D2E;
    height:1.5px;
    bottom:-6px;
    border-radius:2px;
}

.ca-header-actions{
    justify-self:end;
    display:flex;
    align-items:center;
    gap:.75rem;
}

.ca-header-cta{
    display:inline-flex !important;
    align-items:center;
    gap:.55rem;
    padding:12px 22px !important;
    border-radius:999px !important;
    background:#5C3D2E !important;
    color:#FFF !important;
    font-size:.9rem;
    font-weight:500;
    border:none;
    box-shadow:0 10px 24px rgba(92,61,46,.16);
    transition:transform .35s ease, box-shadow .35s ease, background .35s ease;
}

.ca-header-cta:hover{
    background:#4a3124 !important;
    transform:translateY(-2px);
    box-shadow:0 14px 28px rgba(92,61,46,.2);
    color:#FFF !important;
}

/* ----- HERO ----- */

.ca-hero.hero{
    background:#FFF8F2 !important;
    min-height:100vh !important;
    padding:0 !important;
    display:flex !important;
    flex-direction:column;
    justify-content:flex-end;
    overflow:hidden;
    align-items:stretch !important;
}

.ca-hero::before,
.ca-hero::after{
    display:none !important;
}

.ca-hero-shell{
    flex:1;
    width:min(1280px, 92%);
    margin:0 auto;
    padding:110px 0 2.5rem;
    display:grid;
    grid-template-columns:42% 58%;
    align-items:center;
    gap:0;
    min-height:calc(100vh - 48px);
    position:relative;
}

.ca-hero--text-only .ca-hero-shell{
    grid-template-columns:1fr;
    max-width:720px;
}

.ca-hero-copy{
    position:relative;
    z-index:3;
    padding:2rem 2.5rem 2rem 0;
    max-width:480px;
    animation:caHeroIn .9s ease both;
}

.ca-hero-brand{
    margin-bottom:.15rem;
}

.ca-brand-script{
    font-family:var(--font-script);
    font-size:clamp(3.2rem, 6vw, 4.8rem);
    color:#5C3D2E;
    line-height:.95;
    margin:0;
}

.ca-brand-script .ca-heart{
    font-size:.4em;
    vertical-align:super;
    margin-left:.1rem;
    color:#D68E8E;
}

.ca-brand-tag{
    margin:.35rem 0 0;
    font-size:.72rem;
    letter-spacing:.24em;
    text-transform:uppercase;
    font-weight:500;
    color:#5C3D2E;
    opacity:.65;
}

.ca-hero-title{
    display:flex;
    flex-direction:column;
    gap:.2rem;
    margin:1.75rem 0 1.35rem !important;
    font-size:clamp(1.7rem, 3.4vw, 2.55rem);
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em;
    line-height:1.12;
}

.ca-hero-title--site{
    display:block;
    flex-direction:unset;
    gap:0;
    font-family:var(--font-display, Georgia, serif);
    font-size:clamp(2rem, 4vw, 3.1rem);
    font-weight:600;
    text-transform:none;
    letter-spacing:-0.015em;
    line-height:1.15;
}

.ca-hero-line{
    color:#5C3D2E;
}

.ca-hero-accent{
    color:#D68E8E;
    display:inline-flex;
    align-items:flex-start;
    gap:.4rem;
}

.ca-hero-accent .ca-heart{
    font-size:.48em;
    margin-top:.18em;
    color:#D68E8E;
}

.ca-hero-subtitle{
    margin:0 0 2.25rem !important;
    max-width:400px;
    font-size:1rem;
    font-weight:400;
    line-height:1.7;
    color:rgba(92,61,46,.78);
}

.ca-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    align-items:center;
}

.ca-pill{
    --pill-h: 60px;
    display:inline-flex;
    align-items:center;
    gap:14px;
    min-height:var(--pill-h);
    height:var(--pill-h);
    padding:0 28px 0 12px;
    border-radius:999px;
    font-size:.92rem;
    font-weight:600;
    letter-spacing:.02em;
    text-decoration:none;
    border:1px solid transparent;
    cursor:pointer;
    line-height:1.15;
    font-family:inherit;
    background:none;
    box-sizing:border-box;
    transition:
        transform 300ms ease,
        box-shadow 300ms ease,
        background 300ms ease,
        border-color 300ms ease,
        color 300ms ease;
    will-change:transform;
}

.ca-pill-icon{
    width:40px;
    height:40px;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:1.25rem;
    flex-shrink:0;
    transition:transform 300ms ease, background 300ms ease;
}

.ca-pill-label{
    padding-right:6px;
    white-space:nowrap;
}

.ca-pill--primary{
    color:#FFF;
    background:linear-gradient(
        165deg,
        #7A5440 0%,
        #5C3D2E 48%,
        #4F3427 100%
    );
    box-shadow:
        0 1px 0 rgba(255,255,255,.18) inset,
        0 12px 28px rgba(92,61,46,.18),
        0 4px 10px rgba(92,61,46,.08);
}

.ca-pill--primary .ca-pill-icon{
    background:rgba(255,255,255,.12);
    box-shadow:0 1px 0 rgba(255,255,255,.2) inset;
}

.ca-pill--primary:hover{
    transform:translateY(-4px);
    background:linear-gradient(
        165deg,
        #85604C 0%,
        #654433 48%,
        #56392B 100%
    );
    box-shadow:
        0 1px 0 rgba(255,255,255,.22) inset,
        0 18px 36px rgba(92,61,46,.22),
        0 8px 16px rgba(92,61,46,.1);
    color:#FFF;
}

.ca-pill--primary:hover .ca-pill-icon{
    transform:scale(1.06);
}

.ca-pill--primary:active{
    transform:translateY(-1px);
}

.ca-pill--ghost{
    color:#5C3D2E;
    background:#FFF;
    border-color:rgba(92,61,46,.35);
    box-shadow:0 8px 20px rgba(92,61,46,.05);
    position:relative;
    overflow:hidden;
    z-index:0;
}

.ca-pill--ghost::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        165deg,
        rgba(92,61,46,.06) 0%,
        rgba(92,61,46,.1) 100%
    );
    opacity:0;
    transition:opacity 300ms ease;
    z-index:-1;
}

.ca-pill--ghost .ca-pill-icon{
    background:rgba(92,61,46,.05);
}

.ca-pill--ghost:hover{
    transform:translateY(-4px);
    color:#5C3D2E;
    border-color:rgba(92,61,46,.55);
    box-shadow:0 14px 28px rgba(92,61,46,.1);
}

.ca-pill--ghost:hover::before{
    opacity:1;
}

.ca-pill--ghost:hover .ca-pill-icon{
    transform:scale(1.06);
    background:rgba(92,61,46,.08);
}

.ca-pill--ghost:active{
    transform:translateY(-1px);
}

.ca-hero-location{
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    margin-top:2.25rem;
    font-size:.9rem;
    font-weight:400;
    color:rgba(92,61,46,.65);
}

.ca-heart{
    color:#D68E8E;
    font-weight:400;
}

.ca-hero-media{
    position:relative;
    z-index:1;
    height:calc(100vh - 120px);
    min-height:560px;
    margin-left:-8%;
    width:calc(100% + 8%);
    animation:caHeroMediaIn 1.1s ease .15s both;
}

.ca-hero-media-frame{
    width:100%;
    height:100%;
    border-radius:48px;
    overflow:hidden;
    background:#f3e6db;
    box-shadow:
        0 30px 60px rgba(92,61,46,.12),
        0 8px 20px rgba(92,61,46,.06);
}

.ca-hero-photo{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    display:block;
    transform:scale(1.02);
    transition:transform 8s ease;
    border-radius:0 !important;
    box-shadow:none !important;
    animation:none !important;
    max-width:none !important;
}

.ca-hero-media:hover .ca-hero-photo{
    transform:scale(1.05);
}

.ca-wave--soft path,
.ca-wave--cream path{
    fill:#FFF8F2 !important;
}

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

@keyframes caHeroMediaIn{
    from{ opacity:0; transform:translateX(28px); }
    to{ opacity:1; transform:translateX(0); }
}

@media(max-width:980px){
    .ca-header .ca-nav{
        display:none !important;
    }

    .ca-header-inner{
        grid-template-columns:1fr auto;
    }

    .ca-hero-shell{
        grid-template-columns:1fr;
        padding:100px 0 2rem;
        min-height:auto;
        gap:2rem;
    }

    .ca-hero-copy{
        max-width:none;
        padding:0;
        order:2;
    }

    .ca-hero-media{
        order:1;
        margin-left:0;
        width:100%;
        height:min(58vh, 460px);
        min-height:300px;
    }

    .ca-hero-media-frame{
        border-radius:32px;
    }

    .ca-hero-actions{
        flex-direction:column;
        align-items:stretch;
        gap:16px;
    }

    .ca-pill{
        justify-content:center;
        width:100%;
        padding-right:20px;
    }

    .ca-pill-label{
        white-space:normal;
        text-align:left;
    }
}