
:root{
    --ink:#171914;
    --forest:#203126;
    --forest-2:#2e4935;
    --cream:#f5f0e6;
    --paper:#fffdf8;
    --gold:#b9904e;
    --gold-light:#d7ba7c;
    --muted:#6e7069;
    --line:#ded8ca;
    --white:#ffffff;
    --shadow:0 18px 50px rgba(22,25,20,.12);
    --serif:"Cormorant Garamond", Georgia, serif;
    --sans:"Montserrat", Arial, sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:var(--sans);
    color:var(--ink);
    background:var(--paper);
    line-height:1.65;
}
img{display:block;width:100%}
a{text-decoration:none;color:inherit}
button{font:inherit}
.container{width:min(1180px, calc(100% - 40px)); margin:0 auto}
.section{padding:105px 0}
.eyebrow{
    margin:0 0 12px;
    text-transform:uppercase;
    letter-spacing:.23em;
    font-size:.75rem;
    font-weight:700;
    color:var(--gold);
}
.eyebrow.light{color:#f3e8cf}
.eyebrow.gold{color:var(--gold-light)}
h1,h2,h3,h4{margin-top:0}
h1,h2{
    font-family:var(--serif);
    font-weight:600;
    line-height:.98;
}
h1{font-size:clamp(3.6rem,7vw,7rem); letter-spacing:-.035em}
h2{font-size:clamp(2.7rem,4.5vw,4.7rem); letter-spacing:-.025em}
.lead{font-size:1.2rem; color:#3f433d}
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:50px;
    padding:0 27px;
    border:1px solid transparent;
    text-transform:uppercase;
    letter-spacing:.1em;
    font-size:.76rem;
    font-weight:700;
    transition:.25s ease;
    cursor:pointer;
}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:var(--gold);color:white}
.btn-gold:hover{background:#a67c3b}
.btn-ghost{border-color:rgba(255,255,255,.65);color:white;background:rgba(0,0,0,.1)}
.btn-ghost:hover{background:white;color:var(--ink)}
.btn-light{background:white;color:var(--ink)}
.btn-dark{background:var(--ink);color:white}
.btn-outline{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-outline:hover{background:var(--ink);color:white}
.btn-block{width:100%}
.text-link{font-weight:700;color:var(--forest-2);border-bottom:1px solid currentColor;padding-bottom:3px}

.site-header{
    position:absolute;
    top:0;left:0;right:0;
    z-index:20;
    color:white;
    border-bottom:1px solid rgba(255,255,255,.18);
}
.header-inner{
    height:92px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}
.brand{display:flex;align-items:center;gap:13px}
.brand-mark{
    width:48px;height:48px;
    display:grid;place-items:center;
    border:1px solid rgba(255,255,255,.65);
    font-family:var(--serif);
    font-size:1.45rem;
    font-weight:700;
}
.brand-copy{display:flex;flex-direction:column;line-height:1.15}
.brand-copy strong{font-family:var(--serif);font-size:1.45rem}
.brand-copy small{font-size:.65rem;letter-spacing:.08em;opacity:.85}
.main-nav{display:flex;align-items:center;gap:25px}
.main-nav a{font-size:.74rem;text-transform:uppercase;letter-spacing:.09em;font-weight:600}
.main-nav a:hover,.main-nav a.active{color:var(--gold-light)}
.cart-link{padding:10px 13px;border:1px solid rgba(255,255,255,.35)}
.cart-badge{
    display:inline-grid;place-items:center;
    min-width:20px;height:20px;
    margin-left:5px;padding:0 5px;
    border-radius:50%;
    background:var(--gold);color:white;font-size:.66rem;
}
.menu-toggle{display:none;background:none;border:0;color:white;font-size:1.8rem}

.hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    color:white;
    overflow:hidden;
}
.hero-image{
    position:absolute;inset:0;
    background:
      url("https://images.unsplash.com/photo-1593539651148-13fb61a49325?auto=format&fit=crop&w=2000&q=88")
      center 58%/cover no-repeat;
    transform:scale(1.02);
}
.hero-shade{
    position:absolute;inset:0;
    background:linear-gradient(90deg, rgba(13,20,15,.83) 0%, rgba(13,20,15,.48) 48%, rgba(13,20,15,.18) 100%),
               linear-gradient(0deg, rgba(10,12,10,.4), transparent 45%);
}
.hero-content{position:relative;z-index:2;padding-top:115px}
.hero-content h1{max-width:900px;margin-bottom:25px}
.hero-lead{max-width:690px;font-size:1.12rem;color:rgba(255,255,255,.9)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.scroll-hint{
    position:absolute;z-index:2;
    left:50%;bottom:28px;transform:translateX(-50%);
    font-size:.68rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(255,255,255,.8)
}

.split{
    display:grid;
    grid-template-columns:1.08fr .92fr;
    gap:80px;
    align-items:center;
}
.split.reverse{grid-template-columns:.92fr 1.08fr}
.copy-block{max-width:520px}
.copy-block p{color:#555b53}
.copy-block .lead{color:#30352f}
.media-card{box-shadow:var(--shadow);overflow:hidden}
.media-card.landscape{height:610px}
.media-card.tall{height:650px}
.media-card img{height:100%;object-fit:cover}
.feature-dark{background:var(--forest);color:white}
.light-copy p{color:rgba(255,255,255,.73)}
.light-copy .lead{color:rgba(255,255,255,.93)}
.light-copy .btn{margin-top:20px}

.section-heading{margin-bottom:42px;max-width:720px}
.section-heading.centered{text-align:center;margin-left:auto;margin-right:auto}
.section-heading p{color:var(--muted)}
.category-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    grid-auto-rows:330px;
    gap:16px;
}
.category-card{position:relative;overflow:hidden}
.category-card.featured-category{grid-row:span 2}
.category-card img{
    height:100%;object-fit:cover;
    transition:transform .55s ease;
}
.category-card:hover img{transform:scale(1.055)}
.category-overlay{
    position:absolute;inset:0;
    background:linear-gradient(0deg,rgba(8,12,9,.76),rgba(8,12,9,.08) 68%);
}
.category-title{
    position:absolute;left:26px;right:26px;bottom:24px;
    color:white;font-family:var(--serif);font-size:2.15rem;font-weight:600;line-height:.95;
}
.category-title small{
    display:block;margin-bottom:8px;
    font-family:var(--sans);font-size:.64rem;text-transform:uppercase;letter-spacing:.18em;color:#e7d4ad;
}

.story-banner{
    position:relative;
    min-height:640px;
    display:flex;
    align-items:center;
    color:white;
}
.story-bg{
    position:absolute;inset:0;
    background:url("https://images.unsplash.com/photo-1636544893297-c7b13c3d6978?auto=format&fit=crop&w=1800&q=88") center/cover no-repeat;
}
.story-shade{position:absolute;inset:0;background:rgba(18,26,20,.64)}
.story-content{
    position:relative;z-index:2;
    max-width:820px;
    text-align:center;
}
.story-content h2{font-size:clamp(3rem,5.5vw,5.4rem)}
.story-content p{font-size:1.08rem;color:rgba(255,255,255,.86);margin:0 auto 30px;max-width:700px}

.featured-products{background:#f3eee4}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.product-card{background:white;border:1px solid #e1dbcf;transition:.25s ease}
.product-card:hover{transform:translateY(-5px);box-shadow:0 18px 45px rgba(30,32,27,.1)}
.product-image{height:270px;overflow:hidden;background:#eee}
.product-image img{height:100%;object-fit:cover}
.product-body{padding:24px}
.product-kicker{
    margin:0 0 5px;
    color:var(--gold);text-transform:uppercase;letter-spacing:.16em;font-size:.65rem;font-weight:700
}
.product-body h3{font-family:var(--serif);font-size:1.65rem;margin-bottom:10px}
.price{font-weight:700;margin:0 0 18px}
.center-action{text-align:center;margin-top:38px}

.benefits{background:white;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.benefits-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.benefits-grid div{padding:34px 28px;border-right:1px solid var(--line)}
.benefits-grid div:last-child{border-right:0}
.benefits strong{display:block;font-family:var(--serif);font-size:1.35rem}
.benefits span{display:block;font-size:.77rem;color:var(--muted)}

.final-cta{background:#151914;color:white;padding:70px 0}
.final-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.final-cta h2{margin:0;font-size:clamp(2.6rem,4vw,4.1rem)}

.site-footer{background:#0f120f;color:#d9ddd6}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:55px;padding:72px 0}
.site-footer h3{font-family:var(--serif);font-size:2rem;color:white;margin-bottom:10px}
.site-footer h4{color:white;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;margin-bottom:18px}
.site-footer a,.site-footer p{display:block;color:#9fa79f;font-size:.82rem;margin:8px 0}
.site-footer a:hover{color:white}
.footer-link{display:inline-block!important;color:var(--gold-light)!important}
.italy-strip{display:flex!important;width:72px;height:4px;margin-top:24px!important}
.italy-strip span{flex:1}
.italy-strip span:nth-child(1){background:#198c4a}
.italy-strip span:nth-child(2){background:white}
.italy-strip span:nth-child(3){background:#c93b39}
.footer-bottom{border-top:1px solid #252925;padding:18px 0;color:#7c847c;font-size:.72rem}

.cookie-banner{
    position:fixed;z-index:9999;
    left:18px;right:18px;bottom:18px;
    max-width:650px;margin:auto;
    background:#111611;color:white;
    padding:15px 18px;
    box-shadow:0 10px 35px rgba(0,0,0,.25);
    display:flex;align-items:center;justify-content:space-between;gap:15px;
    font-size:.78rem;
}
.cookie-banner button{
    background:var(--gold);color:white;border:0;padding:10px 18px;cursor:pointer
}

@media (max-width:980px){
    .menu-toggle{display:block}
    .main-nav{
        display:none;position:absolute;top:92px;left:0;right:0;
        background:#172219;padding:22px 20px;
        flex-direction:column;align-items:flex-start
    }
    .menu-open .main-nav{display:flex}
    .split,.split.reverse{grid-template-columns:1fr;gap:45px}
    .copy-block{max-width:none}
    .media-card.landscape,.media-card.tall{height:520px}
    .category-grid{grid-template-columns:repeat(2,1fr)}
    .featured-category{grid-row:span 1!important}
    .product-grid{grid-template-columns:repeat(2,1fr)}
    .benefits-grid{grid-template-columns:repeat(2,1fr)}
    .benefits-grid div:nth-child(2){border-right:0}
    .footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
    .container{width:min(100% - 28px,1180px)}
    .section{padding:72px 0}
    .header-inner{height:78px}
    .main-nav{top:78px}
    .brand-copy small{display:none}
    .brand-mark{width:40px;height:40px}
    h1{font-size:3.55rem}
    .hero{min-height:90vh}
    .hero-content{padding-top:90px}
    .hero-actions .btn{width:100%}
    .media-card.landscape,.media-card.tall{height:390px}
    .category-grid{grid-template-columns:1fr;grid-auto-rows:300px}
    .product-grid{grid-template-columns:1fr}
    .product-image{height:330px}
    .benefits-grid{grid-template-columns:1fr}
    .benefits-grid div{border-right:0;border-bottom:1px solid var(--line)}
    .benefits-grid div:last-child{border-bottom:0}
    .final-cta-inner{align-items:flex-start;flex-direction:column}
    .footer-grid{grid-template-columns:1fr;gap:30px}
    .cookie-banner{flex-direction:column;align-items:stretch}
}


/* V2 - fascia fotografica Abruzzo */
.territory-strip{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    min-height:420px;
    background:#eee8dc;
}
.territory-photo{overflow:hidden;min-height:420px}
.territory-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.territory-photo:hover img{transform:scale(1.035)}
.territory-note{
    display:flex;flex-direction:column;justify-content:center;
    padding:55px clamp(28px,4vw,70px);
    background:#efe8da;
}
.territory-note h3{
    font-family:var(--serif);font-size:clamp(2.3rem,3vw,3.6rem);
    line-height:1;margin-bottom:18px;color:var(--forest)
}
.territory-note p:last-child{color:#5a6058}
@media (max-width:980px){
    .territory-strip{grid-template-columns:1fr 1fr}
    .territory-note{grid-column:1/-1}
}
@media (max-width:640px){
    .territory-strip{grid-template-columns:1fr}
    .territory-note{grid-column:auto}
    .territory-photo{min-height:300px}
}


/* Desideri d'Abruzzo — marchio D’A quadrato uniforme (20/10/2026).
   Limitato alla testata: non modifica badge del carrello o altre icone. */
.site-header .brand-mark,
.site-header .brand-emblem,
.site-header .brand-icon,
.site-header .brand-badge,
.site-header .brand-monogram {
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    border-radius:0 !important;
    border:1px solid #b9904e !important;
    display:grid !important;
    place-items:center !important;
    flex-shrink:0;
}
@media (max-width:640px) {
    .site-header .brand-mark,
    .site-header .brand-emblem,
    .site-header .brand-icon,
    .site-header .brand-badge,
    .site-header .brand-monogram {
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
    }
}
