/* =================================================================
   PALETĂ
================================================================== */
:root{
    --cookies-bg:#faf8f5;
    --cookies-white:#ffffff;
    --cookies-brown:#4a2e1f;
    --cookies-brown-light:#8c6a58;
    --cookies-border:#d8cec6;
    --cookies-text:#3a3a3a;
    --cookies-muted:#6f6a65;

    --cookies-font-serif:"Ibarra Real Nova", serif;
    --cookies-font-sans:"Special Gothic", sans-serif;
}

.cookies-page,
.cookies-page *{
    box-sizing:border-box;
}

.cookies-page{
    background:var(--cookies-bg);
    font-family:var(--cookies-font-sans);
    color:var(--cookies-text);
}

html{
    scroll-behavior:smooth;
}

/* =================================================================
   BARĂ DE PROGRES
================================================================== */
.cookies-progress{
    position:fixed;
    top:0;
    left:0;
    width:0%;
    height:4px;
    background:var(--cookies-brown);
    z-index:100;
    transition:width .1s linear;
}

/* =================================================================
   HERO
================================================================== */
.cookies-hero{
    position:relative;
    width:100%;
    height:450px;
    overflow:hidden;

    /* Placeholder — înlocuiește cu url('images/cookies-hero.jpg'); background-size:cover; background-position:center; */
    background:
        linear-gradient(150deg, rgba(74,46,31,.3), rgba(0,0,0,.1)),
        radial-gradient(ellipse at 30% 30%, #cbb59e, #8c6a58 75%);
    background-size:cover;
    background-position:center;
}

.cookies-hero-overlay{
    position:absolute;
    inset:0;
    background:rgba(30,20,14,.5);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:0 6%;
}

.cookies-hero-eyebrow,
.cookies-hero-title,
.cookies-hero-subtitle{
    opacity:0;
    transform:translateY(-30px);
    transition:opacity .8s ease, transform .8s ease;
}
.cookies-hero.cookies-hero-in-view .cookies-hero-eyebrow{
    opacity:1; transform:translateY(0);
}
.cookies-hero.cookies-hero-in-view .cookies-hero-title{
    opacity:1; transform:translateY(0);
    transition-delay:.15s;
}
.cookies-hero.cookies-hero-in-view .cookies-hero-subtitle{
    opacity:1; transform:translateY(0);
    transition-delay:.3s;
}

.cookies-hero-eyebrow{
    font-size:15px;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
    color:rgba(255,255,255,.85);
    margin-bottom:18px;
}

.cookies-hero-title{
    font-family:var(--cookies-font-serif);
    font-size:clamp(40px, 5vw, 62px);
    font-weight:700;
    color:var(--cookies-white);
    margin-bottom:18px;
}

.cookies-hero-subtitle{
    font-size:17px;
    line-height:1.6;
    max-width:560px;
    color:rgba(255,255,255,.88);
}

/* =================================================================
   LAYOUT PRINCIPAL
================================================================== */
.cookies-layout{
    max-width:1280px;
    margin:auto;
    padding:90px 7% 140px;
    display:grid;
    grid-template-columns:270px 1fr;
    gap:80px;
    align-items:flex-start;
}

/* =================================================================
   SIDEBAR
================================================================== */
.cookies-sidebar{
    position:sticky;
    top:50px;

    opacity:0;
    transform:translateX(-30px);
    transition:opacity .8s ease, transform .8s ease;
}
.cookies-sidebar.cookies-sidebar-in-view{
    opacity:1;
    transform:translateX(0);
}

.cookies-sidebar-list li{
    margin-bottom:4px;
}

.cookies-sidebar-link{
    display:block;
    padding:11px 0 11px 18px;
    border-left:2px solid transparent;
    color:var(--cookies-muted);
    text-decoration:none;
    font-size:15.5px;
    line-height:1.4;
    transition:color .3s ease, border-color .3s ease, font-weight .1s ease;
}
.cookies-sidebar-link:hover,
.cookies-sidebar-link:focus-visible{
    color:var(--cookies-brown);
}
.cookies-sidebar-link.cookies-active{
    color:var(--cookies-brown);
    font-weight:700;
    border-left-color:var(--cookies-brown);
}

/* =================================================================
   CONȚINUT
================================================================== */
.cookies-content{
    max-width:850px;
}

.cookies-section{
    background:var(--cookies-white);
    border-radius:26px;
    padding:52px 56px;
    margin-bottom:34px;
    box-shadow:0 12px 34px rgba(74,46,31,.06);
    transition:transform .4s ease, box-shadow .4s ease;
    scroll-margin-top:40px;

    opacity:0;
    transform:translateY(50px);
}
.cookies-section.cookies-section-visible{
    opacity:1;
    transform:translateY(0);
    transition:opacity .7s ease, transform .7s ease, box-shadow .4s ease;
}

.cookies-section:hover{
    transform:translateY(-5px);
    box-shadow:0 22px 50px rgba(74,46,31,.12);
}
.cookies-section.cookies-section-visible:hover{
    transition:transform .4s ease, box-shadow .4s ease;
}

.cookies-heading{
    font-family:var(--cookies-font-serif);
    font-size:30px;
    font-weight:700;
    color:var(--cookies-brown);
    line-height:1.3;
    margin-bottom:22px;
    scroll-margin-top:40px;
}

.cookies-divider{
    width:60px;
    height:2px;
    background:var(--cookies-brown-light);
    opacity:.5;
    margin-bottom:28px;
}

.cookies-text{
    font-size:16.5px;
    line-height:1.85;
    color:var(--cookies-text);
}
.cookies-text + .cookies-text{
    margin-top:20px;
}

.cookies-list{
    margin-top:18px;
    padding-left:22px;
}
.cookies-list li{
    font-size:16.5px;
    line-height:1.85;
    color:var(--cookies-text);
    margin-bottom:10px;
}
.cookies-list li::marker{
    color:var(--cookies-brown-light);
}

.cookies-text strong{
    color:var(--cookies-brown);
    font-weight:700;
}

/* ---- Subsecțiuni numerotate (dacă sunt necesare în viitor) ---- */
.cookies-subsection{
    margin-top:30px;
    padding-top:26px;
    border-top:1px dashed var(--cookies-border);
}
.cookies-subsection:first-of-type{
    margin-top:34px;
}
.cookies-subsection .cookies-text{
    margin-top:8px;
}

.cookies-subheading{
    font-family:var(--cookies-font-serif);
    font-size:19.5px;
    font-weight:600;
    color:var(--cookies-brown);
    margin-bottom:6px;
}

/* =================================================================
   BUTON "SUS"
================================================================== */
.cookies-backtotop{
    position:fixed;
    right:34px;
    bottom:34px;
    z-index:90;
    background:var(--cookies-brown);
    color:var(--cookies-white);
    border:none;
    padding:14px 26px;
    border-radius:50px;
    font-family:var(--cookies-font-sans);
    font-size:14.5px;
    font-weight:600;
    letter-spacing:.4px;
    cursor:pointer;
    box-shadow:0 12px 28px rgba(0,0,0,.2);

    opacity:0;
    visibility:hidden;
    transform:translateY(14px);
    transition:opacity .35s ease, transform .35s ease, visibility 0s linear .35s, background .3s ease;
}
.cookies-backtotop.cookies-backtotop-visible{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
    transition:opacity .35s ease, transform .35s ease, visibility 0s linear 0s, background .3s ease;
}
.cookies-backtotop:hover,
.cookies-backtotop:focus-visible{
    background:var(--cookies-brown-light);
}
.cookies-backtotop:focus-visible{
    outline:2px solid var(--cookies-white);
    outline-offset:3px;
}

/* =================================================================
   RESPONSIVE
================================================================== */
@media (max-width:1024px){
    .cookies-layout{
        grid-template-columns:1fr;
        gap:40px;
        padding:70px 6% 110px;
    }

    .cookies-sidebar{
        position:static;
        transform:translateY(-20px);
    }
    .cookies-sidebar.cookies-sidebar-in-view{
        transform:translateY(0);
    }

    .cookies-sidebar-list{
        display:flex;
        flex-wrap:nowrap;
        overflow-x:auto;
        gap:6px;
        padding-bottom:14px;
        border-bottom:1px solid var(--cookies-border);
        -webkit-overflow-scrolling:touch;
    }
    .cookies-sidebar-list li{
        margin-bottom:0;
        flex-shrink:0;
    }
    .cookies-sidebar-link{
        padding:10px 16px;
        border-left:none;
        border-bottom:2px solid transparent;
        white-space:nowrap;
        border-radius:50px;
        background:var(--cookies-white);
    }
    .cookies-sidebar-link.cookies-active{
        border-left-color:transparent;
        border-bottom-color:var(--cookies-brown);
        background:var(--cookies-white);
    }

    .cookies-section{
        padding:38px 32px;
    }
}

@media (max-width:640px){
    .cookies-hero{
        height:380px;
    }
    .cookies-sidebar-list{
        flex-wrap:wrap;
        overflow-x:visible;
    }
    .cookies-section{
        padding:30px 24px;
        border-radius:20px;
    }
    .cookies-heading{
        font-size:25px;
    }
    .cookies-backtotop{
        right:18px;
        bottom:18px;
        padding:12px 20px;
        font-size:13.5px;
    }
}

/* =================================================================
   ACCESIBILITATE
================================================================== */
@media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    .cookies-hero-eyebrow,
    .cookies-hero-title,
    .cookies-hero-subtitle,
    .cookies-sidebar,
    .cookies-section{
        transition:none !important;
        opacity:1 !important;
        transform:none !important;
    }
    .cookies-backtotop{
        transition:opacity .2s ease, visibility 0s !important;
    }
}