/* =========================================================
   La Cornice è Arte — Stylesheet v2 (modern refresh)
   Palette: gold · cream · deep-brown
   ========================================================= */

:root{
    /* Palette museale · toni terra + oro caldo + verde bosco accent */
    --gold:        #b08d5a;
    --gold-dark:   #8b6a3a;
    --gold-light:  #d9b979;
    --gold-soft:   #ecd7ac;
    --forest:      #2b3a2e;   /* nuovo accent verde bosco */
    --forest-2:    #3d5140;
    --cream:       #f8f2e6;
    --cream-2:     #f0e6d1;
    --beige:       #e4d5b3;
    --ink:         #1b140d;
    --brown:       #2b1f13;
    --brown-2:     #1e150c;
    --brown-3:     #3d2c1c;
    --text:        #2a201a;
    --text-muted:  #6b5c4c;
    --text-soft:   #8a7864;
    --white:       #ffffff;
    --line:        rgba(139,106,58,.18);
    --line-strong: rgba(139,106,58,.35);

    --shadow-sm:   0 3px 12px rgba(43,31,19,.07);
    --shadow-md:   0 14px 40px rgba(43,31,19,.13);
    --shadow-lg:   0 28px 72px rgba(43,31,19,.22);
    --shadow-xl:   0 40px 100px rgba(43,31,19,.28);

    --radius:      6px;
    --radius-lg:   12px;
    --radius-round:100px;

    --container:   1280px;
    --container-narrow: 1080px;
    --serif:       'Fraunces', 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
    --serif-2:     'Cormorant Garamond', 'Playfair Display', Georgia, serif;
    --sans:        'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --ease-out:    cubic-bezier(.16,1,.3,1);
    --ease-in-out: cubic-bezier(.65,0,.35,1);
    --ease-swift:  cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
    margin:0;
    font-family:var(--sans);
    color:var(--text);
    background:var(--cream);
    line-height:1.65;
    font-size:16px;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
}
::selection{ background:var(--gold); color:var(--white); }

img{ max-width:100%; display:block; height:auto; }
a{ color:var(--gold-dark); text-decoration:none; transition:color .25s var(--ease-out); }
a:hover{ color:var(--brown); }

h1,h2,h3,h4{
    font-family:var(--serif);
    font-weight:400;
    color:var(--brown);
    line-height:1.08;
    margin:0 0 .5em;
    letter-spacing:-.015em;
    font-optical-sizing:auto;
    font-variation-settings:"opsz" 96, "SOFT" 30;
}
h1{ font-size:clamp(2.6rem, 5.4vw, 5.2rem); font-weight:300; letter-spacing:-.025em; }
h2{ font-size:clamp(2rem, 3.8vw, 3.4rem); font-weight:400; letter-spacing:-.02em; }
h3{ font-size:clamp(1.35rem, 2vw, 1.75rem); font-weight:500; }
h1 em, h2 em, h3 em{
    font-style:italic;
    font-family:var(--serif-2);
    font-weight:400;
    color:var(--gold-dark);
}
p{ margin:0 0 1em; }

button{ font-family:inherit; }

.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 28px; }
.container-narrow{ width:100%; max-width:var(--container-narrow); margin:0 auto; padding:0 28px; }

/* Body left with plain cream background — no fixed patterns to avoid compositor issues */

/* Utility */
.eyebrow{
    display:inline-flex;
    align-items:center;
    gap:14px;
    font-family:var(--sans);
    font-size:.72rem;
    font-weight:600;
    letter-spacing:.32em;
    text-transform:uppercase;
    color:var(--gold-dark);
    margin-bottom:1.4rem;
}
.eyebrow::before{
    content:"";
    width:38px; height:1px;
    background:var(--gold);
    display:inline-block;
    flex-shrink:0;
}
.eyebrow-num{
    font-family:var(--serif);
    font-size:.9rem;
    font-weight:500;
    font-style:italic;
    color:var(--gold-dark);
    letter-spacing:.05em;
    margin-right:4px;
    text-transform:none;
}
.center .eyebrow{ margin-left:auto; margin-right:auto; }
.center .eyebrow::before,
.center .eyebrow::after{
    content:"";
    width:38px; height:1px;
    background:var(--gold);
    display:inline-block;
    flex-shrink:0;
}
.center .eyebrow::after{ margin-left:auto; }

/* Divider ornament */
.ornament{
    display:flex;
    align-items:center;
    justify-content:center;
    margin:1rem auto 2rem;
    gap:14px;
    color:var(--gold);
}
.ornament::before,.ornament::after{
    content:""; flex:1; height:1px; max-width:80px;
    background:linear-gradient(90deg, transparent, var(--gold), transparent);
}
.ornament svg{ width:22px; height:22px; }

/* =========================================================
   Buttons
   ========================================================= */
.btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:15px 30px;
    font-family:var(--sans);
    font-weight:600;
    font-size:.82rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    border-radius:2px;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .3s var(--ease-out), background .3s var(--ease-out), color .3s var(--ease-out), border-color .3s var(--ease-out), box-shadow .3s var(--ease-out);
    text-decoration:none;
    position:relative;
    overflow:hidden;
    white-space:nowrap;
    isolation:isolate;
}
.btn svg{ width:16px; height:16px; transition:transform .3s var(--ease-out); }
.btn:hover svg{ transform:translateX(4px); }

.btn-primary,
.btn-primary:link,
.btn-primary:visited{
    background:var(--brown);
    color:var(--cream) !important;
    border-color:var(--brown);
}
.btn-primary:hover{
    background:var(--gold-dark);
    border-color:var(--gold-dark);
    color:var(--white) !important;
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
}
.btn-outline,
.btn-outline:link,
.btn-outline:visited{
    background:transparent;
    color:var(--brown) !important;
    border-color:var(--brown);
}
.btn-outline:hover{
    background:var(--brown);
    color:var(--cream) !important;
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
}
.btn-gold,
.btn-gold:link,
.btn-gold:visited{
    background:var(--gold-dark);
    color:var(--white) !important;
    border-color:var(--gold-dark);
}
.btn-gold:hover{
    background:var(--brown);
    border-color:var(--brown);
    color:var(--white) !important;
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
}

/* =========================================================
   Top bar
   ========================================================= */
.top-bar{
    background:var(--brown-2);
    background-image:linear-gradient(180deg, rgba(217,185,121,.04), transparent),
                     linear-gradient(90deg, rgba(217,185,121,.02) 0%, transparent 50%, rgba(217,185,121,.02) 100%);
    color:#dcc9a6;
    font-size:.8rem;
    padding:11px 0;
    letter-spacing:.06em;
    position:relative;
    z-index:5;
    border-bottom:1px solid rgba(217,185,121,.08);
}
.top-bar .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
}
.top-bar a{ color:#dcc9a6; }
.top-bar a:hover{ color:var(--gold-light); }
.top-bar .info-list{ display:flex; gap:28px; flex-wrap:wrap; }
.top-bar .info-list span{ display:inline-flex; align-items:center; gap:8px; }
.top-bar svg{ opacity:.7; color:var(--gold-light); }

/* =========================================================
   Header
   ========================================================= */
.site-header{
    background:var(--cream);
    border-bottom:1px solid var(--line);
    position:sticky;
    top:0;
    z-index:100;
    transition:box-shadow .3s var(--ease-out), padding .3s var(--ease-out);
}
.site-header.scrolled{
    box-shadow:0 4px 24px rgba(43,31,19,.08);
}

.nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 0;
    gap:24px;
    transition:padding .3s var(--ease-out);
}
.site-header.scrolled .nav{ padding:12px 0; }
.brand{
    display:flex;
    align-items:center;
    gap:16px;
    text-decoration:none;
    color:inherit;
    padding:4px 0;
}
.brand img{
    height:64px;
    width:auto;
    border-radius:4px;
    transition:transform .5s var(--ease-out), height .3s var(--ease-out);
    box-shadow:0 4px 14px rgba(43,31,19,.08);
}
.site-header.scrolled .brand img{ height:56px; }
.brand:hover img{ transform:rotate(-1deg) scale(1.03); }
.brand-text{ display:flex; flex-direction:column; line-height:1.05; }
.brand-text .brand-name{
    font-family:var(--serif);
    font-size:1.45rem;
    color:var(--brown);
    letter-spacing:.005em;
    font-weight:400;
    font-style:italic;
}
.brand-text .brand-sub{
    font-size:.68rem;
    letter-spacing:.4em;
    text-transform:uppercase;
    color:var(--gold-dark);
    margin-top:5px;
    font-weight:600;
    font-family:var(--sans);
}

.nav-links{
    display:flex;
    align-items:center;
    gap:4px;
    list-style:none;
    margin:0;
    padding:0;
}
.nav-links > li > a{
    display:inline-block;
    padding:10px 16px;
    color:var(--brown);
    font-weight:500;
    font-size:.92rem;
    letter-spacing:.04em;
    position:relative;
    transition:color .25s var(--ease-out);
}
.nav-links > li > a::after{
    content:"";
    position:absolute;
    left:16px; right:16px;
    bottom:4px;
    height:1px;
    background:var(--gold);
    transform:scaleX(0);
    transition:transform .35s var(--ease-out);
    transform-origin:right;
}
.nav-links > li > a:hover{ color:var(--gold-dark); }
.nav-links > li > a:hover::after,
.nav-links > li > a.active::after{
    transform:scaleX(1);
    transform-origin:left;
}
.nav-links > li > a.active{ color:var(--gold-dark); }
.nav-cta{ margin-left:12px; }
/* Ensure CTA in nav renders correctly regardless of nav-link rules */
.nav-links .nav-cta > a.btn{ padding:14px 26px; }
.nav-links .nav-cta > a.btn::after{ display:none; }

.nav-toggle{
    display:none;
    background:transparent;
    border:1px solid var(--brown);
    padding:9px 12px;
    cursor:pointer;
    border-radius:4px;
    transition:background .25s;
}
.nav-toggle:hover{ background:rgba(47,35,26,.06); }
.nav-toggle span{
    display:block;
    width:22px;
    height:2px;
    background:var(--brown);
    margin:5px 0;
    transition:transform .3s, opacity .3s;
    border-radius:2px;
}
.nav-toggle.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2){ opacity:0; }
.nav-toggle.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.nav-backdrop{
    position:fixed;
    inset:0;
    background:rgba(32,24,18,.55);
    opacity:0;
    visibility:hidden;
    transition:opacity .3s var(--ease-out), visibility .3s;
    z-index:99;
    backdrop-filter:blur(4px);
}
.nav-backdrop.open{ opacity:1; visibility:visible; }

/* =========================================================
   Hero
   ========================================================= */
.hero{
    position:relative;
    min-height:90vh;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:
        radial-gradient(ellipse at 15% 20%, rgba(217,185,121,.22), transparent 55%),
        radial-gradient(ellipse at 90% 90%, rgba(176,141,90,.14), transparent 55%),
        linear-gradient(175deg, var(--cream) 0%, var(--cream-2) 100%);
    padding:70px 0 110px;
}
.hero::before{
    content:"";
    position:absolute;
    top:-10%; left:-5%;
    width:45%; height:65%;
    background:radial-gradient(circle, rgba(217,185,121,.16), transparent 65%);
    pointer-events:none;
    filter:blur(40px);
}
.hero::after{
    content:"";
    position:absolute;
    bottom:0; left:0; right:0;
    height:1px;
    background:linear-gradient(90deg, transparent 5%, rgba(176,141,90,.4) 50%, transparent 95%);
    pointer-events:none;
}
/* Signature / monogram nella hero */
.hero .monogram{
    position:absolute;
    top:32%;
    left:6%;
    font-family:var(--serif);
    font-style:italic;
    font-weight:300;
    font-size:clamp(9rem, 20vw, 22rem);
    color:rgba(139,106,58,.06);
    line-height:1;
    pointer-events:none;
    z-index:1;
    user-select:none;
    letter-spacing:-.05em;
}
.hero-inner{
    display:grid;
    grid-template-columns:1.05fr 1fr;
    gap:60px;
    align-items:center;
    position:relative;
    z-index:2;
}
.hero-content h1{
    margin-bottom:1.2rem;
}
.hero-content h1 em{
    font-style:italic;
    color:var(--gold-dark);
    display:block;
    font-weight:400;
}
.hero-content .lead{
    font-size:1.14rem;
    max-width:540px;
    color:var(--text-muted);
    margin-bottom:2.2rem;
    line-height:1.7;
}
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:3rem; }

.hero-meta{
    display:grid;
    grid-template-columns:repeat(3, auto);
    gap:44px;
    padding-top:2rem;
    border-top:1px solid var(--line);
    justify-content:start;
}
.hero-meta .stat{ position:relative; }
.hero-meta .stat .value{
    display:block;
    font-family:var(--serif);
    font-size:clamp(1.8rem, 3vw, 2.4rem);
    color:var(--brown);
    line-height:1;
    font-weight:500;
    letter-spacing:-.01em;
}
.hero-meta .stat .value .suffix{ color:var(--gold-dark); }
.hero-meta .stat .label{
    font-size:.72rem;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:var(--text-muted);
    margin-top:8px;
    display:block;
    font-weight:600;
}

.hero-visual{
    position:relative;
    height:600px;
    width:100%;
}
.hero-visual .frame-a,
.hero-visual .frame-b{
    position:absolute;
    background:var(--white);
    padding:14px;
    box-shadow:var(--shadow-lg);
    border:1px solid rgba(184,147,90,.35);
    transition:transform .8s var(--ease-out);
}
.hero-visual .frame-a{
    width:66%;
    height:80%;
    top:0; left:0;
    transform:rotate(-2.5deg);
    z-index:1;
}
.hero-visual .frame-b{
    width:56%;
    height:60%;
    bottom:0; right:0;
    transform:rotate(3deg);
    z-index:2;
}
.hero-visual:hover .frame-a{ transform:rotate(-3.5deg) translateY(-6px); }
.hero-visual:hover .frame-b{ transform:rotate(4deg) translateY(-6px); }
.hero-visual .frame-a img,
.hero-visual .frame-b img{ width:100%; height:100%; object-fit:cover; }

/* Floating badge accent */
.hero-badge{
    position:absolute;
    top:-6px; right:8%;
    background:var(--brown);
    color:var(--cream);
    padding:12px 20px;
    border-radius:100px;
    font-size:.72rem;
    letter-spacing:.24em;
    text-transform:uppercase;
    font-weight:600;
    z-index:3;
    box-shadow:var(--shadow-md);
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.hero-badge::before{
    content:"";
    width:8px; height:8px;
    background:var(--gold-light);
    border-radius:50%;
    box-shadow:0 0 0 4px rgba(217,189,133,.3);
    animation:pulse 2.4s var(--ease-in-out) infinite;
}
@keyframes pulse{
    0%,100%{ box-shadow:0 0 0 4px rgba(217,189,133,.3); }
    50%    { box-shadow:0 0 0 8px rgba(217,189,133,.1); }
}

.scroll-hint{
    position:absolute;
    bottom:30px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    color:var(--text-muted);
    font-size:.7rem;
    letter-spacing:.24em;
    text-transform:uppercase;
    z-index:2;
    font-weight:600;
}
.scroll-hint .line{
    width:1px;
    height:36px;
    background:linear-gradient(to bottom, var(--gold), transparent);
    animation:scroll-hint 2s var(--ease-in-out) infinite;
    transform-origin:top;
}
@keyframes scroll-hint{
    0%,100%{ transform:scaleY(1); opacity:.7; }
    50%    { transform:scaleY(.4); opacity:1; }
}

/* =========================================================
   Sections
   ========================================================= */
section{ padding:120px 0; position:relative; }
.section-cream{ background:var(--cream); }
.section-beige{ background:var(--cream-2); }
.section-cream + .section-cream,
.section-beige + .section-beige{ padding-top:0; }

/* Sezione numerata stile museo */
.section-roman{
    position:absolute;
    top:60px;
    left:50%;
    transform:translateX(-50%);
    font-family:var(--serif);
    font-style:italic;
    font-weight:300;
    font-size:.9rem;
    letter-spacing:.4em;
    color:var(--gold-dark);
    text-transform:uppercase;
    z-index:2;
}
.section-roman::before,
.section-roman::after{
    content:"";
    display:inline-block;
    width:24px;
    height:1px;
    background:var(--gold);
    vertical-align:middle;
    margin:0 12px;
}
.section-dark{
    background:
        radial-gradient(ellipse at 20% 30%, rgba(184,147,90,.22), transparent 55%),
        radial-gradient(ellipse at 80% 70%, rgba(217,189,133,.14), transparent 55%),
        linear-gradient(135deg, var(--brown) 0%, var(--brown-2) 100%);
    color:#e8dcc4;
    position:relative;
    overflow:hidden;
}
.section-dark::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(217,189,133,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(217,189,133,.04) 1px, transparent 1px);
    background-size:48px 48px;
    background-position:center;
    mask-image:radial-gradient(ellipse at center, black 40%, transparent 75%);
    -webkit-mask-image:radial-gradient(ellipse at center, black 40%, transparent 75%);
    pointer-events:none;
    opacity:.6;
}
.section-dark::after{
    content:"";
    position:absolute;
    top:0; left:0; right:0;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(217,189,133,.5), transparent);
}
.section-dark h1, .section-dark h2, .section-dark h3{ color:var(--cream); }
.section-dark .eyebrow{ color:var(--gold-light); }
.section-dark .eyebrow::before{ background:var(--gold-light); }
.section-dark p{ color:#d5c6b4; }
.section-dark .container{ position:relative; z-index:1; }

.section-head{
    max-width:820px;
    margin-bottom:60px;
}
.section-head.center{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}
.section-head p{
    color:var(--text-muted);
    font-size:1.05rem;
    line-height:1.75;
}

/* =========================================================
   Featured categories strip
   ========================================================= */
.categories{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:18px;
}
.category-card{
    position:relative;
    aspect-ratio:3/4;
    overflow:hidden;
    border-radius:2px;
    background:var(--brown);
    cursor:pointer;
    display:block;
    box-shadow:var(--shadow-sm);
    transition:transform .6s var(--ease-out), box-shadow .6s var(--ease-out);
}
.category-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(43,31,19,.15) 0%, transparent 35%, rgba(27,20,13,.5) 65%, rgba(27,20,13,.92) 100%);
    transition:background .6s var(--ease-out);
    z-index:1;
}
.category-card::before{
    content:"";
    position:absolute;
    inset:10px;
    border:1px solid rgba(217,185,121,.35);
    z-index:2;
    opacity:0;
    transform:scale(1.02);
    transition:opacity .5s var(--ease-out), transform .5s var(--ease-out);
    pointer-events:none;
}
.category-card:hover{
    transform:translateY(-8px);
    box-shadow:var(--shadow-xl);
}
.category-card:hover::after{
    background:linear-gradient(180deg, rgba(43,31,19,.2) 0%, rgba(27,20,13,.4) 40%, rgba(27,20,13,.95) 100%);
}
.category-card:hover::before{
    opacity:1;
    transform:scale(1);
}
.category-card img{
    width:100%; height:100%;
    object-fit:cover;
    transition:transform 1s var(--ease-out);
}
.category-card:hover img{ transform:scale(1.12); }
.category-card .cat-body{
    position:absolute;
    left:28px; right:28px;
    bottom:26px;
    z-index:3;
    color:var(--cream);
    transform:translateY(8px);
    transition:transform .6s var(--ease-out);
}
.category-card:hover .cat-body{ transform:translateY(0); }
.category-card h3{
    color:var(--cream);
    font-size:1.55rem;
    font-weight:400;
    margin-bottom:8px;
    letter-spacing:-.005em;
}
.category-card .cat-count{
    font-size:.68rem;
    letter-spacing:.26em;
    text-transform:uppercase;
    color:var(--gold-light);
    font-weight:600;
    display:inline-flex;
    align-items:center;
    gap:10px;
}
.category-card .cat-count::before{
    content:"";
    width:20px; height:1px;
    background:var(--gold-light);
    display:inline-block;
}
.category-card .cat-arrow{
    position:absolute;
    top:22px; right:22px;
    width:44px; height:44px;
    border-radius:50%;
    background:rgba(248,242,230,.12);
    color:var(--cream);
    display:flex; align-items:center; justify-content:center;
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    border:1px solid rgba(248,242,230,.2);
    z-index:3;
    opacity:0;
    transform:translateY(-6px);
    transition:opacity .5s var(--ease-out), transform .5s var(--ease-out), background .3s;
}
.category-card:hover .cat-arrow{ opacity:1; transform:translateY(0); }
.category-card .cat-arrow:hover{ background:var(--gold-dark); }
.category-card .cat-arrow svg{ width:16px; height:16px; }

/* =========================================================
   Feature cards
   ========================================================= */
.features{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:26px;
}
.feature-card{
    background:var(--white);
    padding:50px 40px 44px;
    border:1px solid var(--line);
    border-radius:2px;
    transition:transform .5s var(--ease-out), box-shadow .5s var(--ease-out), border-color .5s var(--ease-out);
    position:relative;
    overflow:hidden;
}
.feature-card::before{
    content:"";
    position:absolute;
    top:0; left:0; right:0;
    height:2px;
    background:linear-gradient(90deg, var(--gold-dark), var(--gold-light));
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .6s var(--ease-out);
}
.feature-card::after{
    content:"";
    position:absolute;
    inset:12px;
    border:1px solid transparent;
    pointer-events:none;
    transition:border-color .5s var(--ease-out);
}
.feature-card:hover{
    transform:translateY(-8px);
    box-shadow:var(--shadow-md);
    border-color:transparent;
}
.feature-card:hover::before{ transform:scaleX(1); }
.feature-card:hover::after{ border-color:rgba(217,185,121,.35); }
.feature-num{
    position:absolute;
    top:28px; right:32px;
    font-family:var(--serif);
    font-size:.98rem;
    font-style:italic;
    color:var(--gold-dark);
    letter-spacing:.15em;
    opacity:.55;
    font-weight:400;
}
.feature-icon{
    width:68px;
    height:68px;
    border-radius:50%;
    background:linear-gradient(135deg, var(--cream-2), var(--beige));
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-bottom:28px;
    color:var(--gold-dark);
    border:1px solid var(--line);
    transition:transform .5s var(--ease-out), background .5s var(--ease-out);
    position:relative;
}
.feature-icon::before{
    content:"";
    position:absolute;
    inset:-6px;
    border:1px solid var(--line);
    border-radius:50%;
    opacity:0;
    transition:opacity .5s var(--ease-out);
}
.feature-card:hover .feature-icon{ transform:rotate(-6deg) scale(1.05); }
.feature-card:hover .feature-icon::before{ opacity:1; }
.feature-icon svg{ width:28px; height:28px; }
.feature-card h3{ margin-bottom:.7em; }
.feature-card p{ color:var(--text-muted); margin-bottom:1.4em; font-size:.96rem; }
.feature-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:.78rem;
    font-weight:600;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--brown);
    padding-bottom:4px;
    border-bottom:1px solid transparent;
    transition:border-color .3s var(--ease-out), color .3s var(--ease-out);
}
.feature-link:hover{ color:var(--gold-dark); border-color:var(--gold); }
.feature-link svg{ width:14px; height:14px; transition:transform .3s var(--ease-out); }
.feature-link:hover svg{ transform:translateX(4px); }

/* =========================================================
   Split section
   ========================================================= */
.split{
    display:grid;
    grid-template-columns:1fr 1.05fr;
    gap:80px;
    align-items:center;
}
.split.reverse{ grid-template-columns:1.05fr 1fr; }
.split.reverse .split-media{ order:2; }
.split-content h2{ margin-bottom:1.2rem; }
.split-content > p{ color:var(--text-muted); font-size:1.02rem; line-height:1.75; }
.split-content strong{ color:var(--brown); font-weight:600; }

.split-media{ position:relative; }
.split-media .img-main{
    position:relative;
    overflow:hidden;
    box-shadow:var(--shadow-lg);
    border:12px solid var(--white);
    outline:1px solid var(--gold);
    outline-offset:-4px;
    aspect-ratio:4/5;
    background:var(--white);
}
.split-media .img-main img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-out); }
.split-media:hover .img-main img{ transform:scale(1.04); }

.split-media .badge{
    position:absolute;
    bottom:-24px;
    right:-24px;
    background:var(--brown);
    color:var(--cream);
    padding:26px 32px;
    border-radius:var(--radius);
    text-align:center;
    box-shadow:var(--shadow-lg);
    border:1px solid var(--gold);
    z-index:2;
}
.split-media .badge .value{
    display:block;
    font-family:var(--serif);
    font-size:2.6rem;
    color:var(--gold-light);
    line-height:1;
    font-weight:500;
}
.split-media .badge .label{
    font-size:.68rem;
    letter-spacing:.24em;
    text-transform:uppercase;
    margin-top:8px;
    color:#d5c6b4;
    font-weight:600;
}

/* Sticker accent behind image */
.split-media .accent{
    position:absolute;
    top:-24px; left:-24px;
    width:calc(100% - 30px);
    height:calc(100% - 30px);
    border:1px solid var(--gold);
    border-radius:var(--radius);
    z-index:-1;
    pointer-events:none;
}

.check-list{
    list-style:none;
    padding:0;
    margin:1.5rem 0 2rem;
    display:grid;
    gap:14px;
}
.check-list li{
    display:flex;
    align-items:flex-start;
    gap:14px;
    color:var(--text);
    font-size:.98rem;
}
.check-list li svg{
    flex-shrink:0;
    width:22px; height:22px;
    color:var(--gold-dark);
    margin-top:3px;
    background:var(--cream-2);
    padding:3px;
    border-radius:50%;
    border:1px solid var(--line);
}

/* =========================================================
   Gallery
   ========================================================= */
.gallery-filters{
    display:flex;
    justify-content:center;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:50px;
}
.gallery-filters button{
    background:transparent;
    border:1px solid var(--line);
    color:var(--brown);
    padding:11px 22px;
    font-family:var(--sans);
    font-size:.78rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    cursor:pointer;
    border-radius:100px;
    transition:all .3s var(--ease-out);
    font-weight:600;
}
.gallery-filters button:hover{
    border-color:var(--gold);
    color:var(--gold-dark);
    transform:translateY(-1px);
}
.gallery-filters button.active{
    background:var(--brown);
    color:var(--cream);
    border-color:var(--brown);
    box-shadow:0 4px 14px rgba(47,35,26,.2);
}

.gallery-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
    gap:22px;
}
.gallery-item{
    position:relative;
    aspect-ratio:1/1;
    overflow:hidden;
    background:var(--white);
    padding:12px;
    border:1px solid var(--line);
    cursor:pointer;
    transition:transform .5s var(--ease-out), box-shadow .5s var(--ease-out), border-color .5s var(--ease-out);
    border-radius:2px;
}
.gallery-item::before{
    content:"";
    position:absolute;
    inset:12px;
    border:1px solid transparent;
    z-index:2;
    pointer-events:none;
    transition:border-color .5s var(--ease-out);
}
.gallery-item::after{
    content:"";
    position:absolute;
    inset:12px;
    background:linear-gradient(180deg, transparent 40%, rgba(27,20,13,.6));
    opacity:0;
    transition:opacity .4s var(--ease-out);
    pointer-events:none;
    z-index:1;
}
.gallery-item:hover{
    transform:translateY(-6px);
    box-shadow:var(--shadow-md);
    border-color:var(--gold-light);
}
.gallery-item:hover::before{ border-color:rgba(217,185,121,.7); }
.gallery-item:hover::after{ opacity:1; }
.gallery-item img{
    width:100%; height:100%;
    object-fit:cover;
    transition:transform 1s var(--ease-out);
}
.gallery-item:hover img{ transform:scale(1.1); }
.gallery-item .zoom-icon{
    position:absolute;
    bottom:26px; right:26px;
    width:52px; height:52px;
    border-radius:50%;
    background:var(--gold-dark);
    color:var(--white);
    display:flex; align-items:center; justify-content:center;
    opacity:0;
    transform:translateY(12px) scale(.85);
    transition:opacity .4s var(--ease-out), transform .4s var(--ease-out);
    z-index:3;
    box-shadow:var(--shadow-md);
    border:1px solid rgba(248,242,230,.25);
}
.gallery-item:hover .zoom-icon{ opacity:1; transform:translateY(0) scale(1); }
.gallery-item:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.gallery-item .gallery-num{
    position:absolute;
    top:24px; left:24px;
    font-family:var(--serif);
    font-style:italic;
    color:var(--cream);
    font-size:.85rem;
    letter-spacing:.1em;
    z-index:3;
    opacity:0;
    transform:translateY(-6px);
    transition:opacity .4s var(--ease-out), transform .4s var(--ease-out);
    text-shadow:0 2px 8px rgba(0,0,0,.4);
}
.gallery-item:hover .gallery-num{ opacity:1; transform:translateY(0); }

/* Featured mixed gallery (variable heights) */
.gallery-featured{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:22px;
}
.gallery-featured .gallery-item:nth-child(1){ grid-row:span 2; aspect-ratio:1/2; }
.gallery-featured .gallery-item:nth-child(6){ grid-row:span 2; aspect-ratio:1/2; }
@media(max-width:900px){
    .gallery-featured{ grid-template-columns:repeat(2, 1fr); }
    .gallery-featured .gallery-item:nth-child(1),
    .gallery-featured .gallery-item:nth-child(6){ grid-row:auto; aspect-ratio:1/1; }
}

/* =========================================================
   Services list
   ========================================================= */
.services-list{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:26px;
}
.service-card{
    background:var(--white);
    padding:44px;
    border-radius:var(--radius-lg);
    border:1px solid var(--line);
    position:relative;
    transition:transform .4s var(--ease-out), box-shadow .4s var(--ease-out), border-color .4s var(--ease-out);
    overflow:hidden;
}
.service-card::before{
    content:"";
    position:absolute;
    inset:auto 0 0 0;
    height:3px;
    background:linear-gradient(90deg, var(--gold), var(--gold-light), var(--gold));
    transform:translateX(-101%);
    transition:transform .6s var(--ease-out);
}
.service-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-md);
    border-color:transparent;
}
.service-card:hover::before{ transform:translateX(0); }
.service-card .num{
    font-family:var(--serif);
    font-size:3.8rem;
    color:var(--gold);
    line-height:1;
    position:absolute;
    top:28px; right:36px;
    opacity:.35;
    font-weight:500;
}
.service-card h3{ margin-bottom:.9em; padding-right:60px; }
.service-card .tag{
    display:inline-block;
    font-size:.7rem;
    letter-spacing:.24em;
    text-transform:uppercase;
    color:var(--gold-dark);
    margin-bottom:14px;
    font-weight:600;
}
.service-card p{ color:var(--text-muted); margin-bottom:0; font-size:.95rem; line-height:1.75; }

/* =========================================================
   Highlight quote
   ========================================================= */
.highlight{
    text-align:center;
    max-width:860px;
    margin:0 auto;
}
.highlight blockquote{
    font-family:var(--serif);
    font-size:clamp(1.5rem, 2.8vw, 2.2rem);
    font-style:italic;
    color:var(--cream);
    line-height:1.45;
    margin:0 0 1.5rem;
    position:relative;
    padding:0 20px;
    font-weight:400;
}
.highlight blockquote::before,
.highlight blockquote::after{
    font-family:var(--serif);
    font-size:5rem;
    color:var(--gold-light);
    line-height:0;
    vertical-align:-.4em;
    opacity:.7;
}
.highlight blockquote::before{ content:"\201C"; margin-right:6px; }
.highlight blockquote::after{ content:"\201D"; margin-left:6px; }
.highlight .author{
    font-family:var(--serif);
    font-size:1.2rem;
    letter-spacing:.28em;
    text-transform:uppercase;
    color:var(--gold-light);
    margin-top:8px;
}
.highlight .author-role{
    font-size:.75rem;
    letter-spacing:.22em;
    color:#a89680;
    margin-top:4px;
    text-transform:uppercase;
    font-family:var(--sans);
    font-weight:600;
}

/* =========================================================
   CTA banner
   ========================================================= */
.cta-banner{
    background:
        radial-gradient(ellipse at 15% 30%, rgba(184,147,90,.22), transparent 45%),
        radial-gradient(ellipse at 85% 70%, rgba(217,189,133,.16), transparent 45%),
        linear-gradient(135deg, var(--brown) 0%, var(--brown-2) 100%);
    color:var(--cream);
    text-align:center;
    padding:90px 0;
    position:relative;
    overflow:hidden;
}
.cta-banner::before{
    content:"";
    position:absolute;
    top:0; left:0; right:0;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(217,189,133,.5), transparent);
}
.cta-banner::after{
    content:"";
    position:absolute;
    bottom:0; left:0; right:0;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(217,189,133,.3), transparent);
}
.cta-banner .container{ position:relative; z-index:1; }
.cta-banner h2{ color:var(--cream); margin-bottom:.6em; }
.cta-banner p{ color:#d5c6b4; max-width:640px; margin:0 auto 2rem; font-size:1.06rem; }
.cta-banner .eyebrow{ color:var(--gold-light); }
.cta-banner .eyebrow::before{ background:var(--gold-light); }

/* =========================================================
   Page hero (interior)
   ========================================================= */
.page-hero{
    background:
        radial-gradient(ellipse at 15% 40%, rgba(184,147,90,.25), transparent 50%),
        radial-gradient(ellipse at 85% 60%, rgba(217,189,133,.18), transparent 50%),
        linear-gradient(135deg, var(--brown) 0%, var(--brown-2) 100%);
    color:var(--cream);
    padding:100px 0 110px;
    text-align:center;
    position:relative;
    overflow:hidden;
}
.page-hero::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(217,189,133,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(217,189,133,.06) 1px, transparent 1px);
    background-size:48px 48px;
    mask-image:radial-gradient(ellipse at center, black 30%, transparent 75%);
    -webkit-mask-image:radial-gradient(ellipse at center, black 30%, transparent 75%);
    opacity:.7;
    pointer-events:none;
}
.page-hero::after{
    content:"";
    position:absolute;
    bottom:0; left:0; right:0;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(217,189,133,.35), transparent);
}
.page-hero .container{ position:relative; z-index:1; }
.page-hero h1{ color:var(--cream); margin-bottom:.5em; }
.page-hero > .container > p{ color:#d5c6b4; max-width:660px; margin:0 auto; font-size:1.1rem; line-height:1.7; }
.breadcrumbs{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-size:.75rem;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:var(--gold-light);
    margin-bottom:1.4rem;
    font-weight:600;
}
.breadcrumbs a{ color:var(--gold-light); }
.breadcrumbs a:hover{ color:var(--white); }
.breadcrumbs .sep{ color:rgba(217,189,133,.4); }

/* =========================================================
   Contact
   ========================================================= */
.contact-grid{
    display:grid;
    grid-template-columns:1.15fr 1fr;
    gap:60px;
    align-items:start;
}
.contact-info{
    background:linear-gradient(160deg, var(--brown) 0%, var(--brown-2) 100%);
    color:var(--cream);
    padding:56px 44px;
    border-radius:var(--radius-lg);
    position:relative;
    overflow:hidden;
}
.contact-info::before{
    content:"";
    position:absolute;
    top:-60px; right:-60px;
    width:200px; height:200px;
    background:radial-gradient(circle, rgba(217,189,133,.25), transparent 70%);
}
.contact-info::after{
    content:"";
    position:absolute;
    bottom:-80px; left:-80px;
    width:220px; height:220px;
    background:radial-gradient(circle, rgba(217,189,133,.15), transparent 70%);
}
.contact-info h3{ color:var(--cream); position:relative; }
.contact-info > p{ color:#d5c6b4; position:relative; }
.contact-info a{ color:var(--gold-light); }
.contact-info a:hover{ color:var(--white); }
.contact-info .info-row{
    display:flex;
    gap:18px;
    align-items:flex-start;
    padding:20px 0;
    border-bottom:1px solid rgba(217,189,133,.18);
    position:relative;
    z-index:1;
}
.contact-info .info-row:last-child{ border-bottom:none; }
.contact-info .info-row .icon{
    width:46px; height:46px;
    border-radius:50%;
    background:rgba(217,189,133,.15);
    color:var(--gold-light);
    flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    border:1px solid rgba(217,189,133,.25);
}
.contact-info .info-row .icon svg{ width:20px; height:20px; }
.contact-info .info-row .label{
    display:block;
    font-size:.72rem;
    letter-spacing:.24em;
    text-transform:uppercase;
    color:var(--gold-light);
    margin-bottom:6px;
    font-weight:600;
}
.contact-info .info-row .value{
    font-size:1rem;
    color:var(--cream);
    line-height:1.6;
}

.contact-form{
    background:var(--white);
    padding:52px 44px;
    border-radius:var(--radius-lg);
    border:1px solid var(--line);
    box-shadow:var(--shadow-sm);
}
.contact-form h3{ margin-bottom:.4em; }
.contact-form .form-lead{
    color:var(--text-muted);
    margin-bottom:2rem;
    font-size:.98rem;
}
.form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    margin-bottom:16px;
}
.form-group{ margin-bottom:16px; }
.form-group label{
    display:block;
    font-size:.74rem;
    font-weight:600;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--brown);
    margin-bottom:10px;
}
.form-group input,
.form-group select,
.form-group textarea{
    width:100%;
    padding:14px 16px;
    border:1px solid var(--line);
    background:var(--cream);
    font-family:var(--sans);
    font-size:.95rem;
    color:var(--text);
    border-radius:4px;
    transition:border-color .25s, background .25s, box-shadow .25s;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
    outline:none;
    border-color:var(--gold);
    background:var(--white);
    box-shadow:0 0 0 4px rgba(184,147,90,.12);
}
.form-group textarea{ resize:vertical; min-height:130px; }
.form-check{
    display:flex;
    gap:10px;
    align-items:flex-start;
    margin:1rem 0 1.5rem;
    font-size:.85rem;
    color:var(--text-muted);
}
.form-check input{ margin-top:4px; accent-color:var(--gold-dark); }

.map-embed{
    margin-top:60px;
    border-radius:var(--radius-lg);
    overflow:hidden;
    border:1px solid var(--line);
    box-shadow:var(--shadow-sm);
    background:var(--white);
}
.map-embed iframe{ display:block; width:100%; height:440px; border:0; }

/* =========================================================
   Blog
   ========================================================= */
.blog-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
    gap:32px;
}
.blog-card{
    background:var(--white);
    border-radius:var(--radius-lg);
    overflow:hidden;
    border:1px solid var(--line);
    transition:transform .4s var(--ease-out), box-shadow .4s var(--ease-out), border-color .4s var(--ease-out);
    display:flex;
    flex-direction:column;
    text-decoration:none;
    color:inherit;
}
.blog-card:hover{
    transform:translateY(-6px);
    box-shadow:var(--shadow-md);
    border-color:transparent;
}
.blog-card:hover .blog-card-media img{ transform:scale(1.06); }
.blog-card:hover .blog-card-title{ color:var(--gold-dark); }
.blog-card-media{
    aspect-ratio:16/10;
    overflow:hidden;
    background:var(--cream-2);
    position:relative;
}
.blog-card-media img{
    width:100%; height:100%;
    object-fit:cover;
    transition:transform .8s var(--ease-out);
}
.blog-card-tag{
    position:absolute;
    top:16px; left:16px;
    background:var(--brown);
    color:var(--cream);
    padding:6px 14px;
    border-radius:100px;
    font-size:.68rem;
    letter-spacing:.2em;
    text-transform:uppercase;
    font-weight:600;
    z-index:2;
    box-shadow:var(--shadow-sm);
}
.blog-card-body{
    padding:28px 30px 32px;
    flex:1;
    display:flex;
    flex-direction:column;
}
.blog-card-meta{
    display:flex;
    gap:16px;
    align-items:center;
    font-size:.74rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--text-muted);
    margin-bottom:14px;
    font-weight:600;
}
.blog-card-meta .dot{
    width:4px; height:4px;
    border-radius:50%;
    background:var(--gold);
}
.blog-card-title{
    font-family:var(--serif);
    font-weight:500;
    font-size:1.4rem;
    color:var(--brown);
    line-height:1.25;
    margin:0 0 12px;
    transition:color .3s;
}
.blog-card-excerpt{
    color:var(--text-muted);
    font-size:.95rem;
    line-height:1.7;
    margin-bottom:20px;
    flex:1;
}
.blog-card-more{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:.78rem;
    font-weight:600;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--brown);
    padding-bottom:4px;
    border-bottom:1px solid var(--gold);
    align-self:flex-start;
    transition:color .3s, gap .3s;
}
.blog-card:hover .blog-card-more{ color:var(--gold-dark); gap:12px; }
.blog-card-more svg{ width:14px; height:14px; transition:transform .3s; }
.blog-card:hover .blog-card-more svg{ transform:translateX(3px); }

/* Article body */
.article{
    max-width:820px;
    margin:0 auto;
}
.article-header{
    text-align:center;
    max-width:760px;
    margin:0 auto 60px;
}
.article-header{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
}
.article-header .breadcrumbs{ margin-bottom:0; }
.article-header h1{
    font-size:clamp(2rem, 3.6vw, 3rem);
    margin:8px 0 0;
    order:3;
}
.article-header .article-meta{ order:2; margin-bottom:0; }
.article-meta{
    display:inline-flex;
    align-items:center;
    gap:18px;
    color:#d5c6b4;
    font-size:.78rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    font-weight:600;
    margin-bottom:1.4rem;
}
.article-meta .dot{
    width:4px; height:4px;
    border-radius:50%;
    background:var(--gold-light);
}
.article-cover{
    max-width:1100px;
    margin:-60px auto 60px;
    padding:0 24px;
    position:relative;
    z-index:2;
}
.article-cover img{
    width:100%;
    aspect-ratio:16/8;
    object-fit:cover;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-lg);
    border:10px solid var(--white);
}
.article-body{
    max-width:760px;
    margin:0 auto;
    font-size:1.06rem;
    line-height:1.85;
    color:var(--text);
}
.article-body p{ margin-bottom:1.4em; }
.article-body h2{
    font-size:clamp(1.5rem, 2.4vw, 2rem);
    margin-top:2.4em;
    margin-bottom:.7em;
    padding-left:16px;
    border-left:3px solid var(--gold);
}
.article-body h3{
    font-size:1.35rem;
    margin-top:1.8em;
    margin-bottom:.6em;
}
.article-body ul{
    padding-left:1.4em;
    margin-bottom:1.6em;
}
.article-body ul li{ margin-bottom:.6em; }
.article-body strong{ color:var(--brown); font-weight:600; }
.article-body blockquote{
    margin:2em 0;
    padding:22px 30px;
    background:var(--cream-2);
    border-left:3px solid var(--gold);
    border-radius:0 var(--radius) var(--radius) 0;
    font-family:var(--serif);
    font-style:italic;
    font-size:1.2rem;
    color:var(--brown);
    line-height:1.55;
}
.article-tags{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:3em;
    padding-top:2em;
    border-top:1px solid var(--line);
}
.article-tags span{
    background:var(--cream-2);
    border:1px solid var(--line);
    color:var(--brown);
    padding:6px 14px;
    border-radius:100px;
    font-size:.74rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-weight:600;
}
.article-nav{
    display:flex;
    justify-content:space-between;
    gap:20px;
    margin-top:3em;
    padding-top:2em;
    border-top:1px solid var(--line);
}
.article-nav a{
    color:var(--brown);
    font-size:.82rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-weight:600;
    display:inline-flex;
    align-items:center;
    gap:10px;
    transition:color .3s;
}
.article-nav a:hover{ color:var(--gold-dark); }
.article-nav svg{ width:16px; height:16px; }

/* =========================================================
   Prose / privacy
   ========================================================= */
.prose{
    max-width:820px;
    margin:0 auto;
}
.prose h2{
    margin-top:2.6em;
    padding-bottom:.4em;
    border-bottom:1px solid var(--line);
    font-size:1.7rem;
}
.prose h2:first-of-type{ margin-top:.4em; }
.prose p, .prose li{ color:var(--text); font-size:1rem; line-height:1.85; }
.prose ul{ padding-left:1.4em; }
.prose ul li{ margin-bottom:.6em; }
.prose strong{ color:var(--brown); font-weight:600; }
.prose a{ text-decoration:underline; text-underline-offset:3px; text-decoration-color:rgba(143,108,61,.4); }

/* =========================================================
   Footer
   ========================================================= */
.site-footer{
    background:linear-gradient(180deg, var(--brown) 0%, var(--brown-2) 100%);
    color:#d5c6b4;
    padding:80px 0 0;
    position:relative;
}
.site-footer::before{
    content:"";
    position:absolute;
    top:0; left:0; right:0;
    height:3px;
    background:linear-gradient(90deg, var(--gold-dark), var(--gold-light), var(--gold-dark));
}
.footer-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1.3fr;
    gap:50px;
    padding-bottom:60px;
}
.footer-brand img{
    height:74px;
    background:var(--cream);
    padding:6px;
    border-radius:6px;
    margin-bottom:20px;
}
.footer-brand p{ color:#c9b89f; font-size:.94rem; line-height:1.75; margin-bottom:0; }
.footer-col h4{
    color:var(--gold-light);
    font-family:var(--sans);
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.26em;
    text-transform:uppercase;
    margin-bottom:1.6em;
    padding-bottom:.8em;
    border-bottom:1px solid rgba(217,189,133,.18);
}
.footer-col ul{ list-style:none; padding:0; margin:0; }
.footer-col ul li{ margin-bottom:.75em; }
.footer-col a{
    color:#c9b89f;
    font-size:.92rem;
    transition:color .25s var(--ease-out), padding-left .25s var(--ease-out);
    display:inline-block;
}
.footer-col a:hover{ color:var(--gold-light); padding-left:6px; }
.footer-contact li{
    display:flex;
    gap:12px;
    align-items:flex-start;
    color:#c9b89f;
    font-size:.92rem;
    line-height:1.55;
}
.footer-contact li svg{
    width:18px; height:18px;
    color:var(--gold-light);
    flex-shrink:0;
    margin-top:3px;
}
.footer-contact a{ padding-left:0 !important; }
.footer-social{
    display:flex; gap:10px;
    margin-top:1.5em;
}
.footer-social a{
    width:40px; height:40px;
    border-radius:50%;
    background:rgba(217,189,133,.1);
    border:1px solid rgba(217,189,133,.2);
    display:flex; align-items:center; justify-content:center;
    padding:0 !important;
    color:var(--gold-light);
    transition:background .25s, transform .25s, color .25s;
}
.footer-social a:hover{
    background:var(--gold-dark);
    color:var(--white);
    transform:translateY(-2px);
    padding-left:0 !important;
}
.footer-social svg{ width:16px; height:16px; }

.footer-bottom{
    border-top:1px solid rgba(217,189,133,.14);
    padding:24px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:14px;
    font-size:.82rem;
    color:#a89680;
}
.footer-bottom a{ color:#a89680; }
.footer-bottom a:hover{ color:var(--gold-light); }
.footer-bottom .legal{ display:flex; gap:22px; flex-wrap:wrap; }
.footer-credit{
    text-align:center;
    padding:16px 0;
    background:rgba(0,0,0,.2);
    font-size:.78rem;
    color:#a89680;
    letter-spacing:.06em;
    border-top:1px solid rgba(217,189,133,.08);
}
.footer-credit a{
    color:var(--gold-light);
    font-weight:600;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-size:.72rem;
    padding-left:6px;
    transition:color .25s;
    display:inline-flex;
    align-items:center;
    gap:6px;
}
.footer-credit a:hover{ color:var(--white); }
.footer-credit a::before{
    content:"♥";
    color:var(--gold);
    font-size:.9rem;
}

/* =========================================================
   Lightbox
   ========================================================= */
.lightbox{
    position:fixed;
    inset:0;
    background:rgba(20,15,10,.94);
    display:none;
    align-items:center;
    justify-content:center;
    padding:40px;
    z-index:1000;
    animation:fadeIn .3s ease;
}
.lightbox.open{ display:flex; }
.lightbox img{
    max-width:90vw;
    max-height:86vh;
    box-shadow:0 30px 80px rgba(0,0,0,.5);
    border:16px solid var(--white);
    background:var(--white);
    animation:zoomIn .35s var(--ease-out);
}
@keyframes zoomIn{
    from{ transform:scale(.95); opacity:0; }
    to  { transform:scale(1); opacity:1; }
}
.lightbox-close,
.lightbox-prev,
.lightbox-next{
    position:absolute;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(217,189,133,.3);
    color:var(--cream);
    width:52px; height:52px;
    border-radius:50%;
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background .25s, transform .25s, border-color .25s;
    backdrop-filter:blur(8px);
}
.lightbox-close:hover,
.lightbox-prev:hover,
.lightbox-next:hover{
    background:var(--gold-dark);
    border-color:var(--gold-dark);
    color:var(--white);
}
.lightbox-close{ top:26px; right:26px; }
.lightbox-prev{ left:26px; top:50%; transform:translateY(-50%); }
.lightbox-next{ right:26px; top:50%; transform:translateY(-50%); }
.lightbox-prev:hover{ transform:translateY(-50%) scale(1.08); }
.lightbox-next:hover{ transform:translateY(-50%) scale(1.08); }
.lightbox-close svg,
.lightbox-prev svg,
.lightbox-next svg{ width:22px; height:22px; }

@keyframes fadeIn{ from{opacity:0} to{opacity:1} }

/* =========================================================
   Reveal on scroll — robust with fallback
   ========================================================= */
/* Only hide when JS is available; otherwise content stays visible */
html.js .reveal{
    opacity:0;
    transform:translateY(24px);
    transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);
    will-change:opacity, transform;
}
html.js .reveal.in{ opacity:1; transform:none; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
    html.js .reveal{ opacity:1 !important; transform:none !important; }
    *,*::before,*::after{
        animation-duration:.001ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.001ms !important;
        scroll-behavior:auto !important;
    }
}

/* =========================================================
   Responsive
   ========================================================= */

/* Large tablet / small desktop */
@media (max-width: 1024px){
    .hero-inner{ grid-template-columns:1fr; gap:60px; }
    .hero-visual{ height:480px; max-width:540px; margin:0 auto; }
    .split, .split.reverse{ grid-template-columns:1fr; gap:70px; }
    .split.reverse .split-media{ order:0; }
    .split-media{ max-width:520px; margin-left:auto; margin-right:auto; }
    .split-media .badge{ right:0; bottom:-20px; padding:22px 26px; }
    .split-media .badge .value{ font-size:2rem; }
    .features{ grid-template-columns:repeat(2, 1fr); }
    .categories{ grid-template-columns:repeat(2, 1fr); }
    .contact-grid{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr 1fr; gap:40px; }
    section{ padding:80px 0; }
    .hero-meta{ gap:32px; }
    .scroll-hint{ display:none; }
    .services-list{ grid-template-columns:1fr; }
}

/* Tablet portrait */
@media (max-width: 768px){
    .top-bar{ display:none; }
    .nav-links{
        position:fixed;
        top:0; right:0;
        width:min(88vw, 360px);
        height:100vh;
        background:var(--cream);
        flex-direction:column;
        align-items:flex-start;
        justify-content:flex-start;
        padding:100px 30px 30px;
        gap:0;
        transform:translateX(105%);
        transition:transform .4s var(--ease-out);
        box-shadow:var(--shadow-lg);
        overflow-y:auto;
    }
    .nav-links.open{ transform:translateX(0); }
    .nav-links > li > a{
        display:block;
        width:100%;
        padding:18px 4px;
        font-size:1.05rem;
        border-bottom:1px solid var(--line);
    }
    .nav-links > li > a::after{ display:none; }
    .nav-links .nav-cta{ margin:24px 0 0; width:100%; }
    .nav-links .nav-cta > a.btn{
        width:100%;
        justify-content:center;
        padding:16px 24px;
    }
    .nav-toggle{ display:block; z-index:110; }
    .brand img{ height:56px; }
    .brand-text .brand-name{ font-size:1.15rem; }
    .brand-text .brand-sub{ font-size:.62rem; letter-spacing:.28em; }
    .site-header{ padding:0; }
    .site-header .nav{ padding:12px 0; }

    section{ padding:70px 0; }
    .section-head{ margin-bottom:44px; }
    .page-hero{ padding:70px 0 80px; }
    .hero{ padding:32px 0 60px; min-height:auto; }
    .hero-visual{ height:400px; max-width:100%; }
    .hero-content .lead{ font-size:1.02rem; }
    .hero-actions{ margin-bottom:2rem; }
    .hero-meta{
        gap:16px;
        grid-template-columns:repeat(3, 1fr);
        padding-top:1.5rem;
        justify-content:stretch;
    }
    .hero-meta .stat{ text-align:left; }
    .hero-meta .stat .value{ font-size:1.55rem; }
    .hero-meta .stat .label{ font-size:.62rem; letter-spacing:.14em; margin-top:6px; }
    .hero-badge{ top:-14px; right:auto; left:50%; transform:translateX(-50%); }

    /* Categorie in 2 colonne su tablet mobile */
    .categories{ grid-template-columns:repeat(2, 1fr); gap:14px; }
    .category-card{ aspect-ratio:4/5; }
    .category-card h3{ font-size:1.15rem; }
    .category-card .cat-body{ left:16px; right:16px; bottom:16px; }
    .category-card .cat-arrow{ width:34px; height:34px; top:14px; right:14px; opacity:1; transform:none; }
    .category-card .cat-arrow svg{ width:14px; height:14px; }

    .features{ grid-template-columns:1fr; gap:18px; }
    .feature-card{ padding:36px 28px; }
    .feature-num{ top:22px; right:26px; }

    .services-list{ grid-template-columns:1fr; }
    .service-card{ padding:36px 28px; }
    .service-card .num{ top:22px; right:26px; font-size:3rem; }

    .footer-grid{ grid-template-columns:1fr; gap:36px; padding-bottom:40px; }
    .footer-bottom{ justify-content:center; text-align:center; }
    .footer-brand img{ height:64px; }

    .contact-info,
    .contact-form{ padding:36px 24px; }
    .form-row{ grid-template-columns:1fr; }
    .map-embed iframe{ height:340px; }

    .lightbox{ padding:20px; }
    .lightbox img{ border-width:10px; max-width:94vw; max-height:82vh; }
    .lightbox-prev, .lightbox-next{ width:44px; height:44px; }
    .lightbox-close{ top:16px; right:16px; width:44px; height:44px; }

    .split-media .accent{ display:none; }
    .split-media .badge{ padding:18px 22px; }
    .split-media .badge .value{ font-size:1.7rem; }
    .highlight blockquote{ padding:0; font-size:1.35rem; line-height:1.55; }
    .highlight blockquote::before,
    .highlight blockquote::after{ font-size:3.4rem; }

    .cta-banner{ padding:70px 0; }
    .cta-banner p{ font-size:.98rem; }

    .prose h2{ font-size:1.4rem; margin-top:2em; }
    .prose p, .prose li{ font-size:.98rem; }

    /* Blog mobile */
    .blog-grid{ grid-template-columns:1fr; gap:24px; }
    .article-cover{ margin-top:-40px; padding:0 20px; }
    .article-cover img{ aspect-ratio:16/10; border-width:6px; }
    .article-body{ font-size:1rem; }
    .article-body blockquote{ padding:18px 22px; font-size:1.08rem; }
    .article-nav{ flex-direction:column; align-items:flex-start; gap:16px; }
}

/* Mobile phones */
@media (max-width: 520px){
    section{ padding:60px 0; }
    .container{ padding:0 20px; }
    .gallery-grid{ grid-template-columns:1fr 1fr; gap:12px; }
    .gallery-item{ padding:6px; }
    .gallery-item .zoom-icon{ width:36px; height:36px; bottom:14px; right:14px; }
    .gallery-filters{ gap:6px; margin-bottom:36px; }
    .gallery-filters button{ padding:8px 16px; font-size:.72rem; letter-spacing:.14em; }

    .hero-actions{ flex-direction:column; }
    .hero-actions .btn{ width:100%; justify-content:center; }
    .hero-meta{ gap:12px; }
    .hero-meta .stat .value{ font-size:1.35rem; }
    .hero-meta .stat .label{ font-size:.58rem; letter-spacing:.1em; }
    .hero-visual{ height:340px; }

    h1{ font-size:2.05rem; }
    h2{ font-size:1.65rem; }
    h3{ font-size:1.2rem; }

    .eyebrow{ font-size:.7rem; letter-spacing:.2em; }
    .eyebrow::before{ width:24px; }

    .top-bar{ display:none; }
    .site-header .nav{ gap:12px; }
    .brand img{ height:48px; }
    .brand-text .brand-name{ font-size:1rem; letter-spacing:.01em; }
    .brand-text .brand-sub{ font-size:.55rem; letter-spacing:.22em; }

    .footer-grid{ gap:30px; }
    .footer-col h4{ font-size:.72rem; letter-spacing:.2em; margin-bottom:1.2em; }
    .footer-brand p{ font-size:.9rem; }
    .footer-bottom{ padding:18px 0; font-size:.75rem; gap:10px; }
    .footer-bottom .legal{ gap:16px; }

    .contact-info,
    .contact-form{ padding:30px 22px; }
    .contact-info h3{ font-size:1.35rem; }
    .contact-info .info-row .value{ font-size:.94rem; }

    .service-card{ padding:32px 24px; }
    .service-card h3{ padding-right:44px; }
    .service-card .num{ font-size:2.4rem; top:20px; right:22px; }

    .feature-card{ padding:32px 24px; }

    .category-card{ aspect-ratio:1/1; }
    .category-card h3{ font-size:1.05rem; }
    .category-card .cat-count{ font-size:.66rem; letter-spacing:.16em; }

    .split-media{ margin-left:0; margin-right:0; }
    .split-media .img-main{ border-width:8px; }
    .split-media .badge{ right:12px; padding:16px 20px; bottom:-16px; }
    .split-media .badge .value{ font-size:1.5rem; }

    .cta-banner{ padding:60px 0; }
    .cta-banner h2{ font-size:1.55rem; }

    .breadcrumbs{ font-size:.7rem; letter-spacing:.16em; }
    .page-hero{ padding:60px 0 70px; }
    .page-hero > .container > p{ font-size:.98rem; }

    .highlight blockquote{ font-size:1.2rem; }
    .highlight .author{ font-size:1rem; letter-spacing:.22em; }
}

/* Very small screens */
@media (max-width: 360px){
    .container{ padding:0 16px; }
    h1{ font-size:1.85rem; }
    h2{ font-size:1.45rem; }
    .brand-text .brand-sub{ display:none; }
    .brand-text .brand-name{ font-size:.94rem; }
    .brand img{ height:44px; }
    .hero-meta{ grid-template-columns:1fr 1fr; row-gap:20px; }
    .hero-meta .stat:last-child{ grid-column:1 / -1; text-align:center; }
    .categories{ grid-template-columns:1fr; }
    .category-card{ aspect-ratio:16/10; }
}