/* =========================================================



   MIGLIORE IDEA REGALO



   Frontend pubblico



   Concept 1 - Minimal / Editoriale / Elegante



   ========================================================= */





/* =========================================================



   DESIGN TOKENS



   ========================================================= */



:root {



    --sage: #a8b89a;



    --sage-dark: #829676;



    --sage-soft: #e7eee6;



    --sage-faint: #f1f5ef;



    --canvas: #f5f5f2;



    --surface: #ffffff;



    --surface-warm: #fafaf8;



    --taupe: #bdb7ae;



    --ink: #333333;



    --text: #3b3b39;



    --muted: #6c7068;



    --border: rgba(51, 51, 51, 0.11);



    --border-sage: rgba(130, 150, 118, 0.25);



    --content-width: 1240px;



    --article-width: min(82%, 1050px);



    --radius: 12px;



    --radius-large: 18px;



    --shadow-soft:



        0 10px 34px



        rgba(0, 0, 0, 0.035);



    --shadow-card:



        0 8px 24px



        rgba(0, 0, 0, 0.035);



    --serif:



        Georgia,



        "Times New Roman",



        Times,



        serif;



    --sans:



        -apple-system,



        BlinkMacSystemFont,



        "Segoe UI",



        Roboto,



        Helvetica,



        Arial,



        sans-serif;



}





/* =========================================================



   RESET



   ========================================================= */



*,



*::before,



*::after {



    box-sizing: border-box;



}



html {



    -webkit-text-size-adjust: 100%;



}



body {



    margin: 0;



    background: var(--canvas);



    color: var(--ink);



    font-family: var(--sans);



    line-height: 1.65;



    -webkit-font-smoothing: antialiased;



    -moz-osx-font-smoothing: grayscale;



}



img {



    display: block;



    max-width: 100%;



    height: auto;



}



a {



    color: inherit;



}



button,



input,



textarea,



select {



    font: inherit;



}





/* =========================================================



   ACCESSIBILITY



   ========================================================= */



.sr-only {



    position: absolute;



    width: 1px;



    height: 1px;



    padding: 0;



    margin: -1px;



    overflow: hidden;



    clip: rect(0, 0, 0, 0);



    white-space: nowrap;



    border: 0;



}



a:focus-visible,



button:focus-visible,



input:focus-visible,



textarea:focus-visible,



select:focus-visible {



    outline: 3px solid var(--sage-dark);



    outline-offset: 3px;



}





/* =========================================================



   GENERAL CONTAINER



   ========================================================= */



.site-container {



    width:



        min(



            calc(100% - 40px),



            var(--content-width)



        );



    margin-inline: auto;



}





/* =========================================================



   HEADER



   ========================================================= */



.site-header {



    position: relative;



    z-index: 20;



    border-bottom: 1px solid var(--border);



    background: rgba(255, 255, 255, 0.98);



    box-shadow:



        0 5px 22px



        rgba(0, 0, 0, 0.035);



}



.site-header-inner {



    display: grid;



    grid-template-columns:



        auto



        minmax(300px, 1fr)



        minmax(220px, 300px);



    align-items: center;



    gap: 38px;



    min-height: 98px;



}





/* =========================================================



   LOGO / BRAND



   ========================================================= */



.brand {



    display: flex;



    align-items: center;



    gap: 16px;



    color: inherit;



    text-decoration: none;



    flex-shrink: 0;



}



.brand-mark-wrap {



    display: flex;



    align-items: center;



    justify-content: center;



    width: 60px;



    height: 60px;



    color: var(--sage);



}



.brand-mark {



    display: block;



    width: 100%;



    height: 100%;



}



.brand-text {



    display: flex;



    flex-direction: column;



    justify-content: center;



    line-height: 1;



}

.brand-name {
    position: relative;
    display: flex;
    flex-direction: column;
    width: max-content;
    line-height: 1;
}

.brand-claim {
    margin-top: 6px;
    color: var(--muted);
    font-family: var(--sans);
    font-size: 0.72rem;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0.01em;
    white-space: nowrap;
}



.brand-primary {



    color: var(--ink);



    font-family: var(--serif);



    font-size: 1.9rem;



    font-weight: 400;



    letter-spacing: 0.025em;



}



.brand-secondary {



    margin-top: 3px;



    color: var(--sage-dark);



    font-family: var(--serif);



    font-size: 1.08rem;



    font-weight: 400;



    letter-spacing: 0.09em;



    text-transform: uppercase;



}





/* =========================================================



   MAIN NAVIGATION



   ========================================================= */



.site-nav {



    display: flex;



    align-items: center;



    justify-content: center;



    gap: 34px;



    min-width: 0;



}



.site-nav a {



    position: relative;



    color: var(--ink);



    font-size: 0.96rem;



    font-weight: 500;



    text-decoration: none;



    white-space: nowrap;



}



.site-nav a::before {



    content: "";



    position: absolute;



    left: 0;



    right: 0;



    bottom: -8px;



    height: 1px;



    background: var(--sage-dark);



    transform: scaleX(0);



    transform-origin: center;



    transition:



        transform 0.18s ease;



}



.site-nav a:hover {



    color: var(--sage-dark);



}



.site-nav a:hover::before {



    transform: scaleX(1);



}



.nav-dropdown::after {



    content: "⌄";



    display: inline-block;



    margin-left: 6px;



    color: var(--sage-dark);



    font-size: 0.85rem;



}





/* =========================================================



   HEADER SEARCH



   ========================================================= */



.site-search {



    display: flex;



    align-items: center;



    min-width: 0;



    width: 100%;



    overflow: hidden;



    border:



        1px solid



        rgba(51, 51, 51, 0.14);



    border-radius: 999px;



    background: #ffffff;



    transition:



        border-color 0.18s ease,



        box-shadow 0.18s ease;



}



.site-search:focus-within {



    border-color: var(--sage);



    box-shadow:



        0 0 0 3px



        rgba(168, 184, 154, 0.13);



}



.site-search input {



    min-width: 0;



    width: 100%;



    padding:



        11px 4px



        11px 17px;



    border: 0;



    outline: 0;



    background: transparent;



    color: var(--ink);



}



.site-search input::placeholder {



    color: #989b96;



}



.site-search button {



    display: flex;



    align-items: center;



    justify-content: center;



    flex: 0 0 46px;



    width: 46px;



    height: 42px;



    padding: 0;



    border: 0;



    background: transparent;



    color: var(--ink);



    cursor: pointer;



}



.site-search button:hover {



    color: var(--sage-dark);



}



.site-search button svg {



    width: 19px;



    height: 19px;



    fill: none;



    stroke: currentColor;



    stroke-width: 1.8;



    stroke-linecap: round;



}





/* =========================================================



   GENERIC MAIN



   ========================================================= */



.site-main {



    padding-bottom: 56px;



}





/* =========================================================



   BREADCRUMBS



   ========================================================= */



.breadcrumbs {



    max-width: var(--article-width);



    margin:



        22px auto



        0;



}



.breadcrumbs ol {



    display: flex;



    flex-wrap: wrap;



    gap: 6px;



    margin: 0;



    padding: 0;



    color: #656860;



    font-size: 0.88rem;



    line-height: 1.5;



    list-style: none;



}



.breadcrumbs li:not(:last-child)::after {



    margin-left: 6px;



    content: "›";



    color: var(--taupe);



}



.breadcrumbs a {



    color: #656860;



    text-decoration: none;



}



.breadcrumbs a:hover {



    color: var(--sage-dark);



    text-decoration: underline;



}





/* =========================================================



   ARTICLE



   ========================================================= */



.public-article {



    max-width: var(--article-width);



    margin:



        20px auto



        0;



    padding:



        58px 64px



        68px;



    border: 1px solid var(--border);



    border-radius: var(--radius);



    background: var(--surface);



    box-shadow: var(--shadow-soft);



}





/* =========================================================



   ARTICLE HEADER



   ========================================================= */



.public-article-header {



    padding-bottom: 35px;



    margin-bottom: 40px;



    border-bottom: 1px solid var(--border);



}



.article-kicker {



    margin-bottom: 13px;



    color: var(--sage-dark);



    font-size: 0.75rem;



    font-weight: 700;



    letter-spacing: 0.15em;



    text-transform: uppercase;



}



.public-article-header h1 {



    margin: 0;



    color: var(--ink);



    font-family: var(--serif);



    font-size:



        clamp(



            2.25rem,



            5vw,



            3.55rem



        );



    font-weight: 400;



    line-height: 1.08;



    letter-spacing: -0.025em;



}



.public-article-excerpt {



    margin:



        23px 0



        0;



    color: var(--muted);



    font-family: var(--sans);



    font-size: 1.17rem;



    line-height: 1.68;



}



.article-meta {



    display: flex;



    flex-wrap: wrap;



    gap:



        8px 20px;



    margin-top: 23px;



    color: var(--muted);



    font-size: 0.82rem;



}





/* =========================================================



   ARTICLE BODY



   ========================================================= */



.public-article-body {



    color: var(--text);



    font-family: var(--serif);



    font-size: 1.09rem;



    line-height: 1.82;



}



/*



 * Un blocco Paragrafo può contenere più paragrafi



 * separati da una riga vuota.



 *



 * Il renderer genera un article-paragraph-group:



 * lo spazio interno tra i paragrafi rimane contenuto,



 * mentre il blocco completo conserva il respiro



 * editoriale rispetto agli elementi successivi.



 */



.article-paragraph-group {



    margin:



        0 0



        27px;



}



.article-paragraph {



    margin: 0;



}



.article-paragraph + .article-paragraph {



    margin-top: 11px;



}



.public-article-body strong {



    color: var(--ink);



    font-weight: 700;



}



/* =========================================================



   ARTICLE HEADINGS



   ========================================================= */



.article-heading {



    color: var(--ink);



    font-family: var(--serif);



    font-weight: 400;



    letter-spacing: -0.015em;



}



.article-heading-2 {



    margin:



        50px 0



        19px;



    font-size: 1.9rem;



    line-height: 1.24;



}



.article-heading-3 {



    margin:



        38px 0



        15px;



    font-size: 1.45rem;



    line-height: 1.3;



}





/* =========================================================



   ARTICLE BOX



   ========================================================= */



.article-box {



    position: relative;



    padding:



        25px 27px;



    margin:



        36px 0;



    border:



        1px solid



        rgba(130, 150, 118, 0.28);



    border-left:



        4px solid



        var(--sage);



    border-radius: 8px;



    background: var(--sage-soft);



}



.article-box-title {



    margin:



        0 0



        10px;



    color: var(--ink);



    font-family: var(--sans);



    font-size: 1.08rem;



    font-weight: 700;



}



.article-box-text {



    margin: 0;



}





/* =========================================================



   ARTICLE PRODUCT



   ========================================================= */



.article-product {



    margin-top: 25px;



}





/* ---------------------------------------------------------



   1 O 2 IMMAGINI: COLONNA A SINISTRA



   --------------------------------------------------------- */



.article-product--side {



    display: grid;



    grid-template-columns:



        160px



        minmax(0, 1fr);



    align-items: start;



    gap: 26px;



}



.article-product--side .article-product-gallery {



    width: 160px;



    min-width: 0;



}



.article-product--side .article-product-gallery-viewport {



    width: 100%;



    overflow: visible;



}



.article-product--side .article-product-gallery-track {



    display: flex;



    flex-direction: column;



    gap: 10px;



    width: 100%;



}



.article-product--side .article-product-image-wrapper {



    flex: 0 0 118px;



    width: 100%;



    height: 118px;



}





/* ---------------------------------------------------------



   3+ IMMAGINI: GALLERIA ORIZZONTALE SOTTO IL TITOLO



   --------------------------------------------------------- */



.article-product--gallery-top {



    display: block;



}



.article-product--gallery-top .article-product-content {



    width: 100%;



    padding-top: 0;



}



.article-product--gallery-top .article-product-title {



    margin-bottom: 14px;



}



.article-product-gallery--horizontal {



    --product-gallery-visible: 3;



    --product-gallery-gap: 14px;



    display: grid;



    grid-template-columns:



        36px



        minmax(0, 1fr)



        36px;



    align-items: center;



    gap: 10px;



    width: 100%;



    margin:



        4px 0



        18px;



}



.article-product-gallery--horizontal .article-product-gallery-viewport {



    grid-column: 2;



    min-width: 0;



    width: 100%;



    overflow: hidden;



}



.article-product-gallery--horizontal .article-product-gallery-track {



    display: flex;



    flex-direction: row;



    gap: var(--product-gallery-gap);



    width: 100%;



    will-change: transform;



    transition:



        transform 0.22s ease;



}



.article-product-gallery--horizontal .article-product-image-wrapper {



    flex:



        0 0



        calc(



            (100% - 28px)



            / 3



        );



    height: 180px;



}





/* ---------------------------------------------------------



   IMMAGINI: STILE COMUNE



   --------------------------------------------------------- */



.article-product-image-wrapper {



    display: flex;



    align-items: center;



    justify-content: center;



    margin: 0;



    padding: 10px;



    overflow: hidden;



    border: 1px solid var(--border);



    border-radius: 10px;



    background: var(--surface);



}



.article-product-image {



    display: block;



    width: 100%;



    height: 100%;



    max-width: none;



    max-height: none;



    object-fit: contain;



}





/* ---------------------------------------------------------



   CONTROLLI GALLERIA



   --------------------------------------------------------- */



.article-product-gallery-control {



    display: flex;



    align-items: center;



    justify-content: center;



    width: 34px;



    height: 34px;



    padding: 0;



    border:



        1px solid



        var(--border-sage);



    border-radius: 999px;



    background: var(--sage-faint);



    color: var(--sage-dark);



    font-family: var(--sans);



    font-size: 1.25rem;



    font-weight: 700;



    line-height: 1;



    cursor: pointer;



    transition:



        background 0.15s ease,



        border-color 0.15s ease,



        color 0.15s ease,



        opacity 0.15s ease;



}



.article-product-gallery--horizontal



.article-product-gallery-control-prev {



    grid-column: 1;



    justify-self: center;



}



.article-product-gallery--horizontal



.article-product-gallery-control-next {



    grid-column: 3;



    justify-self: center;



}



.article-product-gallery-control:hover:not(:disabled) {



    border-color: var(--sage);



    background: var(--sage-soft);



    color: var(--ink);



}



.article-product-gallery-control:disabled {



    opacity: 0.32;



    cursor: default;



}



.article-product-gallery-control[hidden] {



    visibility: hidden;



    pointer-events: none;



}





/* ---------------------------------------------------------



   TESTO E AZIONI



   --------------------------------------------------------- */



.article-product-content {



    min-width: 0;



    padding-top: 2px;



}



.article-product--text-only .article-product-content {



    padding-top: 0;



}



.article-product-title {



    margin:



        0 0



        10px;



    color: var(--ink);



    font-family: var(--sans);



    font-size: 1.13rem;



    font-weight: 700;



    line-height: 1.38;



}



.article-product-description {



    margin: 0;



}



.article-product-description + .article-product-description {



    margin-top: 11px;



}



.article-product-actions {



    display: flex;



    flex-wrap: wrap;



    gap: 10px;



    margin-top: 18px;



    font-family: var(--sans);



}



.article-product-link {



    display: inline-flex;



    align-items: center;



    justify-content: center;



    min-height: 40px;



    padding:



        9px 15px;



    border-radius: 999px;



    font-size: 0.86rem;



    font-weight: 650;



    line-height: 1.2;



    text-decoration: none;



    transition:



        background 0.16s ease,



        border-color 0.16s ease,



        color 0.16s ease,



        transform 0.16s ease;



}



.article-product-link:hover {



    transform: translateY(-1px);



}



.article-product-link-primary {



    border:



        1px solid



        var(--sage-dark);



    background: var(--sage-dark);



    color: #ffffff;



}



.article-product-link-primary:hover {



    background: #718665;



    border-color: #718665;



}



.article-product-link-secondary {



    border:



        1px solid



        var(--border-sage);



    background: var(--sage-faint);



    color: #596452;



}



.article-product-link-secondary:hover {



    border-color: var(--sage);



    background: var(--sage-soft);



    color: var(--ink);



}



.article-product-separator {



    width: 54px;



    height: 1px;



    margin:



        30px auto



        34px;



    background:



        rgba(130, 150, 118, 0.48);



}





/* =========================================================



   ARTICLE TAGS



   ========================================================= */



.article-tags {



    padding-top: 31px;



    margin-top: 52px;



    border-top: 1px solid var(--border);



}



.article-tags-label {



    display: block;



    margin-bottom: 11px;



    color: var(--sage-dark);



    font-size: 0.74rem;



    font-weight: 700;



    letter-spacing: 0.12em;



    text-transform: uppercase;



}



.article-tags ul {



    display: flex;



    flex-wrap: wrap;



    gap: 8px;



    margin: 0;



    padding: 0;



    list-style: none;



}



.article-tags li {



    padding:



        6px 11px;



    border:



        1px solid



        rgba(130, 150, 118, 0.20);



    border-radius: 999px;



    background: var(--sage-soft);



    color: #596452;



    font-family: var(--sans);



    font-size: 0.82rem;



}





/* =========================================================



   HOMEPAGE



   ========================================================= */



.homepage-main {



    background: var(--canvas);



}





/* =========================================================



   HOMEPAGE HERO



   ========================================================= */



.home-hero {



    position: relative;



    overflow: hidden;



    border-bottom: 1px solid var(--border);



    background:



        linear-gradient(



            135deg,



            #fafbf8 0%,



            #f2f5ef 55%,



            #eaf0e6 100%



        );



}



.home-hero-inner {



    display: grid;



    grid-template-columns:



        minmax(0, 1.5fr)



        minmax(250px, 0.65fr);



    align-items: center;



    gap: 70px;



    min-height: 530px;



    padding: 72px clamp(22px, 3vw, 36px) 78px;



}



.home-hero-copy {



    max-width: 760px;



}



.home-eyebrow {



    display: block;



    margin-bottom: 14px;



    color: var(--sage-dark);



    font-size: 0.76rem;



    font-weight: 700;



    letter-spacing: 0.16em;



    text-transform: uppercase;



}



.home-hero h1 {



    max-width: 820px;



    margin: 0;



    color: var(--ink);



    font-family: var(--serif);



    font-size:



        clamp(



            3rem,



            6vw,



            5.25rem



        );



    font-weight: 400;



    line-height: 1.01;



    letter-spacing: -0.045em;



}



.home-hero h1 span {



    display: block;



    color: var(--sage-dark);



}



.home-hero-copy > p {



    max-width: 660px;



    margin:



        28px 0



        0;



    color: var(--muted);



    font-size: 1.18rem;



    line-height: 1.7;



}





/* =========================================================



   HERO SEARCH



   ========================================================= */



.hero-search {



    display: flex;



    max-width: 650px;



    margin-top: 32px;



    padding: 6px;



    border:



        1px solid



        rgba(51, 51, 51, 0.12);



    border-radius: 999px;



    background: #ffffff;



    box-shadow:



        0 10px 28px



        rgba(0, 0, 0, 0.045);



}



.hero-search:focus-within {



    border-color: var(--sage);



}



.hero-search input {



    min-width: 0;



    flex: 1;



    padding:



        13px 18px;



    border: 0;



    outline: 0;



    background: transparent;



    color: var(--ink);



    font-size: 1rem;



}



.hero-search input::placeholder {



    color: #92958f;



}



.hero-search button {



    flex-shrink: 0;



    padding:



        12px 27px;



    border: 0;



    border-radius: 999px;



    background: var(--sage-dark);



    color: #ffffff;



    font-weight: 650;



    cursor: pointer;



    transition:



        background 0.15s ease,



        transform 0.15s ease;



}



.hero-search button:hover {



    background: #718665;



}



.hero-search button:active {



    transform: translateY(1px);



}





/* =========================================================



   HERO DECORATIVE MARK



   ========================================================= */



.home-hero-mark {



    display: flex;



    align-items: center;



    justify-content: center;



    color:



        rgba(130, 150, 118, 0.32);



    pointer-events: none;



}



.home-hero-mark svg {



    width: min(100%, 290px);



    height: auto;



}





/* =========================================================



   HOMEPAGE SECTIONS



   ========================================================= */



.home-section {



    padding:



        82px 0;



}



.home-section-soft {



    position: relative;



    isolation: isolate;



    border-top: 0;



    border-bottom: 0;



    background: transparent;



}



.home-section-soft::before {



    content: "";



    position: absolute;



    z-index: -1;



    top: 0;



    bottom: 0;



    left: clamp(-36px, -3vw, -22px);



    right: clamp(-36px, -3vw, -22px);



    border-top: 1px solid var(--border);



    border-bottom: 1px solid var(--border);



    background: var(--surface-warm);



}



.home-section-header {



    display: flex;



    align-items: flex-end;



    justify-content: space-between;



    gap: 30px;



    margin-bottom: 36px;



}



.home-section-header .home-eyebrow {



    margin-bottom: 10px;



}



.home-section-header h2 {



    margin: 0;



    color: var(--ink);



    font-family: var(--serif);



    font-size:



        clamp(



            2rem,



            4vw,



            3.1rem



        );



    font-weight: 400;



    line-height: 1.12;



    letter-spacing: -0.025em;



}



.home-section-link {



    flex-shrink: 0;



    padding-bottom: 4px;



    color: var(--sage-dark);



    font-size: 0.92rem;



    font-weight: 650;



    text-decoration: none;



}



.home-section-link:hover {



    text-decoration: underline;



}





/* =========================================================



   HOMEPAGE CATEGORIES



   ========================================================= */



.home-category-grid {



    display: grid;



    grid-template-columns:



        repeat(3, minmax(0, 1fr));



    gap: 22px;



}



.home-category-card {



    display: flex;



    flex-direction: column;



    min-height: 220px;



    padding: 30px;



    border: 1px solid var(--border);



    border-radius: var(--radius);



    background: var(--surface);



    color: var(--ink);



    text-decoration: none;



    box-shadow:



        0 5px 18px



        rgba(0, 0, 0, 0.025);



    transition:



        transform 0.18s ease,



        border-color 0.18s ease,



        box-shadow 0.18s ease;



}



.home-category-card:hover {



    transform: translateY(-3px);



    border-color: var(--border-sage);



    box-shadow: var(--shadow-card);



}



.home-category-icon {



    display: flex;



    align-items: center;



    justify-content: center;



    width: 46px;



    height: 46px;



    margin-bottom: 30px;



    border-radius: 50%;



    background: var(--sage-soft);



    color: var(--sage-dark);



    font-size: 1.25rem;



}



.home-category-card strong {



    display: block;



    margin-bottom: 8px;



    font-family: var(--serif);



    font-size: 1.45rem;



    font-weight: 400;



    line-height: 1.25;



}



.home-category-card > span:last-child {



    max-width: 30ch;



    color: var(--muted);



    font-size: 0.92rem;



}







/* I quattro ingressi principali della home: 4 box su una riga solo desktop. */

@media (min-width: 901px) {

    .home-hero + .home-section .home-category-grid {

        grid-template-columns: repeat(4, minmax(0, 1fr));

    }

}



/* =========================================================



   HOMEPAGE FEATURED ARTICLES



   ========================================================= */



.home-featured-grid {



    display: grid;



    grid-template-columns:



        repeat(3, minmax(0, 1fr));



    gap: 22px;



}



.home-article-card {



    min-height: 300px;



    overflow: hidden;



    border: 1px solid var(--border);



    border-radius: var(--radius);



    background: var(--surface);



    box-shadow:



        0 5px 18px



        rgba(0, 0, 0, 0.025);



    transition:



        transform 0.18s ease,



        box-shadow 0.18s ease,



        border-color 0.18s ease;



}



.home-article-card:hover {



    transform: translateY(-3px);



    border-color: var(--border-sage);



    box-shadow: var(--shadow-card);



}



.home-article-card-content {



    display: flex;



    flex-direction: column;



    height: 100%;



    padding: 30px;



}



.home-card-category {



    margin-bottom: 18px;



    color: var(--sage-dark);



    font-size: 0.72rem;



    font-weight: 700;



    letter-spacing: 0.13em;



    text-transform: uppercase;



}



.home-article-card h3 {



    margin:



        0 0



        16px;



    color: var(--ink);



    font-family: var(--serif);



    font-size: 1.6rem;



    font-weight: 400;



    line-height: 1.25;



    letter-spacing: -0.015em;



}



.home-article-card h3 a {



    color: inherit;



    text-decoration: none;



}



.home-article-card h3 a:hover {



    color: var(--sage-dark);



}



.home-article-card p {



    margin:



        0 0



        24px;



    color: var(--muted);



    font-size: 0.93rem;



    line-height: 1.7;



}



.home-card-link {



    margin-top: auto;



    color: var(--sage-dark);



    font-size: 0.9rem;



    font-weight: 650;



    text-decoration: none;



}



.home-card-link:hover {



    text-decoration: underline;



}



.home-placeholder-card {



    background:



        linear-gradient(



            145deg,



            #ffffff,



            #f8faf6



        );



}



.home-card-coming {



    display: inline-flex;



    align-self: flex-start;



    margin-top: auto;



    padding:



        6px 10px;



    border-radius: 999px;



    background: var(--sage-soft);



    color: #65745e;



    font-size: 0.76rem;



    font-weight: 650;



}





/* =========================================================



   HOMEPAGE EDITORIAL SECTION



   ========================================================= */



.home-editorial {



    position: relative;



    isolation: isolate;



    padding:



        92px 0;



    background: transparent;



}



.home-editorial::before {



    content: "";



    position: absolute;



    z-index: -1;



    top: 0;



    bottom: 0;



    left: clamp(-36px, -3vw, -22px);



    right: clamp(-36px, -3vw, -22px);



    background: var(--surface);



}



.home-editorial-inner {



    display: grid;



    padding-left: clamp(22px, 3vw, 36px);



    padding-right: clamp(22px, 3vw, 36px);



    grid-template-columns:



        minmax(0, 0.9fr)



        minmax(0, 1fr);



    gap: 90px;



    align-items: start;



}



.home-editorial h2 {



    max-width: 600px;



    margin: 0;



    color: var(--ink);



    font-family: var(--serif);



    font-size:



        clamp(



            2.2rem,



            4vw,



            3.4rem



        );



    font-weight: 400;



    line-height: 1.12;



    letter-spacing: -0.03em;



}



.home-editorial-inner > div:last-child {



    max-width: 610px;



    padding-top: 28px;



    color: var(--muted);



    font-size: 1.04rem;



    line-height: 1.8;



}



.home-editorial-inner > div:last-child p {



    margin:



        0 0



        20px;



}



.home-editorial-inner > div:last-child p:last-child {



    margin-bottom: 0;



}





/* =========================================================



   FOOTER



   ========================================================= */



.site-footer {



    border-top: 1px solid var(--border);



    background: var(--surface-warm);



}



.site-footer-grid {



    display: grid;



    grid-template-columns:



        1.45fr



        0.8fr



        0.9fr;



    gap: 44px;



    padding:



        48px 0



        38px;



}





/* =========================================================



   FOOTER BRAND



   ========================================================= */



.footer-brand {



    padding-right: 32px;



    border-right: 1px solid var(--border);



}



.footer-brand-heading {



    display: flex;



    align-items: center;



    gap: 15px;



    margin-bottom: 17px;



}



.footer-logo-mark {



    display: flex;



    width: 48px;



    height: 48px;



    color: var(--sage);



}



.footer-logo-mark .brand-mark {



    width: 100%;



    height: 100%;



}



.footer-brand-heading strong {



    display: block;



    color: var(--ink);



    font-family: var(--serif);



    font-size: 1.25rem;



    font-weight: 400;



    line-height: 1.25;



}



.footer-brand-heading span:not(.footer-logo-mark) {



    display: block;



    margin-top: 4px;



    color: var(--sage-dark);



    font-size: 0.68rem;



    font-weight: 700;



    letter-spacing: 0.12em;



    text-transform: uppercase;



}



.footer-brand > p {



    max-width: 42ch;



    margin: 0;



    color: var(--muted);



    font-size: 0.92rem;



    line-height: 1.7;



}





/* =========================================================



   FOOTER COLUMNS



   ========================================================= */



.footer-column {



    padding-right: 20px;



}



.footer-column:not(:last-child) {



    border-right: 1px solid var(--border);



}



.footer-column h2 {



    margin:



        0 0



        18px;



    color: var(--sage-dark);



    font-family: var(--sans);



    font-size: 0.75rem;



    font-weight: 700;



    letter-spacing: 0.13em;



    text-transform: uppercase;



}



.footer-column ul {



    margin: 0;



    padding: 0;



    list-style: none;



}



.footer-column li + li {



    margin-top: 9px;



}



.footer-column a {



    color: var(--ink);



    font-size: 0.91rem;



    text-decoration: none;



    transition:



        color 0.15s ease;



}



.footer-column a:hover {



    color: var(--sage-dark);



}





/* =========================================================



   FOOTER BOTTOM



   ========================================================= */



.site-footer-bottom {



    display: flex;



    align-items: center;



    justify-content: center;



    gap: 9px;



    min-height: 58px;



    border-top: 1px solid var(--border);



    color: #858781;



    font-size: 0.82rem;



}



.site-footer-bottom p {



    margin: 0;



}



.footer-heart {



    color: var(--sage);



    font-size: 0.9rem;



}





/* =========================================================



   RESPONSIVE



   HEADER INTERMEDIO



   ========================================================= */



@media (max-width: 1180px) {



    .site-header-inner {



        grid-template-columns:



            auto



            minmax(0, 1fr);



        gap:



            16px 30px;



        min-height: auto;



        padding:



            16px 0;



    }



    .site-nav {



        justify-content: flex-end;



        gap: 26px;



    }



    .site-search {



        grid-column:



            1 / -1;



        width:



            min(



                100%,



                420px



            );



        justify-self: end;



    }



    .home-hero-inner {



        gap: 40px;



    }



    .home-hero h1 {



        font-size:



            clamp(



                3rem,



                6vw,



                4.6rem



            );



    }



}





/* =========================================================



   RESPONSIVE



   TABLET



   ========================================================= */



@media (max-width: 900px) {



    .site-header-inner {



        display: flex;



        flex-wrap: wrap;



        gap:



            16px 24px;



    }



    .brand {



        margin-right: auto;



    }



    .site-nav {



        justify-content: flex-end;



        gap:



            14px 22px;



    }



    .site-search {



        flex:



            0 0 100%;



        width: 100%;



        max-width: none;



        margin-left: 0;



    }



    .home-hero-inner {



        grid-template-columns: 1fr;



        min-height: 0;



        padding: 64px clamp(22px, 3vw, 36px) 66px;



    }



    .home-hero-mark {



        display: none;



    }



    .home-category-grid,



    .home-featured-grid {



        grid-template-columns:



            repeat(2, minmax(0, 1fr));



    }



    .home-featured-grid > :last-child {



        grid-column:



            1 / -1;



    }



    .home-editorial-inner {



        grid-template-columns: 1fr;



        gap: 20px;



    }



    .home-editorial-inner > div:last-child {



        padding-top: 0;



    }



    .site-footer-grid {



        grid-template-columns:



            1.25fr



            0.8fr



            0.9fr;



        gap: 30px;



    }



}





/* =========================================================



   RESPONSIVE



   MOBILE



   ========================================================= */



@media (max-width: 760px) {



    .site-container {



        width:



            min(



                calc(100% - 28px),



                var(--content-width)



            );



    }



    .site-header-inner {



        display: flex;



        flex-wrap: wrap;



        gap: 15px;



        min-height: auto;



        padding:



            15px 0;



    }



    .brand {



        width: 100%;



        margin-right: 0;



    }



    .brand-mark-wrap {



        width: 48px;



        height: 48px;



    }



    .brand-primary {



        font-size: 1.55rem;



    }



    .brand-secondary {



        margin-top: 3px;



        font-size: 0.9rem;



    }

    .brand-claim {
        margin-top: 5px;
        font-size: 0.68rem;
    }



    .site-nav {



        width: 100%;



        justify-content: flex-start;



        gap:



            11px 20px;



        overflow-x: auto;



        padding-bottom: 4px;



        scrollbar-width: none;



    }



    .site-nav::-webkit-scrollbar {



        display: none;



    }



    .site-nav a {



        font-size: 0.88rem;



    }



    .site-search {



        width: 100%;



        max-width: none;



    }



    .breadcrumbs {



        margin-top: 18px;



    }



    .breadcrumbs ol {



        font-size: 0.82rem;



    }



    .public-article {



        margin-top: 18px;



        padding:



            37px 25px



            44px;



    }



    .public-article-header {



        padding-bottom: 29px;



        margin-bottom: 31px;



    }



    .public-article-header h1 {



        font-size:



            clamp(



                2rem,



                10vw,



                2.65rem



            );



    }



    .public-article-excerpt {



        font-size: 1.05rem;



    }



    .public-article-body {



        font-size: 1.02rem;



        line-height: 1.75;



    }



    .article-heading-2 {



        margin-top: 42px;



        font-size: 1.6rem;



    }



    .article-heading-3 {



        margin-top: 32px;



        font-size: 1.3rem;



    }



    .article-box {



        padding:



            21px 20px;



        margin:



            30px 0;



    }



    .article-product {



        grid-template-columns:



            118px



            minmax(0, 1fr);



        gap: 18px;



        margin-top: 22px;



    }



    .article-product-image-wrapper {



        min-height: 108px;



        padding: 9px;



    }



    .article-product-image {



        max-width: 108px;



        max-height: 130px;



    }



    .article-product-title {



        font-size: 1.06rem;



    }



    .article-product-actions {



        margin-top: 15px;



    }



    .article-product-separator {



        width: 46px;



        margin:



            25px auto



            29px;



    }



    /* HOMEPAGE */



    .home-hero-inner {



        padding: 52px 18px 56px;



    }



    .home-hero h1 {



        font-size:



            clamp(



                2.65rem,



                12vw,



                3.65rem



            );



        line-height: 1.04;



    }



    .home-hero-copy > p {



        margin-top: 22px;



        font-size: 1.05rem;



    }



    .hero-search {



        flex-direction: column;



        gap: 7px;



        margin-top: 27px;



        padding: 7px;



        border-radius: 13px;



    }



    .hero-search input {



        width: 100%;



        padding:



            12px 13px;



    }



    .hero-search button {



        width: 100%;



        padding:



            11px 18px;



        border-radius: 8px;



    }



    .home-section {



        padding:



            58px 0;



    }



    .home-section-header {



        align-items: flex-start;



        flex-direction: column;



        gap: 15px;



        margin-bottom: 27px;



    }



    .home-section-header h2 {



        font-size:



            clamp(



                1.9rem,



                9vw,



                2.6rem



            );



    }



    .home-category-grid,



    .home-featured-grid {



        grid-template-columns: 1fr;



        gap: 15px;



    }



    .home-featured-grid > :last-child {



        grid-column: auto;



    }



    .home-category-card {



        min-height: 0;



        padding: 24px;



    }



    .home-category-icon {



        margin-bottom: 22px;



    }



    .home-article-card {



        min-height: 0;



    }



    .home-article-card-content {



        padding: 25px;



    }



    .home-editorial {



        padding:



            62px 0;



    }



    .home-editorial h2 {



        font-size:



            clamp(



                2rem,



                9vw,



                2.75rem



            );



    }



    .home-editorial-inner > div:last-child {



        font-size: 1rem;



    }



    /* FOOTER */



    .site-footer-grid {



        grid-template-columns: 1fr;



        gap: 0;



        padding:



            38px 0



            30px;



    }



    .footer-brand,



    .footer-column,



    .footer-column:not(:last-child) {



        padding-right: 0;



        padding-bottom: 26px;



        margin-bottom: 26px;



        border-right: 0;



        border-bottom:



            1px solid



            var(--border);



    }



    .footer-column:last-child {



        padding-bottom: 0;



        margin-bottom: 0;



        border-bottom: 0;



    }



    .site-footer-bottom {



        min-height: 62px;



        padding:



            12px 0;



        text-align: center;



    }



}





/* =========================================================



   VERY SMALL SCREENS



   ========================================================= */



@media (max-width: 600px) {



    .home-editorial-inner {

        padding-left: 18px;

        padding-right: 18px;

    }



}





@media (max-width: 480px) {



    .site-container {



        width:



            min(



                calc(100% - 22px),



                var(--content-width)



            );



    }



    .brand {



        gap: 12px;



    }



    .brand-mark-wrap {



        width: 44px;



        height: 44px;



    }



    .brand-primary {



        font-size: 1.45rem;



    }



    .brand-secondary {



        font-size: 0.84rem;



        letter-spacing: 0.075em;



    }

    .brand-claim {
        font-size: 0.64rem;
    }



    .site-nav {



        gap:



            10px 17px;



    }



    .site-nav a {



        font-size: 0.84rem;



    }



    .site-search input {



        padding-left: 14px;



        font-size: 0.9rem;



    }



    .public-article {



        padding:



            32px 20px



            38px;



    }



    .public-article-header h1 {



        font-size: 2rem;



    }



    .public-article-excerpt {



        font-size: 1rem;



    }



    .article-product {



        grid-template-columns: 1fr;



        gap: 15px;



    }



    .article-product-image-wrapper {



        width:



            min(



                100%,



                180px



            );



        justify-self: center;



    }



    .article-product-content {



        padding-top: 0;



    }



    .article-product-actions {



        gap: 8px;



    }



    .article-product-link {



        width: 100%;



    }



    .article-product-separator {



        width: 42px;



        margin:



            23px auto



            27px;



    }



    .home-hero h1 {



        font-size: 2.55rem;



    }



    .home-category-card strong {



        font-size: 1.3rem;



    }



    .home-article-card h3 {



        font-size: 1.4rem;



    }



    .footer-brand-heading strong {



        font-size: 1.15rem;



    }



}





/* =========================================================



   REDUCED MOTION



   ========================================================= */



@media (prefers-reduced-motion: reduce) {



    *,



    *::before,



    *::after {



        scroll-behavior: auto !important;



        transition-duration: 0.01ms !important;



        animation-duration: 0.01ms !important;



        animation-iteration-count: 1 !important;



    }



}



/* =========================================================



   ARTICLE PRODUCT - RESPONSIVE OVERRIDES



   Le regole sono in fondo al file per prevalere sulle



   vecchie media query generiche dell'articolo.



   ========================================================= */



@media (min-width: 601px) and (max-width: 900px) {



    .article-product--side {



        display: grid;



        grid-template-columns:



            140px



            minmax(0, 1fr);



        gap: 21px;



    }



    .article-product--side .article-product-gallery {



        width: 140px;



    }



    .article-product--side .article-product-image-wrapper {



        flex-basis: 112px;



        height: 112px;



    }



    .article-product--gallery-top {



        display: block;



    }



    .article-product-gallery--horizontal {



        --product-gallery-visible: 2;



        --product-gallery-gap: 12px;



        grid-template-columns:



            34px



            minmax(0, 1fr)



            34px;



        gap: 8px;



    }



    .article-product-gallery--horizontal



    .article-product-image-wrapper {



        flex:



            0 0



            calc(



                (100% - 12px)



                / 2



            );



        height: 170px;



    }



    .article-product-content {



        padding-top: 0;



    }



}





@media (max-width: 600px) {



    .article-product,



    .article-product--side,



    .article-product--gallery-top,



    .article-product--text-only {



        display: block;



    }



    .article-product--side .article-product-gallery {



        width:



            min(



                100%,



                300px



            );



        margin:



            0 auto



            16px;



    }



    .article-product--side .article-product-gallery-track {



        gap: 10px;



    }



    .article-product--side .article-product-image-wrapper {



        flex-basis: 190px;



        height: 190px;



    }



    .article-product--gallery-top .article-product-title {



        margin-bottom: 12px;



    }



    .article-product-gallery--horizontal {



        --product-gallery-visible: 1;



        --product-gallery-gap: 10px;



        grid-template-columns:



            32px



            minmax(0, 1fr)



            32px;



        gap: 7px;



        margin-bottom: 16px;



    }



    .article-product-gallery--horizontal



    .article-product-image-wrapper {



        flex: 0 0 100%;



        height: 220px;



    }



    .article-product-gallery-control {



        width: 32px;



        height: 32px;



        font-size: 1.15rem;



    }



    .article-product-content {



        padding-top: 0;



    }



    .article-product-actions {



        gap: 8px;



    }



    .article-product-link {



        width: 100%;



    }



    .article-product-separator {



        width: 42px;



        margin:



            23px auto



            27px;



    }



}





@media (max-width: 480px) {



    .article-product-gallery--horizontal



    .article-product-image-wrapper {



        height: 195px;



    }



    .article-product--side .article-product-gallery {



        width:



            min(



                100%,



                270px



            );



    }



    .article-product--side .article-product-image-wrapper {



        flex-basis: 175px;



        height: 175px;



    }



}



/* =========================================================

   PRODUCT IMAGE MAGNIFIER



   L'immagine originale NON viene ingrandita.

   Il vero ingrandimento viene mostrato nell'overlay

   centrato perfettamente nella viewport.



   Solo desktop / dispositivi con mouse.

   ========================================================= */



@media (min-width: 900px) and (hover: hover) and (pointer: fine) {



    .article-product-image-wrapper {

        cursor: zoom-in;

    }



    /*

     * Sicurezza: neutralizza qualsiasi vecchio zoom locale.

     */

    .article-product-image-wrapper:hover,

    .article-product-image-wrapper:hover

    .article-product-image {

        transform: none !important;

    }



}





/* =========================================================

   PRODUCT IMAGE MAGNIFIER OVERLAY



   Overlay unico, centrato nella viewport.

   Dimensioni volutamente molto ampie.

   ========================================================= */



.product-image-magnifier-overlay {

    position: fixed;

    inset: 0;

    z-index: 100000;



    display: flex;

    align-items: center;

    justify-content: center;



    padding: 1vh 1vw;



    pointer-events: none;



    background:

        rgba(0, 0, 0, 0.08);

}



.product-image-magnifier-overlay img {

    display: block;



    width: 90vw;

    height: 90vh;



    max-width: 90vw;

    max-height: 90vh;



    object-fit: contain;



    padding: 6px;



    border:

        1px solid

        rgba(51, 51, 51, 0.12);



    border-radius: 12px;



    background: #ffffff;



    box-shadow:

        0 26px 90px

        rgba(0, 0, 0, 0.36);

}



/* =========================================================



   PAGINA 404 PUBBLICA



   ========================================================= */



.public-error-page {



    width: min(100%, 860px);



    margin:



        0 auto;



    padding:



        90px 20px



        110px;



    text-align: center;



}





.public-error-code {



    margin-bottom: 14px;



    color:



        var(--sage, #a8b89a);



    font-family:



        Georgia,



        "Times New Roman",



        serif;



    font-size:



        clamp(



            5.5rem,



            14vw,



            9rem



        );



    font-weight: 400;



    line-height: 0.9;



    letter-spacing: -0.06em;



    opacity: 0.36;



}





.public-error-eyebrow {



    display: block;



    margin-bottom: 18px;



    color:



        var(--sage-dark, #829676);



    font-size: 0.76rem;



    font-weight: 700;



    letter-spacing: 0.17em;



    text-transform: uppercase;



}





.public-error-title {



    max-width: 760px;



    margin:



        0 auto;



    color:



        var(--ink, #333333);



    font-family:



        Georgia,



        "Times New Roman",



        serif;



    font-size:



        clamp(



            2.8rem,



            7vw,



            5.2rem



        );



    font-weight: 400;



    line-height: 1;



    letter-spacing: -0.045em;



}





.public-error-title span {



    display: block;



    color:



        var(--sage-dark, #829676);



}





.public-error-text {



    max-width: 650px;



    margin:



        30px auto 0;



    color:



        var(--muted, #6c7068);



    font-size: 1.12rem;



    line-height: 1.75;



}





.public-error-text-secondary {



    margin-top: 10px;



    font-size: 1rem;



}





.public-error-actions {



    display: flex;



    align-items: center;



    justify-content: center;



    flex-wrap: wrap;



    gap: 12px;



    margin-top: 34px;



}





.public-error-button {



    display: inline-flex;



    align-items: center;



    justify-content: center;



    min-height: 46px;



    padding:



        11px 21px;



    border-radius: 999px;



    font-size: 0.9rem;



    font-weight: 700;



    text-decoration: none;



    transition:



        transform 0.15s ease,



        background 0.15s ease,



        border-color 0.15s ease;



}





.public-error-button:hover {



    transform:



        translateY(-1px);



}





.public-error-button-primary {



    border:



        1px solid



        var(--sage-dark, #829676);



    background:



        var(--sage-dark, #829676);



    color: #ffffff;



}





.public-error-button-primary:hover {



    background: #708366;



}





.public-error-button-secondary {



    border:



        1px solid



        rgba(130, 150, 118, 0.38);



    background:



        rgba(231, 238, 230, 0.55);



    color:



        var(--sage-dark, #829676);



}





.public-error-button-secondary:hover {



    background:



        rgba(231, 238, 230, 0.9);



}





@media (max-width: 600px) {



    .public-error-page {



        padding:



            60px 0



            75px;



    }





    .public-error-code {



        font-size: 5.2rem;



    }





    .public-error-title {



        font-size: 2.7rem;



    }





    .public-error-text {



        font-size: 1.02rem;



    }





    .public-error-actions {



        flex-direction: column;



    }





    .public-error-button {



        width: 100%;



        max-width: 300px;



    }



}





/* =========================================================

   CATEGORIES DIRECTORY — VISUAL TREE

   ========================================================= */



.categories-directory {

    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    padding: 76px 0 96px;

}



.categories-directory-hero {

    position: relative;

    display: grid;

    grid-template-columns: minmax(0, 1fr) 180px;

    gap: 56px;

    align-items: end;

    margin-bottom: 48px;

    padding: 0 0 34px;

    border-bottom: 1px solid var(--border);

}



.categories-directory-hero > div:first-child {

    max-width: 760px;

}



.categories-directory-hero h1 {

    margin: 8px 0 16px;

    font-family: var(--serif);

    font-size: clamp(3.1rem, 7vw, 5.8rem);

    font-weight: 400;

    line-height: 0.98;

    letter-spacing: -0.035em;

    color: var(--ink);

}



.categories-directory-hero p {

    max-width: 66ch;

    margin: 0;

    color: var(--muted);

    font-size: 1.04rem;

    line-height: 1.75;

}



.categories-directory-mark {

    position: relative;

    min-height: 120px;

    opacity: 0.8;

}



.categories-directory-mark::before {

    content: "";

    position: absolute;

    top: 16px;

    right: 54px;

    bottom: 16px;

    width: 1px;

    background: var(--border-sage);

}



.categories-directory-mark span {

    position: absolute;

    right: 48px;

    width: 13px;

    height: 13px;

    border: 2px solid var(--sage-dark);

    border-radius: 50%;

    background: var(--surface);

}



.categories-directory-mark span:nth-child(1) {

    top: 8px;

}



.categories-directory-mark span:nth-child(2) {

    top: 52px;

}



.categories-directory-mark span:nth-child(3) {

    bottom: 8px;

}



.categories-directory-mark span::before {

    content: "";

    position: absolute;

    top: 4px;

    right: 11px;

    width: 52px;

    border-top: 1px solid var(--border-sage);

}



.categories-hub-grid {

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 26px;

    align-items: start;

}



.category-hub-card {

    position: relative;

    overflow: hidden;

    border: 1px solid var(--border);

    border-radius: 22px;

    background:

        linear-gradient(

            145deg,

            rgba(255, 255, 255, 0.98),

            rgba(248, 250, 247, 0.96)

        );

    box-shadow:

        0 10px 34px

        rgba(42, 52, 38, 0.045);

}



.category-hub-card::after {

    content: "";

    position: absolute;

    top: -68px;

    right: -72px;

    width: 190px;

    height: 190px;

    border-radius: 50%;

    background:

        radial-gradient(

            circle,

            rgba(168, 184, 154, 0.16) 0,

            rgba(168, 184, 154, 0.04) 52%,

            transparent 70%

        );

    pointer-events: none;

}



.category-hub-card-top {

    position: relative;

    z-index: 1;

    display: grid;

    grid-template-columns: 66px minmax(0, 1fr);

    gap: 20px;

    padding: 28px 30px 22px;

}



.category-hub-symbol {

    display: grid;

    place-items: center;

    width: 58px;

    height: 58px;

    border: 1px solid rgba(130, 150, 118, 0.25);

    border-radius: 18px;

    background: var(--sage-soft);

    color: var(--sage-dark);

    font-family: var(--serif);

    font-size: 1.55rem;

}



.category-hub-overline {

    display: block;

    margin-bottom: 6px;

    color: var(--sage-dark);

    font-size: 0.68rem;

    font-weight: 700;

    letter-spacing: 0.14em;

    text-transform: uppercase;

}



.category-hub-heading h2 {

    margin: 0 0 9px;

    font-family: var(--serif);

    font-size: clamp(1.7rem, 3vw, 2.25rem);

    font-weight: 400;

    line-height: 1.08;

}



.category-hub-heading h2 a {

    color: var(--ink);

    text-decoration: none;

}



.category-hub-heading h2 a:hover {

    color: var(--sage-dark);

}



.category-hub-heading p {

    max-width: 48ch;

    margin: 0;

    color: var(--muted);

    font-size: 0.92rem;

    line-height: 1.65;

}



.category-hub-meta {

    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    padding: 0 30px 22px 116px;

}



.category-hub-meta span {

    display: inline-flex;

    align-items: center;

    min-height: 28px;

    padding: 5px 10px;

    border: 1px solid rgba(130, 150, 118, 0.2);

    border-radius: 999px;

    background: rgba(231, 238, 230, 0.46);

    color: var(--muted);

    font-size: 0.73rem;

    line-height: 1;

}



.category-hub-tree {

    margin: 0 30px 26px 116px;

    padding: 4px 0 2px;

}



.category-tree-list {

    margin: 0;

    padding: 0;

    list-style: none;

}



.category-tree-item {

    position: relative;

    margin: 0;

    padding: 0;

}



.category-tree-row {

    display: grid;

    grid-template-columns: minmax(0, 1fr) auto;

    gap: 12px;

    align-items: center;

    min-height: 45px;

    border-bottom: 1px solid rgba(33, 40, 31, 0.075);

}



.category-tree-item:last-child > .category-tree-row {

    border-bottom-color: transparent;

}



.category-tree-link {

    display: inline-flex;

    gap: 9px;

    align-items: center;

    min-width: 0;

    color: var(--ink);

    font-size: 0.91rem;

    font-weight: 600;

    text-decoration: none;

}



.category-tree-name {

    min-width: 0;

}



.category-tree-arrow {

    opacity: 0;

    color: var(--sage-dark);

    transform: translateX(-5px);

    transition:

        opacity 0.18s ease,

        transform 0.18s ease;

}



.category-tree-link:hover {

    color: var(--sage-dark);

}



.category-tree-link:hover .category-tree-arrow {

    opacity: 1;

    transform: translateX(0);

}



.category-tree-count {

    color: var(--muted);

    font-size: 0.68rem;

    white-space: nowrap;

}



.category-tree-branch {

    position: relative;

    margin: 0 0 4px 8px;

    padding-left: 21px;

}



.category-tree-branch::before {

    content: "";

    position: absolute;

    top: 0;

    bottom: 13px;

    left: 0;

    width: 1px;

    background: rgba(130, 150, 118, 0.35);

}



.category-tree-branch > .category-tree-list

    > .category-tree-item::before {

    content: "";

    position: absolute;

    top: 22px;

    left: -21px;

    width: 14px;

    border-top: 1px solid rgba(130, 150, 118, 0.35);

}



.category-tree-branch .category-tree-row {

    min-height: 41px;

}



.category-tree-branch .category-tree-link {

    font-size: 0.86rem;

    font-weight: 500;

}



.category-tree-branch

    .category-tree-branch

    .category-tree-link {

    color: #596253;

    font-size: 0.82rem;

}



.category-hub-empty {

    display: flex;

    gap: 14px;

    align-items: center;

    margin: 2px 30px 30px 116px;

    padding: 16px 18px;

    border-radius: 12px;

    background: rgba(231, 238, 230, 0.36);

}



.category-hub-empty-line {

    width: 26px;

    border-top: 1px solid var(--sage-dark);

}



.category-hub-empty p {

    margin: 0;

    color: var(--muted);

    font-size: 0.84rem;

}



.category-hub-footer {

    position: relative;

    z-index: 1;

    border-top: 1px solid var(--border);

}



.category-hub-footer a {

    display: flex;

    justify-content: space-between;

    gap: 18px;

    align-items: center;

    padding: 18px 30px;

    color: var(--ink);

    font-size: 0.84rem;

    font-weight: 700;

    letter-spacing: 0.02em;

    text-decoration: none;

    transition:

        background 0.18s ease,

        color 0.18s ease;

}



.category-hub-footer a:hover {

    background: rgba(231, 238, 230, 0.52);

    color: var(--sage-dark);

}



.category-hub-footer a span {

    font-size: 1.05rem;

}



.categories-directory-note {

    display: flex;

    gap: 14px;

    align-items: flex-start;

    max-width: 760px;

    margin: 34px auto 0;

    padding: 18px 22px;

    border-left: 3px solid var(--sage);

    background: rgba(248, 250, 247, 0.8);

    color: var(--muted);

}



.categories-directory-note-icon {

    color: var(--sage-dark);

    font-family: var(--serif);

    font-size: 1.35rem;

    line-height: 1;

}



.categories-directory-note p {

    margin: 0;

    font-size: 0.86rem;

    line-height: 1.65;

}



.categories-directory-note strong {

    color: var(--ink);

}





/* =========================================================

   CATEGORY DETAIL PAGES

   ========================================================= */



.category-page {

    width: 100%;

}



.category-breadcrumbs {

    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    align-items: center;

    width: min(1120px, calc(100% - 40px));

    margin: 0 auto;

    padding: 30px 0 0;

    color: var(--muted);

    font-size: 0.76rem;

}



.category-breadcrumbs a {

    color: var(--muted);

    text-decoration: none;

}



.category-breadcrumbs a:hover {

    color: var(--sage-dark);

    text-decoration: underline;

}



.category-breadcrumbs strong {

    color: var(--ink);

    font-weight: 600;

}



.category-page-hero {

    width: min(1120px, calc(100% - 40px));

    margin: 0 auto;

    padding: 64px 0 42px;

    border-bottom: 1px solid var(--border);

}



.category-page-hero h1 {

    margin: 8px 0 16px;

    max-width: 900px;

    font-family: var(--serif);

    font-size: clamp(3rem, 6vw, 5rem);

    font-weight: 400;

    line-height: 1;

    letter-spacing: -0.035em;

}



.category-page-hero p {

    max-width: 64ch;

    margin: 0;

    color: var(--muted);

    line-height: 1.7;

}



.category-page-children {

    width: min(1120px, calc(100% - 40px));

    margin: 0 auto;

    padding: 38px 0 6px;

}



.category-section-title {

    margin-bottom: 20px;

}



.category-section-title > span {

    color: var(--sage-dark);

    font-size: 0.68rem;

    font-weight: 700;

    letter-spacing: 0.14em;

    text-transform: uppercase;

}



.category-section-title h2 {

    margin: 5px 0 0;

    font-family: var(--serif);

    font-size: 1.8rem;

    font-weight: 400;

}



.category-page-child-grid {

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 12px;

}



.category-page-child {

    display: grid;

    grid-template-columns: 18px minmax(0, 1fr) auto;

    gap: 14px;

    align-items: center;

    min-height: 76px;

    padding: 15px 18px;

    border: 1px solid var(--border);

    border-radius: 13px;

    background: var(--surface);

    color: var(--ink);

    text-decoration: none;

    transition:

        transform 0.18s ease,

        border-color 0.18s ease,

        box-shadow 0.18s ease;

}



.category-page-child:hover {

    transform: translateY(-2px);

    border-color: var(--border-sage);

    box-shadow: var(--shadow-card);

}



.category-page-child-node {

    width: 9px;

    height: 9px;

    border: 2px solid var(--sage-dark);

    border-radius: 50%;

}



.category-page-child-copy {

    display: flex;

    flex-direction: column;

    gap: 3px;

}



.category-page-child-copy strong {

    font-family: var(--serif);

    font-size: 1.08rem;

    font-weight: 400;

}



.category-page-child-copy small {

    color: var(--muted);

    font-size: 0.7rem;

}



.category-page-child-arrow {

    color: var(--sage-dark);

    font-size: 1rem;

}



.category-content-section {

    width: min(1120px, calc(100% - 40px));

    margin: 0 auto;

}



.category-page-empty {

    width: min(1120px, calc(100% - 40px));

    margin: 40px auto;

    padding: 26px 28px;

    border: 1px solid var(--border);

    border-radius: 14px;

    background: rgba(248, 250, 247, 0.7);

}



.category-page-empty p {

    margin: 0 0 10px;

    color: var(--muted);

}



.category-page-empty a,

.category-page-back a {

    color: var(--sage-dark);

    font-weight: 700;

    text-decoration: none;

}



.category-page-empty a:hover,

.category-page-back a:hover {

    text-decoration: underline;

}



.category-page-back {

    width: min(1120px, calc(100% - 40px));

    margin: 0 auto;

    padding: 4px 0 70px;

}





@media (max-width: 900px) {

    .categories-directory-hero {

        grid-template-columns: 1fr;

        gap: 20px;

    }



    .categories-directory-mark {

        display: none;

    }



    .categories-hub-grid {

        grid-template-columns: 1fr;

    }

}





@media (max-width: 640px) {

    .categories-directory {

        width: min(100% - 28px, 1180px);

        padding: 48px 0 72px;

    }



    .categories-directory-hero {

        margin-bottom: 30px;

        padding-bottom: 26px;

    }



    .categories-directory-hero h1 {

        font-size: clamp(3rem, 16vw, 4.4rem);

    }



    .category-hub-card-top {

        grid-template-columns: 52px minmax(0, 1fr);

        gap: 14px;

        padding: 23px 20px 18px;

    }



    .category-hub-symbol {

        width: 48px;

        height: 48px;

        border-radius: 14px;

        font-size: 1.25rem;

    }



    .category-hub-meta {

        padding: 0 20px 18px 86px;

    }



    .category-hub-tree {

        margin: 0 20px 22px 86px;

    }



    .category-hub-empty {

        margin: 0 20px 24px 86px;

    }



    .category-tree-row {

        grid-template-columns: 1fr;

        gap: 2px;

        padding: 8px 0;

    }



    .category-tree-count {

        padding-left: 0;

    }



    .category-hub-footer a {

        padding: 17px 20px;

    }



    .categories-directory-note {

        margin-top: 26px;

    }



    .category-page-hero,

    .category-page-children,

    .category-content-section,

    .category-page-empty,

    .category-page-back,

    .category-breadcrumbs {

        width: min(100% - 28px, 1120px);

    }



    .category-page-hero {

        padding: 48px 0 32px;

    }



    .category-page-child-grid {

        grid-template-columns: 1fr;

    }

}





@media (max-width: 640px) {

    .home-section-soft::before,

    .home-editorial::before {

        left: -14px;

        right: -14px;

    }

}





/* =========================================================

   IDEE REGALO — DISCOVERY / TAG / PAGINAZIONE

   ========================================================= */



.gift-ideas-page {

    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    padding: 54px 0 82px;

}



.gift-ideas-hero {

    position: relative;

    display: grid;

    grid-template-columns: minmax(0, 1fr) 150px;

    gap: 42px;

    align-items: center;

    padding: 40px 46px 42px;

    overflow: hidden;

    border: 1px solid var(--border);

    border-radius: 24px;

    background:

        radial-gradient(

            circle at 88% 18%,

            rgba(168, 184, 154, 0.28),

            transparent 31%

        ),

        linear-gradient(

            135deg,

            rgba(248, 250, 247, 0.98),

            rgba(238, 243, 234, 0.84)

        );

}



.gift-ideas-hero::after {

    content: "";

    position: absolute;

    right: -70px;

    bottom: -110px;

    width: 280px;

    height: 280px;

    border: 1px solid rgba(130, 150, 118, 0.18);

    border-radius: 50%;

}



.gift-ideas-hero-copy {

    position: relative;

    z-index: 1;

}



.gift-ideas-eyebrow,

.gift-ideas-section-head > div > span {

    display: inline-block;

    color: var(--sage-dark);

    font-size: 0.7rem;

    font-weight: 700;

    letter-spacing: 0.15em;

    text-transform: uppercase;

}



.gift-ideas-hero h1 {

    margin: 10px 0 18px;

    max-width: 820px;

    font-family: var(--serif);

    font-size: clamp(3.1rem, 6vw, 5.2rem);

    font-weight: 400;

    line-height: 0.98;

    letter-spacing: -0.04em;

}



.gift-ideas-hero p {

    max-width: 64ch;

    margin: 0;

    color: var(--muted);

    font-size: 1rem;

    line-height: 1.75;

}



.gift-ideas-hero-mark {

    position: relative;

    z-index: 1;

    display: grid;

    place-items: center;

    width: 126px;

    height: 126px;

    justify-self: end;

    border: 1px solid rgba(130, 150, 118, 0.28);

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.66);

    box-shadow: 0 18px 45px rgba(62, 76, 55, 0.06);

    color: var(--sage-dark);

}



.gift-ideas-hero-mark span {

    font-family: var(--serif);

    font-size: 3.1rem;

    font-weight: 400;

    transform: translateY(-2px);

}





/* Tag navigation */



.gift-tag-panel {

    display: grid;

    grid-template-columns: 150px minmax(0, 1fr);

    gap: 26px;

    align-items: start;

    margin-top: 28px;

    padding: 22px 24px;

    border: 1px solid var(--border);

    border-radius: 18px;

    background: var(--surface);

    box-shadow: 0 10px 32px rgba(49, 61, 43, 0.035);

}



.gift-tag-panel-label {

    display: flex;

    flex-direction: column;

    gap: 2px;

    padding-top: 4px;

}



.gift-tag-panel-label span {

    font-family: var(--serif);

    font-size: 1rem;

}



.gift-tag-panel-label small {

    color: var(--muted);

    font-size: 0.72rem;

}



.gift-tag-list {

    display: flex;

    flex-wrap: wrap;

    gap: 9px;

}



.gift-tag-chip {

    display: inline-flex;

    gap: 9px;

    align-items: center;

    min-height: 38px;

    padding: 8px 12px 8px 14px;

    border: 1px solid var(--border);

    border-radius: 999px;

    background: #fff;

    color: var(--ink);

    font-size: 0.79rem;

    font-weight: 600;

    line-height: 1;

    text-decoration: none;

    transition:

        transform 0.16s ease,

        border-color 0.16s ease,

        background 0.16s ease,

        color 0.16s ease;

}



.gift-tag-chip em {

    display: grid;

    place-items: center;

    min-width: 22px;

    height: 22px;

    padding: 0 6px;

    border-radius: 999px;

    background: var(--sage-soft);

    color: var(--sage-dark);

    font-size: 0.67rem;

    font-style: normal;

    font-weight: 700;

}



.gift-tag-chip:hover {

    transform: translateY(-1px);

    border-color: var(--border-sage);

    color: var(--sage-dark);

}



.gift-tag-chip--active {

    border-color: var(--sage-dark);

    background: var(--sage-dark);

    color: #fff;

}



.gift-tag-chip--active em {

    background: rgba(255, 255, 255, 0.18);

    color: #fff;

}



.gift-tag-chip--active:hover {

    color: #fff;

}





/* Sections */



.gift-ideas-featured,

.gift-ideas-archive {

    margin-top: 64px;

}



.gift-ideas-archive {

    padding-top: 54px;

    border-top: 1px solid var(--border);

}



.gift-ideas-section-head {

    display: flex;

    justify-content: space-between;

    gap: 28px;

    align-items: end;

    margin-bottom: 24px;

}



.gift-ideas-section-head h2 {

    margin: 5px 0 0;

    font-family: var(--serif);

    font-size: clamp(2rem, 4vw, 3rem);

    font-weight: 400;

    line-height: 1.08;

    letter-spacing: -0.025em;

}



.gift-ideas-section-head > p {

    max-width: 340px;

    margin: 0 0 4px;

    color: var(--muted);

    font-size: 0.84rem;

    line-height: 1.55;

    text-align: right;

}



.gift-ideas-featured-grid,

.gift-ideas-grid {

    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 20px;

}





/* Idea cards */



.gift-idea-card {

    position: relative;

    min-width: 0;

    overflow: hidden;

    border: 1px solid var(--border);

    border-radius: 18px;

    background: var(--surface);

    box-shadow: 0 7px 24px rgba(52, 64, 46, 0.035);

    transition:

        transform 0.18s ease,

        border-color 0.18s ease,

        box-shadow 0.18s ease;

}



.gift-idea-card:hover {

    transform: translateY(-3px);

    border-color: var(--border-sage);

    box-shadow: 0 16px 38px rgba(52, 64, 46, 0.08);

}



.gift-idea-card--featured {

    background:

        linear-gradient(

            180deg,

            rgba(246, 249, 244, 0.92),

            #fff 38%

        );

}



.gift-idea-card--featured::before {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    left: 0;

    height: 3px;

    background: linear-gradient(

        90deg,

        var(--sage-dark),

        var(--sage),

        transparent

    );

}



.gift-idea-card-inner {

    display: flex;

    flex-direction: column;

    min-height: 100%;

    padding: 25px 25px 22px;

}



.gift-idea-card--featured .gift-idea-card-inner {

    min-height: 360px;

    padding: 30px 30px 26px;

}



.gift-idea-card-topline {

    display: flex;

    justify-content: space-between;

    gap: 16px;

    align-items: center;

    margin-bottom: 20px;

    color: var(--sage-dark);

    font-size: 0.65rem;

    font-weight: 700;

    letter-spacing: 0.12em;

    text-transform: uppercase;

}



.gift-idea-card-topline time {

    color: var(--muted);

    font-size: 0.65rem;

    font-weight: 500;

    letter-spacing: 0.03em;

}



.gift-idea-card h3 {

    margin: 0 0 14px;

    font-family: var(--serif);

    font-size: 1.42rem;

    font-weight: 400;

    line-height: 1.25;

    letter-spacing: -0.015em;

}



.gift-idea-card--featured h3 {

    font-size: 1.72rem;

}



.gift-idea-card h3 a {

    color: var(--ink);

    text-decoration: none;

}



.gift-idea-card h3 a:hover {

    color: var(--sage-dark);

}



.gift-idea-card p {

    margin: 0 0 20px;

    color: var(--muted);

    font-size: 0.87rem;

    line-height: 1.65;

}



.gift-idea-card-tags {

    display: flex;

    flex-wrap: wrap;

    gap: 7px;

    margin: auto 0 20px;

    padding-top: 4px;

}



.gift-idea-card-tags a {

    padding: 5px 8px;

    border: 1px solid var(--border);

    border-radius: 999px;

    background: rgba(248, 250, 247, 0.8);

    color: var(--muted);

    font-size: 0.65rem;

    font-weight: 600;

    line-height: 1;

    text-decoration: none;

}



.gift-idea-card-tags a:hover {

    border-color: var(--border-sage);

    color: var(--sage-dark);

}



.gift-idea-card-link {

    display: flex;

    justify-content: space-between;

    gap: 18px;

    align-items: center;

    margin-top: auto;

    padding-top: 18px;

    border-top: 1px solid var(--border);

    color: var(--ink);

    font-size: 0.76rem;

    font-weight: 700;

    text-decoration: none;

}



.gift-idea-card-link span:last-child {

    color: var(--sage-dark);

    font-size: 1.05rem;

    transition: transform 0.16s ease;

}



.gift-idea-card-link:hover {

    color: var(--sage-dark);

}



.gift-idea-card-link:hover span:last-child {

    transform: translateX(4px);

}





/* Pagination */



.gift-pagination {

    display: grid;

    grid-template-columns: 1fr auto 1fr;

    gap: 18px;

    align-items: center;

    margin-top: 34px;

    padding-top: 25px;

    border-top: 1px solid var(--border);

}



.gift-pagination-side {

    min-height: 44px;

}



.gift-pagination-side--right {

    display: flex;

    justify-content: flex-end;

}



.gift-pagination-side a {

    display: inline-flex;

    gap: 9px;

    align-items: center;

    min-height: 44px;

    padding: 10px 15px;

    border: 1px solid var(--border);

    border-radius: 999px;

    background: #fff;

    color: var(--ink);

    font-size: 0.76rem;

    font-weight: 700;

    text-decoration: none;

    transition:

        transform 0.16s ease,

        border-color 0.16s ease,

        color 0.16s ease;

}



.gift-pagination-side a:hover {

    transform: translateY(-1px);

    border-color: var(--border-sage);

    color: var(--sage-dark);

}



.gift-pagination-status {

    display: flex;

    gap: 6px;

    align-items: baseline;

    justify-content: center;

    color: var(--muted);

    font-size: 0.7rem;

    white-space: nowrap;

}



.gift-pagination-status strong {

    color: var(--ink);

    font-family: var(--serif);

    font-size: 1rem;

    font-weight: 400;

}





/* Empty state */



.gift-ideas-empty {

    display: flex;

    gap: 18px;

    align-items: center;

    margin-top: 46px;

    padding: 28px 30px;

    border: 1px solid var(--border);

    border-radius: 16px;

    background: rgba(248, 250, 247, 0.8);

}



.gift-ideas-empty > span {

    color: var(--sage-dark);

    font-family: var(--serif);

    font-size: 2rem;

}



.gift-ideas-empty h2 {

    margin: 0 0 5px;

    font-family: var(--serif);

    font-size: 1.35rem;

    font-weight: 400;

}



.gift-ideas-empty p {

    margin: 0;

    color: var(--muted);

    font-size: 0.84rem;

}





@media (max-width: 900px) {

    .gift-ideas-hero {

        grid-template-columns: 1fr;

    }



    .gift-ideas-hero-mark {

        display: none;

    }



    .gift-tag-panel {

        grid-template-columns: 1fr;

        gap: 14px;

    }



    .gift-tag-panel-label {

        flex-direction: row;

        gap: 8px;

        align-items: baseline;

    }



    .gift-ideas-featured-grid,

    .gift-ideas-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }

}





@media (max-width: 640px) {

    .gift-ideas-page {

        width: min(100% - 28px, 1180px);

        padding: 34px 0 62px;

    }



    .gift-ideas-hero {

        padding: 30px 24px 31px;

        border-radius: 18px;

    }



    .gift-ideas-hero h1 {

        font-size: clamp(2.65rem, 14vw, 4rem);

    }



    .gift-tag-panel {

        margin-top: 18px;

        padding: 17px;

        border-radius: 15px;

    }



    .gift-tag-list {

        gap: 7px;

    }



    .gift-tag-chip {

        min-height: 36px;

        padding: 7px 10px 7px 12px;

        font-size: 0.74rem;

    }



    .gift-ideas-featured,

    .gift-ideas-archive {

        margin-top: 44px;

    }



    .gift-ideas-archive {

        padding-top: 39px;

    }



    .gift-ideas-section-head {

        display: block;

        margin-bottom: 18px;

    }



    .gift-ideas-section-head > p {

        margin-top: 10px;

        text-align: left;

    }



    .gift-ideas-featured-grid,

    .gift-ideas-grid {

        grid-template-columns: 1fr;

    }



    .gift-idea-card--featured .gift-idea-card-inner,

    .gift-idea-card-inner {

        min-height: 0;

        padding: 24px 22px 21px;

    }



    .gift-pagination {

        grid-template-columns: 1fr 1fr;

        gap: 12px;

    }



    .gift-pagination-status {

        grid-column: 1 / -1;

        grid-row: 1;

    }



    .gift-pagination-side {

        grid-row: 2;

    }



    .gift-pagination-side a {

        width: 100%;

        justify-content: center;

    }

}

/* =========================================================
   BLOG — AREA EDITORIALE
   ========================================================= */
:root{--blog-accent:#b9785e;--blog-accent-dark:#945e49;--blog-accent-soft:#f3e8e2}
.brand--blog{position:relative}
.brand-blog-ribbon{position:absolute;top:-4px;right:-18px;z-index:2;padding:5px 9px 4px;border-radius:4px;background:var(--blog-accent);color:#fff;font-size:.62rem;font-weight:800;letter-spacing:.16em;line-height:1;transform:rotate(-12deg);box-shadow:0 3px 9px rgba(148,94,73,.14)}
.site-nav a.is-active{color:var(--blog-accent-dark)}
.site-nav a.is-active::before{transform:scaleX(1);background:var(--blog-accent)}
.blog-masthead{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:65px;align-items:center;min-height:455px;margin-top:22px;padding:76px 82px;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius-large);background:linear-gradient(135deg,#fbfaf7 0%,#f3f0e9 58%,#eee7df 100%);box-shadow:var(--shadow-soft)}
.blog-masthead::after{position:absolute;right:-120px;bottom:-160px;width:390px;height:390px;border:1px solid rgba(185,120,94,.17);border-radius:50%;content:""}
.blog-publication-mark{display:inline-flex;align-items:center;gap:15px;margin-bottom:38px;color:var(--muted);font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.blog-publication-mark strong{padding:7px 11px 6px;border-radius:4px;background:var(--blog-accent);color:#fff;font-size:.64rem;letter-spacing:.16em;transform:rotate(-8deg)}
.blog-kicker{margin:0 0 12px;color:var(--blog-accent-dark);font-size:.74rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.blog-masthead h1{max-width:830px;margin:0;color:var(--ink);font-family:var(--serif);font-size:clamp(3.1rem,6vw,5.7rem);font-weight:400;line-height:.99;letter-spacing:-.045em}
.blog-masthead h1 em{display:block;margin-top:8px;color:var(--blog-accent-dark);font-weight:400}
.blog-lead{max-width:700px;margin:30px 0 0;color:var(--muted);font-size:1.12rem;line-height:1.78}
.blog-stamp{position:relative;z-index:1;justify-self:center;color:rgba(148,94,73,.82);font-family:var(--serif);font-size:3.5rem;letter-spacing:.1em;transform:rotate(-12deg)}
.blog-stamp::before,.blog-stamp::after{position:absolute;left:-18px;right:-18px;height:1px;background:rgba(148,94,73,.42);content:""}.blog-stamp::before{top:-13px}.blog-stamp::after{bottom:-9px}
.blog-section{padding:76px 0 10px}.blog-heading{max-width:780px;margin-bottom:30px}.blog-heading h2,.blog-editorial h2,.blog-related h2{margin:0;color:var(--ink);font-family:var(--serif);font-size:clamp(2.1rem,4vw,3.45rem);font-weight:400;line-height:1.08;letter-spacing:-.03em}.blog-heading>p:not(.blog-kicker){max-width:700px;margin:15px 0 0;color:var(--muted);line-height:1.75}
.blog-featured{display:grid;grid-template-columns:minmax(270px,.72fr) minmax(0,1.28fr);min-height:330px;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius-large);background:#fff;color:inherit;text-decoration:none;box-shadow:var(--shadow-card);transition:transform .2s ease,box-shadow .2s ease}.blog-featured:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(0,0,0,.055)}
.blog-featured-visual{display:flex;flex-direction:column;justify-content:flex-end;padding:40px;background:linear-gradient(150deg,#dadfd4 0%,#aab99e 100%);color:#fff}.blog-featured-visual span,.blog-featured-visual small{font-size:.75rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.blog-featured-visual strong{margin:8px 0 5px;font-family:var(--serif);font-size:clamp(2.4rem,4vw,4.2rem);font-weight:400;line-height:1}.blog-featured-copy{display:flex;flex-direction:column;justify-content:center;padding:48px 52px}.blog-featured-copy h3{max-width:720px;margin:8px 0 16px;font-family:var(--serif);font-size:clamp(2rem,3.3vw,3rem);font-weight:400;line-height:1.13}.blog-featured-copy>p:not(.blog-card-meta){max-width:680px;margin:0 0 22px;color:var(--muted);line-height:1.72}
.blog-card-meta{margin:0;color:var(--blog-accent-dark);font-size:.71rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.blog-link{color:var(--blog-accent-dark);font-weight:750;text-decoration:none}
.blog-pillar{display:grid;grid-template-columns:90px minmax(0,1fr);gap:28px;margin-bottom:18px;padding:40px 44px;border:1px solid rgba(185,120,94,.24);border-radius:var(--radius-large);background:var(--blog-accent-soft)}.blog-pillar-num{color:rgba(148,94,73,.34);font-family:var(--serif);font-size:3.7rem;line-height:1}.blog-pillar h3{margin:8px 0 13px;font-family:var(--serif);font-size:clamp(1.9rem,3vw,2.7rem);font-weight:400;line-height:1.12}.blog-pillar h3 a,.blog-card h3 a{color:inherit;text-decoration:none}.blog-pillar p:not(.blog-card-meta){max-width:830px;color:var(--muted);line-height:1.7}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.blog-card{display:flex;flex-direction:column;min-height:290px;padding:28px;border:1px solid var(--border);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow-card)}.blog-card-index{margin-bottom:30px;color:rgba(185,120,94,.42);font-family:var(--serif);font-size:2.15rem}.blog-card h3{margin:9px 0 13px;font-family:var(--serif);font-size:1.52rem;font-weight:400;line-height:1.18}.blog-card>p:not(.blog-card-meta){margin:0 0 24px;color:var(--muted);line-height:1.68}.blog-card-footer{display:flex;justify-content:space-between;gap:14px;margin-top:auto;padding-top:17px;border-top:1px solid var(--border);color:var(--muted);font-size:.82rem}.blog-card-footer a{color:var(--blog-accent-dark);font-weight:700;text-decoration:none}
.blog-authors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.blog-author-card{display:grid;grid-template-columns:70px minmax(0,1fr);gap:21px;align-items:center;padding:27px 29px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-warm);color:inherit;text-decoration:none}.blog-monogram{display:flex;align-items:center;justify-content:center;width:70px;height:70px;border-radius:50%;background:var(--blog-accent-soft);color:var(--blog-accent-dark);font-family:var(--serif);font-size:2.1rem}.blog-author-card strong,.blog-author-card small,.blog-author-card em{display:block}.blog-author-card strong{font-family:var(--serif);font-size:1.38rem;font-weight:400}.blog-author-card small{margin-top:3px;color:var(--blog-accent-dark);font-size:.75rem;font-weight:700}.blog-author-card em{margin-top:9px;color:var(--muted);font-size:.88rem;font-style:normal;line-height:1.55}
.blog-editorial{margin:70px 0 45px;padding:62px 68px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface-warm)}.blog-editorial>div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:75px}.blog-editorial>div>div{color:var(--muted);line-height:1.78}.blog-editorial>div>div p{margin:0 0 16px}
.blog-breadcrumbs{max-width:980px}.blog-article{max-width:980px;margin:20px auto 0;padding:55px 64px 64px;border:1px solid var(--border);border-radius:var(--radius-large);background:#fff;box-shadow:var(--shadow-soft)}.blog-article-header{position:relative;padding-bottom:34px;margin-bottom:40px;border-bottom:1px solid var(--border)}.blog-article-stamp{position:absolute;top:-6px;right:0;padding:6px 10px 5px;border-radius:4px;background:var(--blog-accent);color:#fff;font-size:.62rem;font-weight:800;letter-spacing:.14em;transform:rotate(-8deg)}.blog-article-header h1{max-width:850px;margin:0;color:var(--ink);font-family:var(--serif);font-size:clamp(2.5rem,5vw,4.3rem);font-weight:400;line-height:1.03;letter-spacing:-.035em}.blog-deck{max-width:790px;margin:22px 0 0;color:var(--muted);font-size:1.13rem;line-height:1.7}
.blog-byline{display:flex;justify-content:space-between;gap:28px;align-items:center;margin-top:28px}.blog-byline-author{display:flex;gap:13px;align-items:center;color:inherit;text-decoration:none}.blog-monogram.small{width:45px;height:45px;font-size:1.35rem}.blog-byline-author strong,.blog-byline-author small{display:block}.blog-byline-author strong{font-family:var(--serif);font-size:1rem;font-weight:400}.blog-byline-author small,.blog-byline-date{color:var(--muted);font-size:.77rem}.blog-byline-date{display:flex;flex-direction:column;gap:3px;text-align:right}
.blog-rich-text{color:var(--text);font-family:var(--serif);font-size:1.09rem;line-height:1.86}.blog-rich-text p{margin:0 0 22px}.blog-rich-text h2{margin:50px 0 18px;color:var(--ink);font-size:1.9rem;font-weight:400;line-height:1.22}.blog-rich-text h3{margin:36px 0 14px;color:var(--ink);font-size:1.44rem;font-weight:400;line-height:1.3}.blog-rich-text a{color:var(--blog-accent-dark);text-decoration-thickness:1px;text-underline-offset:3px}.blog-rich-text ul,.blog-rich-text ol{margin:0 0 25px;padding-left:1.35em}.blog-rich-text li+li{margin-top:8px}.blog-rich-text blockquote{margin:34px 0;padding:23px 27px;border-left:4px solid var(--blog-accent);background:var(--blog-accent-soft);color:#4d4540}
.blog-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:44px;padding-top:24px;border-top:1px solid var(--border)}.blog-tags span{padding:6px 10px;border-radius:999px;background:var(--sage-soft);color:#65745e;font-size:.76rem;font-weight:700}
.blog-author-box{display:grid;grid-template-columns:90px minmax(0,1fr);gap:24px;margin-top:47px;padding:29px;border:1px solid rgba(185,120,94,.22);border-radius:var(--radius);background:var(--blog-accent-soft)}.blog-monogram.large{width:90px;height:90px;font-size:2.7rem}.blog-author-box h2{margin:0 0 8px;font-family:var(--serif);font-size:1.68rem;font-weight:400}.blog-author-box h2 a{color:inherit;text-decoration:none}.blog-author-box p:not(.blog-kicker){margin:0 0 12px;color:var(--muted);line-height:1.65}.blog-related{max-width:1180px;margin:70px auto 30px}.blog-grid-related .blog-card{min-height:260px}
.blog-author-hero{display:grid;grid-template-columns:145px minmax(0,1fr);gap:40px;align-items:center;max-width:1040px;margin:20px auto 0;padding:56px 62px;border:1px solid var(--border);border-radius:var(--radius-large);background:var(--surface-warm)}.blog-monogram.hero{width:145px;height:145px;font-size:4.5rem}.blog-author-hero h1{margin:0;font-family:var(--serif);font-size:clamp(2.8rem,5vw,4.4rem);font-weight:400;line-height:1}.blog-author-role{margin:11px 0 18px;color:var(--blog-accent-dark);font-weight:700}.blog-author-bio{max-width:720px;margin:0;color:var(--muted);font-size:1.02rem;line-height:1.75}.blog-author-posts{max-width:1040px;margin-inline:auto}.blog-empty{padding:34px;border:1px solid var(--border);border-radius:var(--radius);background:#fff;color:var(--muted)}
@media(max-width:900px){.blog-masthead{grid-template-columns:1fr;min-height:0;padding:58px 46px}.blog-stamp{display:none}.blog-featured{grid-template-columns:1fr}.blog-featured-visual{min-height:210px}.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.blog-grid>:last-child{grid-column:1/-1}.blog-editorial>div{grid-template-columns:1fr;gap:28px}.blog-article{padding:44px 40px 49px}.blog-author-hero{grid-template-columns:105px 1fr;padding:44px}.blog-monogram.hero{width:105px;height:105px;font-size:3.3rem}}
@media(max-width:760px){.brand-blog-ribbon{top:-3px;right:-15px;font-size:.54rem}.blog-masthead{margin-top:18px;padding:42px 25px 47px}.blog-masthead h1{font-size:clamp(2.6rem,14vw,3.9rem)}.blog-lead{font-size:1rem}.blog-section{padding-top:56px}.blog-featured-copy,.blog-featured-visual{padding:28px 24px}.blog-pillar{grid-template-columns:1fr;gap:10px;padding:26px 24px}.blog-grid,.blog-authors{grid-template-columns:1fr}.blog-grid>:last-child{grid-column:auto}.blog-card{min-height:0;padding:24px}.blog-editorial{margin-top:54px;padding:43px 24px}.blog-article{padding:37px 23px 43px}.blog-article-stamp{position:static;display:inline-block;margin-bottom:20px}.blog-byline{align-items:flex-start;flex-direction:column}.blog-byline-date{text-align:left}.blog-rich-text{font-size:1.02rem;line-height:1.78}.blog-author-box{grid-template-columns:1fr}.blog-author-hero{grid-template-columns:1fr;gap:24px;padding:36px 24px}.blog-monogram.hero{width:90px;height:90px;font-size:2.7rem}.blog-author-card{grid-template-columns:58px 1fr;padding:22px}.blog-monogram{width:58px;height:58px;font-size:1.8rem}}
