:root {
    --ros26-red: #d70713;
    --ros26-red-bright: #ef101b;
    --ros26-ink: #111111;
    --ros26-footer: #1b1b1b;
    --ros26-gray: #686868;
    --ros26-muted: #767676;
    --ros26-pale: #e8e5e5;
    --ros26-line: #cfcfcf;
    --ros26-white: #ffffff;
    --ros26-display: "gamay", Arial, Helvetica, sans-serif;
    --ros26-body: Arial, Helvetica, sans-serif;
    --ros26-site: 1540px;
    --ros26-text: 1280px;
    --ros26-focus: #ffffff;
}

body {
    color: var(--ros26-ink);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid var(--ros26-red);
    outline-offset: 3px;
}

.ros-container {
    width: min(var(--ros26-site), calc(100% - 48px));
    margin-inline: auto;
}

.ros-text-container {
    width: min(var(--ros26-text), calc(100% - 48px));
    margin-inline: auto;
}

.ros-red {
    color: var(--ros26-red);
}

.ros-btn {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 11px 22px;
    border: 0;
    border-radius: 0;
    background: var(--ros26-red);
    color: var(--ros26-white) !important;
    font-family: var(--ros26-body);
    font-size: 1.3rem;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.ros-btn:hover,
.ros-btn:focus {
    background: var(--ros26-ink);
    color: var(--ros26-white) !important;
}

.ros-title {
    font-family: var(--ros26-display);
    font-size: clamp(3.6rem, 4.4vw, 7.2rem);
    font-weight: 900;
    line-height: .95;
    text-transform: uppercase;
    text-wrap: balance;
}

.ros-section-title {
    font-family: var(--ros26-display);
    font-size: clamp(3.2rem, 3.6vw, 5.8rem);
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
    text-wrap: balance;
    color: var(--basecolor);
}

.ros-section-title strong {
    font-weight: 900;
}

.ros-media {
    display: block;
    overflow: hidden;
    background: #d2d2d2;
}

.ros-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.ros-hero {
    position: relative;
    min-height: clamp(430px, 42vw, 620px);
    display: flex;
    align-items: center;
    overflow: hidden;
    color: var(--ros26-white);
}

.ros-hero__media {
    position: absolute;
    inset: 0;
    background-position: center;
    background-size: cover;
}

.ros-hero__content {
    position: relative;
    z-index: 2;
}

.ros-hero h1 {
    max-width: 820px;
    margin: 0 0 18px;
    color: var(--ros26-white);
    font-family: var(--ros26-display);
    font-size: clamp(4.4rem, 5vw, 8rem);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: 0;
    text-transform: uppercase;
    text-wrap: balance;
}

.ros-hero p {
    max-width: 720px;
    margin: 0 0 22px;
    color: var(--ros26-white);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.45;
    text-transform: uppercase;
}

.ros-site-header {
    display: block;
    position: relative;
    z-index: 50;
    background: var(--ros26-red);
    color: var(--ros26-white);
}

/* Quando la ricerca istantanea è aperta, l'header (con l'overlay
   risultati) deve stare sopra al backdrop scuro (z-index 1000) */
.ros-site-header.search-focus {
    z-index: 1001;
}

/* L'overlay risultati è dentro l'header (testo bianco): forza testo scuro
   sullo sfondo bianco del dropdown, così nomi/codici prodotto sono leggibili */
.ros-site-header .search-bar {
    color: var(--ros26-ink);
}

.ros-site-header .search-bar .result-item,
.ros-site-header .search-bar .result-item-prod,
.ros-site-header .search-bar .link-search {
    color: var(--ros26-ink);
}

.ros-site-header__inner {
    min-height: 84px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 18px;
    align-items: center;
}

/* Nav centrata rispetto allo schermo tramite griglia simmetrica (1fr auto 1fr):
   NIENTE transform/absolute, altrimenti si crea un containing block che rompe
   il posizionamento a tutta larghezza del mega-menu categorie. */
.ros-site-header__inner > .ros-logo {
    grid-column: 1;
    justify-self: start;
}

.ros-site-header__inner > .ros-main-nav {
    grid-column: 2;
}

.ros-site-header__inner > .ros-header-tools {
    grid-column: 3;
    justify-self: end;
}

.ros-logo img {
    width: 104px;
    height: auto;
    display: block;
}

.ros-main-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(32px, 4vw, 58px);
    background-color: var(--ros26-red);
}

.ros-main-nav a,
.ros-shop-trigger {
    color: var(--ros26-white);
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.ros-main-nav a:hover,
.ros-shop-trigger:hover {
    color: var(--ros26-white);
    opacity: .78;
}

.ros-nav-shop {
    height: 84px;
    display: flex;
    align-items: center;
}

.ros-mega-categories {
    position: absolute;
    z-index: 45;
    top: 100%;
    left: 0;
    width: 100%;
    padding: 24px 0 22px;
    background: var(--ros26-white);
    box-shadow: 0 14px 30px rgba(0, 0, 0, .16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity .18s ease-out, transform .18s ease-out, visibility .18s;
}

.ros-nav-shop:hover .ros-mega-categories,
.ros-nav-shop:focus-within .ros-mega-categories {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.ros-mega-categories ul {
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 18px;
    list-style: none;
}

.ros-mega-categories li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    color: var(--ros26-ink);
    text-align: center;
}

.ros-mega-categories__thumb {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    background-color: #efefef;
    background-position: center;
    background-size: cover;
}

.ros-mega-categories__label {
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.ros-mega-categories li a:hover .ros-mega-categories__label {
    color: var(--ros26-red);
}

.ros-header-tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.ros-search {
    width: 200px;
    height: 30px;
    display: flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 999px;
    overflow: hidden;
}

.ros-search button {
    width: 28px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: var(--ros26-white);
    font-size: 1.2rem;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

.ros-search__icon {
    display: block;
    width: 15px;
    height: 15px;
    background-color: var(--ros26-white);
    -webkit-mask: url("../img/search.svg") center / contain no-repeat;
    mask: url("../img/search.svg") center / contain no-repeat;
}

.ros-search input {
    min-width: 0;
    flex: 1;
    border: 0;
    background: transparent;
    color: var(--ros26-white);
    font-size: 1.3rem;
    line-height: 1;
}

.ros-search input::placeholder {
    color: rgba(255, 255, 255, .92);
}

.ros-right-menu {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ros-right-menu .icon {
    position: relative;
    width: 21px;
    height: 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
}

.ros-right-menu .icon img {
    width: 17px;
    height: 17px;
    filter: brightness(0) invert(1);
}

.ros-right-menu .number {
    position: absolute;
    top: -9px;
    right: -10px;
    min-width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ros26-ink);
    color: var(--ros26-white);
    font-size: .8rem;
    font-weight: 900;
}

.ros-right-menu .dropdown > a {
    width: 21px;
    height: 21px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: var(--ros26-white);
    font-size: 0;
    font-weight: 700;
}

.ros-right-menu .dropdown > a::before {
    content: "";
    width: 17px;
    height: 17px;
    display: block;
    background: url("../img/user.svg") center / contain no-repeat;
    filter: brightness(0) invert(1);
}

.ros-right-menu .submenu {
    right: 0;
}

.ros-header-socials {
    display: flex;
    align-items: center;
    gap: 9px;
}

.ros-header-socials span {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ros26-white);
}

.ros-header-socials img {
    width: 12px;
    height: 12px;
    object-fit: contain;
}

.ros-mobile-toggle {
    display: none;
    width: 38px;
    height: 38px;
    margin-left: auto;
    border: 1px solid rgba(255, 255, 255, .72);
    background: transparent;
    color: var(--ros26-white);
    font-size: 2rem;
    line-height: 1;
}

.ros-mobile-panel {
    display: none;
}

.ros-shop-nav {
    background: var(--ros26-white);
    border-bottom: 1px solid #ededed;
}

.ros-shop-nav ul {
    min-height: 84px;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    list-style: none;
}

.ros-shop-nav a {
    color: var(--ros26-ink);
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.ros-footer {
    padding: 56px 0 30px;
    background: var(--ros26-footer);
    color: #e9e9e9;
    margin: 0;
}

.ros-footer__logo {
    width: 210px;
    margin: 0 auto 42px;
}

.ros-footer__logo img {
    width: 100%;
}

.ros-footer__grid {
    display: grid;
    grid-template-columns: 1.25fr 1fr .95fr 1fr;
    gap: clamp(28px, 4vw, 58px);
}

.ros-footer__grid section {
    padding: 0;
}

.ros-footer h3 {
    margin: 0 0 22px;
    color: var(--ros26-white);
    font-family: var(--ros26-display);
    font-size: 1.7rem;
    font-weight: 400;
}

.ros-footer p,
.ros-footer li,
.ros-footer a {
    color: #d0d0d0;
    font-size: 1.2rem;
    line-height: 2;
}

.ros-footer ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ros-footer a:hover {
    color: var(--ros26-white);
}

.ros-footer__socials {
    display: flex;
    gap: 10px;
    margin-top: 18px;
}

.ros-footer__socials img {
    width: 29px;
    height: 29px;
    filter: grayscale(1);
}

.ros-footer__legal {
    margin: 38px 0 0;
    color: #ababab;
    font-size: 1rem;
    line-height: 1.6;
    text-align: center;
}

.ros-intro {
    padding: clamp(70px, 7vw, 110px) 0 clamp(50px, 5vw, 70px);
    text-align: center;
}

.ros-intro h2 {
    margin: 0 auto 30px;
    color: var(--ros26-red);
    font-family: var(--ros26-display);
    font-size: clamp(2.8rem, 3vw, 4.2rem);
    font-weight: 900;
    line-height: 1.08;
    text-transform: uppercase;
    text-wrap: balance;
}

.ros-intro p {
    max-width: 1060px;
    margin: 0 auto;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.5;
    text-transform: uppercase;
}

.ros-category-mosaic {
    padding: 44px 0 88px;
}

.ros-category-mosaic h2 {
    margin: 0 0 18px;
    color: var(--ros26-ink);
    text-align: center;
}

.ros-category-mosaic__subtitle {
    margin: 0 0 48px;
    text-align: center;
    font-weight: 700;
    text-transform: uppercase;
}

/* Marquee (scorrimento in loop) riusabile per titoli e liste brevi */
.ros-marquee {
    overflow: hidden;
}

.ros-marquee__track {
    display: flex;
    width: max-content;
    animation: ros-marquee-scroll 24s linear infinite;
    margin-bottom: 30px;
}

.ros-marquee:hover .ros-marquee__track,
.ros-marquee:focus-within .ros-marquee__track {
    animation-play-state: paused;
}

@keyframes ros-marquee-scroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-33.3334%);
    }
}

h2.ros-marquee {
    text-align: left;
}

.ros-marquee__item {
    flex: 0 0 auto;
    padding: 0;
    white-space: nowrap;
}

.ros-marquee__sep {
    display: inline-block;
    padding: 0 .42em;
    color: var(--ros26-ink);
}

.ros-mosaic {
    width: min(1060px, calc(100% - 32px));
    height: clamp(900px, 86vw, 1260px);
    margin: 0 auto 38px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(40, 1fr);
}

.ros-mosaic__tile {
    position: relative;
    overflow: hidden;
    display: block;
    background-position: center;
    background-size: cover;
}

/* L'immagine è un layer separato (eredita il background inline della tile):
   allo hover zooma solo questa, mentre il box e l'etichetta restano fermi. */
.ros-mosaic__tile::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: inherit;
    background-position: center;
    background-size: cover;
    transition: transform .5s ease;
}

.ros-mosaic__tile:hover::after,
.ros-mosaic__tile:focus-visible::after {
    transform: scale(1.08);
}

.ros-mosaic__tile::before {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    background: rgba(0, 0, 0, .25);
}

.ros-mosaic__tile span {
    position: absolute;
    z-index: 1;
    color: var(--ros26-white);
    font-family: var(--ros26-display);
    /* Dimensione uniforme (grande) per tutte le categorie, mise inclusa.
       L'altezza del mosaico è calibrata perché "MISE EN PLACE" verticale ci stia. */
    font-size: clamp(4.4rem, 5vw, 7rem);
    font-weight: 900;
    line-height: .9;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Colonna sinistra (3 tile) e destra (4 tile) con giunzioni sfalsate */
.ros-mosaic__mise {
    grid-column: 1;
    grid-row: 1 / 18;
}

.ros-mosaic__bar {
    grid-column: 1;
    grid-row: 18 / 25;
}

.ros-mosaic__pizzeria {
    grid-column: 1;
    grid-row: 25 / 41;
}

.ros-mosaic__hotellerie {
    grid-column: 2;
    grid-row: 1 / 10;
}

.ros-mosaic__cucina {
    grid-column: 2;
    grid-row: 10 / 23;
}

.ros-mosaic__catering {
    grid-column: 2;
    grid-row: 23 / 31;
}

.ros-mosaic__delivery {
    grid-column: 2;
    grid-row: 31 / 41;
}

.ros-mosaic__vertical-left {
    left: 18px;
    bottom: 18px;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

.ros-mosaic__vertical-right {
    right: 14px;
    bottom: 18px;
    writing-mode: vertical-rl;
}

.ros-mosaic__bottom {
    left: 22px;
    bottom: 18px;
}

.ros-mosaic__center {
    left: 22px;
    top: 50%;
    transform: translateY(-50%);
}

.ros-services {
    padding: clamp(70px, 7vw, 96px) 0;
    background: #171717 center / cover no-repeat;
    color: var(--ros26-white);
    text-align: center;
    margin-bottom: 5rem;
}

.ros-services h2 {
    margin-bottom: 34px;
    color: var(--ros26-white);
}

.ros-service-lines {
    width: min(760px, 100%);
    margin: 0 auto 30px;
}

.ros-service-lines p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0;
    padding: 16px 0;
    border-bottom: 1px solid #555555;
    color: var(--ros26-white);
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: uppercase;
}

/* Home: sezione servizi con testi centrati (senza il "+" dell'About) */
.ros-services--center .ros-service-lines p {
    justify-content: center;
    text-align: center;
}

.ros-service-toggle {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border: 1px solid #666666;
    background: transparent;
    color: var(--ros26-white);
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
    transition: background .3s ease, border-color .3s ease;
}

.ros-service-toggle:hover,
.ros-service-toggle:focus-visible {
    background: var(--ros26-red);
    border-color: var(--ros26-red);
}

/* Dettaglio servizio: sostituisce l'elenco (stessa struttura di "Da dove nasce
   ROS" — immagine a sinistra, testo a destra) con una X in alto a destra
   dell'immagine per tornare all'elenco. */
.ros-service-detail {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(34px, 5vw, 74px);
    align-items: start;
    text-align: left;
}

.ros-service-detail[hidden] {
    display: none;
}

.ros-service-detail__media {
    position: relative;
    z-index: 2;
    align-self: start;
    height: clamp(380px, 36vw, 400px);
    /* Come "Da dove nasce ROS": l'immagine sborda sotto la sezione restando
       allineata in alto al testo (il margine negativo toglie l'eccedenza dal
       calcolo della riga). */
    margin-bottom: calc(-1 * clamp(140px, 13vw, 190px));
}

.ros-service-detail__close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    background: var(--ros26-red);
    border-color: var(--ros26-red);
    color: var(--ros26-white);
}

.ros-service-detail__close:hover,
.ros-service-detail__close:focus-visible {
    background: var(--ros26-red-bright);
    border-color: var(--ros26-red-bright);
}

.ros-service-detail p {
    margin: 0;
    align-self: start;
    color: var(--ros26-white);
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.5;
    text-transform: uppercase;
}

.ros-wide-image {
    height: clamp(280px, 28vw, 430px);
    background-position: center;
    background-size: cover;
}

@media (min-width: 1024px) {
    .ros-wide-image {
        background-attachment: fixed;
    }
}

.ros-brands {
    padding: clamp(72px, 8vw, 110px) 0;
    text-align: center;
}

.ros-brand-list {
    margin: 48px auto 70px;
}

.ros-brand-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 26px 48px;
}

.ros-brand-list.slick-initialized {
    display: block;
    flex-wrap: nowrap;
}

.ros-brand-list .slick-track {
    display: flex;
    align-items: center;
}

.ros-brand-list .slick-slide {
    display: flex;
    align-items: center;
    justify-content: center;
}

.ros-brand-list .slick-slide > div {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ros-brand-list .brand-item {
    width: 100%;
    max-width: 180px;
}

.ros-brand-list .brand-item img {
    width: 100%;
    max-height: 180px;
    object-fit: contain;
}

.ros-instagram-title {
    margin-top: 110px;
}

.ros-instagram-grid {
    margin-top: 50px;
}

.ros-instagram-grid .lightwidget-widget {
    min-height: 220px;
}

.ros-about-origin {
    position: relative;
    padding: 50px 0 clamp(48px, 5vw, 72px);
    background: var(--ros26-red) center / cover no-repeat;
    color: var(--ros26-white);
    box-shadow: inset 0 18px 30px -14px rgba(0, 0, 0, .35);
}

.ros-about-origin h2 {
    margin: 0 0 clamp(26px, 3vw, 38px);
    color: var(--ros26-white);
    text-align: center;
}

.ros-origin-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(34px, 5vw, 74px);
    align-items: start;
}

.ros-origin-grid .ros-media {
    position: relative;
    z-index: 2;
    align-self: start;
    height: clamp(380px, 36vw, 500px);
    /* L'immagine sborda sotto la sezione restando allineata in alto al testo:
       il margine negativo toglie l'eccedenza dal calcolo della riga, così il
       bordo superiore resta al top del paragrafo e il resto "cola" nella
       sezione successiva. */
    margin-bottom: calc(-1 * clamp(150px, 14vw, 200px));
}

.ros-origin-grid p {
    margin: 0;
    align-self: start;
    color: var(--ros26-white);
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.5;
    text-transform: uppercase;
}

.ros-stats {
    padding: clamp(120px, 12vw, 170px) 0 70px 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(22px, 5vw, 72px);
    text-align: center;
}

.ros-stat-arrow {
    display: block;
    width: 22px;
    height: 22px;
    margin: 0 auto 14px;
    rotate: 180deg;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d70713' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center / contain no-repeat;
}

.ros-stat-value {
    color: var(--ros26-ink);
    font-family: var(--ros26-display);
    font-size: clamp(2.3rem, 2.2vw, 3.2rem);
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.ros-stat-label {
    margin-top: 8px;
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
}

.ros-timeline {
    padding: 64px 0;
    background: #dedede;
}

.ros-timeline__grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
}

.ros-timeline__item {
    display: grid;
    grid-template-rows: 180px 58px 180px;
}

.ros-timeline__card {
    width: calc(100% - 24px);
    align-self: end;
    justify-self: center;
}

.ros-timeline__item:nth-child(even) .ros-timeline__card {
    grid-row: 3;
    align-self: start;
}

.ros-timeline__year {
    grid-row: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ros26-red-bright);
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%, 18px 50%);
    color: var(--ros26-white);
    font-family: var(--ros26-display);
    font-size: 2.8rem;
    font-weight: 900;
}

.ros-timeline__media {
    height: 112px;
}

.ros-timeline__card p {
    min-height: 72px;
    margin: 0;
    padding: 10px;
    background: #282828;
    color: var(--ros26-white);
    font-size: 1.1rem;
    line-height: 1.35;
}

.ros-selling-points {
    padding: 62px 0;
}

.ros-selling-points .ros-marquee__track {
    animation-duration: 20s;
}

.ros-selling-point {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: clamp(240px, 22vw, 340px);
    font-family: var(--ros26-display);
    font-size: clamp(2rem, 2vw, 2.7rem);
    font-weight: 900;
    line-height: .95;
    text-transform: uppercase;
}

.ros-selling-point::before {
    content: "";
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    background: url("../img/nuove/about/6.svg") center / contain no-repeat;
}

.ros-promo-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.ros-promo {
    position: relative;
    min-height: clamp(360px, 34vw, 520px);
    overflow: hidden;
    color: var(--ros26-white);
}

.ros-promo::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(0, 0, 0, .35);
}

.ros-promo .ros-media {
    position: absolute;
    inset: 0;
}

.ros-promo h2 {
    position: relative;
    z-index: 2;
    margin: 34px;
    color: var(--ros26-white);
    font-family: var(--ros26-display);
    font-size: clamp(5rem, 6vw, 15rem);
    font-weight: 900;
    line-height: .88;
    text-transform: uppercase;
}

.ros-promo a {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ros26-red);
    color: var(--ros26-white);
    font-size: 1.6rem;
    font-weight: 900;
    text-transform: uppercase;
}

.ros-promo:nth-child(2) a {
    background: #666666;
}

.ros-promo__hover-copy {
    position: absolute;
    z-index: 2;
    left: 34px;
    right: 34px;
    bottom: 82px;
    margin: 0;
    color: var(--ros26-white);
    font-size: clamp(1.6rem, 1.5vw, 1.9rem);
    font-weight: 600;
    line-height: 1.5;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .35s ease, transform .35s ease;
}

.ros-promo:hover::before {
    background: rgba(0, 0, 0, .55);
}

.ros-promo:hover .ros-promo__hover-copy,
.ros-promo:focus-within .ros-promo__hover-copy {
    opacity: 1;
    transform: translateY(0);
}

.ros-contact-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    color: var(--ros26-white);
}

.ros-contact-panel {
    min-height: 500px;
    padding: clamp(38px, 5vw, 70px) clamp(34px, 8vw, 150px);
    background: #242424;
}

.ros-contact-panel:nth-child(2) {
    background: #191919;
}

.ros-contact-panel h1 {
    margin: 0 0 60px;
    color: var(--ros26-white);
    font-family: var(--ros26-display);
    font-size: clamp(4.4rem, 5vw, 7.8rem);
    font-weight: 300;
    line-height: 1;
    text-transform: uppercase;
}

.ros-contact-panel h1 strong {
    color: var(--ros26-red);
    font-weight: 500;
}

.ros-contact-pin {
    display: inline-block;
    margin-right: 12px;
    vertical-align: middle;
    color: #9a9a9a;
}

.ros-contact-pin svg {
    display: block;
    width: 30px;
    height: 30px;
}

.ros-contact-panel address,
.ros-contact-panel p {
    color: var(--ros26-white);
    font-size: clamp(1.8rem, 1.7vw, 2.4rem);
    font-style: normal;
    font-weight: 600;
    line-height: 1.45;
    text-transform: uppercase;
}

.ros-contact-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.ros-contact-actions a {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: var(--ros26-red-bright);
    color: var(--ros26-white);
    font-size: 1.9rem;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.ros-contact-actions a:nth-child(2) {
    background: #666666;
}

.ros-map iframe {
    display: block;
    width: 100%;
    height: 360px;
    border: 0;
}

.ros-contact-form {
    padding: clamp(44px, 4.5vw, 64px) 0 clamp(44px, 4.5vw, 60px);
    text-align: center;
}

.ros-contact-form p,
.ros-showroom-copy p {
    max-width: 1050px;
    margin: 14px auto 0;
    font-size: clamp(1.8rem, 1.6vw, 2.3rem);
    font-weight: 600;
    line-height: 1.45;
    text-transform: uppercase;
}

.ros-contact-form #frm-contact {
    margin-top: 32px;
    text-align: left;
}

.ros-contact-form #frm-contact .col-md-4 {
    margin-bottom: 12px;
}

.ros-contact-form #frm-contact .form-control {
    width: 100%;
    height: 46px;
    padding: 0 18px;
    border: 1px solid var(--ros26-line);
    border-radius: 0;
    background: var(--ros26-white);
    color: var(--ros26-ink);
    font-family: inherit;
    font-size: 1.4rem;
    box-shadow: none;
}

.ros-contact-form #frm-contact .form-control::placeholder {
    color: #8a8a8a;
    font-size: 1.2rem;
    font-weight: 600;
    text-transform: uppercase;
}

.ros-contact-form #frm-contact .form-control:focus {
    border-color: var(--ros26-red);
    outline: none;
    box-shadow: none;
}

.ros-contact-form #frm-contact button[type="submit"] {
    width: 100%;
    height: 46px;
    border: 0;
    background: var(--ros26-red);
    color: var(--ros26-white);
    font-size: 1.3rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .3s ease;
}

.ros-contact-form #frm-contact button[type="submit"]:hover {
    background: var(--ros26-red-bright);
}

.ros-privacy-note {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-top: 16px;
    text-align: left;
}

.ros-privacy-box {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-top: 2px;
    border: 1px solid var(--ros26-line);
    background: var(--ros26-white);
}

.ros-privacy-text {
    color: var(--ros26-muted);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.6;
    text-transform: uppercase;
}

.ros-showroom-copy {
    padding: 50px 0 70px;
    text-align: center;
}

.ros-catalog-hero {
    min-height: clamp(360px, 34vw, 560px);
}

.ros-catalog {
    position: relative;
    padding: 54px 0 110px;
}

.ros-catalog-layout {
    display: grid;
    grid-template-columns: minmax(220px, 280px) 1fr;
    gap: 36px;
}

/* Barra con conteggio prodotti + pulsante Filtri (pulsante solo mobile) */
.ros-catalog-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
}

.ros-filter-toggle,
.ros-filter-close,
.ros-filter-drawer-head,
.ros-filter-backdrop {
    display: none;
}

.ros-filter-title {
    margin: 0 0 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--ros26-red);
    color: var(--ros26-red);
    font-family: var(--ros26-display);
    font-size: 1.6rem;
    font-weight: 900;
    text-transform: uppercase;
}

.ros-sidebar ul {
    margin: 0 0 36px;
    padding: 0;
    list-style: none;
}

.ros-sidebar li a {
    display: inline-flex;
    padding: 5px 0;
    color: var(--ros26-ink);
    font-size: 1.2rem;
    font-weight: 600;
}

.ros-sidebar li a.active,
.ros-sidebar li a:hover {
    color: var(--ros26-red);
}

.ros-widget-filter {
    margin-bottom: 30px;
}

.ros-widget-filter .title-filter {
    margin-bottom: 10px;
    color: var(--ros26-ink);
    font-family: var(--ros26-display);
    font-size: 1.5rem;
    font-weight: 900;
    text-transform: uppercase;
}

.ros-widget-filter .list-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ros-widget-filter .list-filter div {
    padding: 6px 9px;
    border: 1px solid #dedede;
    color: var(--ros26-ink);
    cursor: pointer;
    font-size: 1.1rem;
    font-weight: 600;
}

.ros-widget-filter .list-filter div.active {
    border-color: var(--ros26-red);
    background: var(--ros26-red);
    color: var(--ros26-white);
}

.ros-catalog-info {
    margin-bottom: 0;
    color: var(--ros26-red);
    font-family: var(--ros26-display);
    font-size: 1.8rem;
    font-weight: 900;
    text-transform: uppercase;
}

.ros-product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--ros26-line);
    border-left: 1px solid var(--ros26-line);
}

.ros-product-card {
    position: relative;
    min-height: 348px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--ros26-line);
    border-bottom: 1px solid var(--ros26-line);
    background: var(--ros26-white);
}

.ros-product-card .badge-priority {
    position: absolute;
    z-index: 2;
    top: 8px;
    left: 8px;
    padding: 4px 8px;
    background: var(--ros26-ink);
    color: var(--ros26-white);
    font-size: 1rem;
}

.ros-product-card .badge-list {
    position: absolute;
    z-index: 2;
    top: 8px;
    left: 8px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    padding: 0;
}

.ros-product-card .badge-list-item {
    padding: 4px 7px;
    background: var(--ros26-red);
    color: var(--ros26-white);
    font-size: .9rem;
    font-weight: 800;
    text-transform: uppercase;
}

.ros-product-card .favorites,
.ros-product-card .favorites-add {
    position: absolute;
    z-index: 3;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
}

.ros-product-card .favorites,
.ros-product-actions .favorites {
    background-image: url("../img/nuove/preferiti-piena.svg");
}

.ros-product-card .favorites-add,
.ros-product-actions .favorites-add {
    background-image: url("../img/nuove/preferiti-vuota.svg");
}

.ros-product-card__image {
    height: 225px;
    padding: 24px;
    background: var(--ros26-white);
}

.ros-product-card__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.ros-product-card__body {
    position: relative;
    min-height: 124px;
    flex: 1;
    padding: 15px 13px 44px;
}

.ros-product-card__title {
    margin: 0 0 9px;
    color: var(--ros26-red);
    font-family: var(--ros26-display);
    font-size: 1.4rem;
    font-weight: 900;
    line-height: 1.08;
    text-transform: uppercase;
}

.ros-product-card__code {
    color: var(--ros26-ink);
    font-size: 1rem;
    font-weight: 700;
}

.ros-product-card__footer-left {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ros-product-card__footer {
    position: absolute;
    left: 13px;
    right: 13px;
    bottom: 10px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}

.ros-product-card__price {
    color: var(--ros26-ink);
    font-size: 1.4rem;
    font-weight: 900;
}

.ros-product-card__price span {
    margin-right: 5px;
    color: var(--ros26-muted);
    font-size: 1.1rem;
    text-decoration: line-through;
}

.ros-product-card__more {
    color: var(--ros26-ink);
    font-size: 1rem;
    font-weight: 800;
    text-decoration: underline;
    text-transform: uppercase;
}

.ros-pagination {
    margin-top: 46px;
}

.ros-pagination ul {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    gap: 10px;
    list-style: none;
}

.ros-pagination a,
.ros-pagination span {
    min-width: 34px;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--ros26-line);
    color: var(--ros26-ink);
    font-weight: 800;
}

.ros-pagination .current {
    border-color: var(--ros26-red);
    background: var(--ros26-red);
    color: var(--ros26-white);
}

.ros-other-categories {
    padding: 72px 0 58px;
    background: var(--ros26-pale);
}

.ros-other-categories h2 {
    margin: 0 0 48px;
    color: var(--ros26-ink);
    font-family: var(--ros26-display);
    font-size: 2.8rem;
    font-weight: 400;
    text-transform: uppercase;
}

.ros-category-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
}

.ros-category-cards.ros-categories-slider {
    display: block;
}

.ros-category-cards.ros-categories-slider .ros-category-card {
    margin: 0 14px;
}

.ros-category-cards.ros-categories-slider .slick-list {
    margin: 0 -14px;
}

.ros-category-cards.ros-categories-slider {
    margin-bottom: 44px;
}

.ros-category-cards.ros-categories-slider .slick-dots {
    bottom: -40px;
    display: flex;
    justify-content: center;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ros-category-cards.ros-categories-slider .slick-dots li {
    width: auto;
    height: auto;
    margin: 0;
}

.ros-category-cards.ros-categories-slider .slick-dots li button {
    width: 12px;
    height: 12px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--ros26-red);
    background: transparent;
}

.ros-category-cards.ros-categories-slider .slick-dots li button::before {
    content: none;
}

.ros-category-cards.ros-categories-slider .slick-dots li.slick-active button {
    background: var(--ros26-red);
}

.ros-category-card {
    position: relative;
    min-height: 320px;
    display: block;
    background-position: center;
    background-size: cover;
}

/* Sfondi categoria definiti via classe: slick riscrive lo style inline delle
   slide (width/display) cancellando il background-image inline, quindi la
   regola CSS garantisce che l'immagine resti sempre visibile. */
.ros-category-card--mise-en-place { background-image: url("../img/nuove/categorie/ROS_IMG-MENU-e-CATEGORIA_MISE-EN-PLACE.jpg"); }
.ros-category-card--hotellerie { background-image: url("../img/nuove/categorie/ROS_IMG-MENU-e-CATEGORIA_HOTELLERIE.jpg"); }
.ros-category-card--cucina { background-image: url("../img/nuove/categorie/ROS_IMG-MENU-e-CATEGORIA_CUCINA.jpg"); }
.ros-category-card--bar { background-image: url("../img/nuove/categorie/ROS_IMG-MENU-e-CATEGORIA_BAR.jpg"); }
.ros-category-card--catering { background-image: url("../img/nuove/categorie/ROS_IMG-MENU-e-CATEGORIA_CATERING.jpg"); }
.ros-category-card--pizzeria { background-image: url("../img/nuove/categorie/ROS_IMG-MENU-e-CATEGORIA_PIZZERIA.jpg"); }
.ros-category-card--delivery { background-image: url("../img/nuove/categorie/ROS_IMG-MENU-e-CATEGORIA_DELIVERY.jpg"); }

.ros-category-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .18);
}

.ros-category-card span {
    position: absolute;
    z-index: 1;
    left: 50%;
    bottom: 24px;
    min-width: 150px;
    transform: translateX(-50%);
    padding: 10px 18px;
    border: 1px solid var(--ros26-red);
    background: var(--ros26-white);
    color: var(--ros26-ink);
    font-family: var(--ros26-display);
    font-size: 1.2rem;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.ros-product-detail {
    padding: 110px 0 72px !important;
}

.ros-product-main {
    display: grid;
    grid-template-columns: 1.02fr .98fr;
    gap: clamp(36px, 5vw, 72px);
    align-items: start;
}

.ros-product-image {
    position: relative;
    min-height: clamp(440px, 45vw, 680px);
    padding: 38px;
    border: 2px solid var(--ros26-red);
    display: flex;
    align-items: center;
}

.ros-product-image .badge-list {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 0;
}

.ros-product-image .badge-list-item {
    padding: 5px 8px;
    background: var(--ros26-red);
    color: var(--ros26-white);
    font-size: 1rem;
    font-weight: 900;
    text-transform: uppercase;
}

.ros-product-image img {
    width: 100%;
    height: 100%;
    max-height: 350px;
    object-fit: contain;
}

.ros-product-fav-row {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 14px;
}

.ros-product-fav {
    width: 44px;
    height: 44px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 22px;
    cursor: pointer;
    transition: border-color .2s ease;
}

.ros-product-fav:hover {
    border-color: var(--ros26-red);
}

.ros-product-fav.favorites {
    background-image: url("../img/nuove/preferiti-piena.svg");
}

.ros-product-fav.favorites-add {
    background-image: url("../img/nuove/preferiti-vuota.svg");
}

.ros-product-info h1 {
    margin: 0 0 42px;
    color: var(--ros26-red);
    font-family: var(--ros26-display);
    font-size: clamp(3.2rem, 3vw, 4.2rem);
    font-weight: 900;
    line-height: 1.12;
    text-transform: uppercase;
    text-wrap: balance;
}

.ros-product-description {
    max-width: 640px;
    margin-bottom: 36px;
    font-size: clamp(1.7rem, 1.5vw, 1.8rem);
    line-height: 1.35;
}

.ros-product-buy {
    display: grid;
    gap: 24px;
    margin-bottom: 30px;
}

.ros-product-buy .variant-box,
.ros-product-buy .qnt-box {
    margin: 0;
}

.ros-product-buy .label {
    margin-bottom: 8px;
    color: var(--ros26-ink);
    font-family: var(--ros26-display);
    font-size: 1.5rem;
    font-weight: 900;
    text-transform: uppercase;
}

.ros-product-buy .input-desc {
    display: flex;
    align-items: center;
    gap: 14px;
}

.ros-product-buy input,
.ros-product-buy select {
    max-width: 180px;
    height: 44px;
    border-color: var(--ros26-red);
}

.ros-price-box {
    margin: 0 0 26px;
}

.ros-price-box .label {
    color: var(--ros26-muted);
    font-size: 1.2rem;
    font-weight: 800;
    text-transform: uppercase;
}

.ros-price-box .price {
    color: var(--ros26-ink);
    font-size: 2.7rem;
    font-weight: 900;
}

.ros-price-box .price span {
    margin-right: 10px;
    color: var(--ros26-muted);
    font-size: 1.6rem;
    text-decoration: line-through;
}

.ros-product-actions {
    display: flex;
    align-items: center;
    gap: 18px;
}

.ros-product-actions .btn-favorites > div {
    width: 42px;
    height: 42px;
    border: 1px solid var(--ros26-line);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 18px;
}

.ros-product-sku {
    margin-top: 30px;
    font-size: 1.8rem;
    font-weight: 800;
    text-decoration: underline;
    text-transform: uppercase;
}

.ros-product-features {
    padding: 0 0 60px 0;
}

.ros-product-features h2 {
    margin: 0 0 24px;
    padding: 14px 20px;
    background: var(--ros26-red);
    color: var(--ros26-white);
    font-family: var(--ros26-display);
    font-size: 2rem;
    font-weight: 900;
    text-transform: uppercase;
}

.ros-product-features ul {
    margin: 0;
    padding: 0 4px;
    list-style: none;
    color: var(--ros26-muted);
    font-size: 1.7rem;
    line-height: 1.55;
}

.ros-shop-look {
    padding: 56px 0 84px;
    border-top: 1px solid var(--ros26-red);
    text-align: center;
}

.ros-shop-look h2 {
    margin-bottom: 28px;
}

.ros-shop-look p {
    margin-bottom: 54px;
    font-size: 1.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.ros-shop-look .product-list-item,
#visitor-category .product-list-item,
#search-products .product-list-item {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    border-top: 1px solid var(--ros26-line);
    border-left: 1px solid var(--ros26-line);
}

/* Le card Clerk sono avvolte da .col-* di Bootstrap: dentro la griglia
   vanno neutralizzate (niente max-width/padding/flex) così ogni card
   riempie la cella e i bordi restano continui come nello shop */
.ros-shop-look .product-list-item > [class*="col-"],
#visitor-category .product-list-item > [class*="col-"],
#search-products .product-list-item > [class*="col-"] {
    width: 100%;
    max-width: none;
    flex: none;
    padding: 0;
}

.ros-shop-look .product-list-item > [class*="col-"] > .ros-product-card,
#visitor-category .product-list-item > [class*="col-"] > .ros-product-card,
#search-products .product-list-item > [class*="col-"] > .ros-product-card {
    height: 100%;
}

/* Shop the look: scorrimento orizzontale con frecce (slick) */
.ros-shop-look__slider {
    display: block;
    border-top: 1px solid var(--ros26-line);
    border-left: 1px solid var(--ros26-line);
}

.ros-shop-look__slider .ros-product-card {
    margin: 0;
    border-right: 1px solid var(--ros26-line);
    border-bottom: 1px solid var(--ros26-line);
}

.ros-shop-look__slider .slick-list {
    margin: 0;
    padding: 0;
}

.ros-shop-look__slider .slick-prev,
.ros-shop-look__slider .slick-next {
    z-index: 1;
    width: 40px;
    height: 40px;
}

.ros-shop-look__slider .slick-prev {
    left: -4px;
}

.ros-shop-look__slider .slick-next {
    right: -4px;
}

.ros-shop-look__slider .slick-prev::before,
.ros-shop-look__slider .slick-next::before {
    color: var(--ros26-red);
    font-size: 34px;
    opacity: 1;
}

.ros-shop-look__slider .slick-disabled::before {
    opacity: .25;
}

.ros-notice {
    margin-top: 24px;
    padding: 16px;
    border: 1px solid var(--ros26-red);
}

.ros-notice .message {
    margin-bottom: 10px;
    font-weight: 700;
}

@media (max-width: 1199px) {
    .ros-site-header__inner {
        grid-template-columns: 150px 1fr auto;
    }

    .ros-main-nav,
    .ros-header-tools {
        display: none;
    }

    .ros-mobile-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .ros-mobile-panel {
        display: none;
        padding: 24px;
        background: var(--ros26-white);
        color: var(--ros26-ink);
    }

    .ros-mobile-panel.active {
        display: block;
    }

    .ros-mobile-panel a {
        color: var(--ros26-ink);
    }

    .ros-mobile-panel .ros-search {
        width: 100%;
        margin-bottom: 18px;
        border-color: var(--ros26-red);
    }

    .ros-mobile-panel .ros-search button,
    .ros-mobile-panel .ros-search input {
        color: var(--ros26-ink);
    }

    .ros-mobile-panel .ros-search__icon {
        background-color: var(--ros26-ink);
    }

    .ros-mobile-panel .ros-search input::placeholder {
        color: #555555;
    }

    .ros-mobile-panel .ros-right-menu .icon {
        border-color: var(--ros26-red);
    }

    .ros-mobile-panel .ros-right-menu .icon img {
        filter: none;
    }

    .ros-mobile-panel ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .ros-mobile-panel .ros-mobile-main a {
        display: block;
        padding: 12px 0;
        border-bottom: 1px solid #eeeeee;
        font-size: 1.4rem;
        font-weight: 800;
        text-transform: uppercase;
    }

    .ros-mobile-panel li a {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 8px 0;
        border-bottom: 1px solid #eeeeee;
        font-size: 1.3rem;
        font-weight: 800;
        text-transform: uppercase;
    }

    .ros-mobile-panel .ros-mega-categories__thumb {
        flex: 0 0 auto;
        width: 52px;
        height: 52px;
        aspect-ratio: auto;
    }

    .ros-mobile-panel .ros-mega-categories__label {
        font-size: 1.3rem;
        letter-spacing: .04em;
    }

    .ros-shop-nav {
        display: none;
    }

    .ros-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ros-shop-look .product-list-item,
    #visitor-category .product-list-item,
    #search-products .product-list-item {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    /* Timeline tablet+mobile: card autonome (anno in alto, immagine, testo)
       così tiles su più righe non generano lo sfalsamento accavallato. */
    .ros-timeline__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px 20px;
        align-items: start;
    }

    .ros-timeline__item {
        display: flex;
        flex-direction: column;
        background: var(--ros26-white);
        box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    }

    .ros-timeline__year,
    .ros-timeline__item:nth-child(even) .ros-timeline__year {
        order: 1;
        grid-row: auto;
        width: 100%;
        height: 52px;
        justify-content: flex-start;
        padding: 0 18px;
        clip-path: none;
        font-size: 2.4rem;
    }

    .ros-timeline__card,
    .ros-timeline__item:nth-child(even) .ros-timeline__card {
        order: 2;
        width: 100%;
        align-self: stretch;
        grid-row: auto;
    }

    .ros-timeline__media {
        height: 170px;
    }

    .ros-timeline__card p {
        min-height: 0;
        padding: 14px 18px;
        font-size: 1.25rem;
        line-height: 1.45;
    }
}

@media (max-width: 991px) {
    .ros-catalog-layout,
    .ros-product-main,
    .ros-origin-grid,
    .ros-service-detail,
    .ros-contact-top,
    .ros-contact-actions,
    .ros-promo-grid {
        grid-template-columns: 1fr;
    }

    /* Riduce lo spazio tra la navbar e l'immagine prodotto su mobile/tablet */
    .ros-product-detail {
        padding-top: 40px !important;
    }

    /* Filtri come cassetto laterale (off-canvas) aperto dal pulsante "Filtri" */
    .ros-filter-toggle {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
        padding: 9px 16px;
        border: 1px solid var(--ros26-red);
        background: var(--ros26-white);
        color: var(--ros26-red);
        font-size: 1.2rem;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
        cursor: pointer;
    }

    .ros-filter-toggle__ico {
        width: 16px;
        height: 16px;
        background: currentColor;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 5h18v2l-7 7v5l-4 2v-7L3 7z'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 5h18v2l-7 7v5l-4 2v-7L3 7z'/%3E%3C/svg%3E") center / contain no-repeat;
    }

    .ros-sidebar {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 1002;
        width: min(340px, 88%);
        height: 100%;
        margin: 0;
        padding: 20px 22px 40px;
        overflow-y: auto;
        background: var(--ros26-white);
        box-shadow: -12px 0 30px rgba(0, 0, 0, .2);
        transform: translateX(100%);
        visibility: hidden;
        transition: transform .28s ease, visibility .28s;
    }

    .ros-sidebar.active {
        transform: translateX(0);
        visibility: visible;
    }

    .ros-filter-drawer-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px;
        padding-bottom: 14px;
        border-bottom: 1px solid var(--ros26-line);
        font-family: var(--ros26-display);
        font-size: 1.9rem;
        font-weight: 900;
        text-transform: uppercase;
    }

    .ros-filter-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        border: none;
        background: transparent;
        color: var(--ros26-ink);
        font-size: 2.8rem;
        line-height: 1;
        cursor: pointer;
    }

    .ros-filter-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1001;
        background: rgba(0, 0, 0, .5);
        opacity: 0;
        visibility: hidden;
        transition: opacity .28s ease, visibility .28s;
    }

    .ros-filter-backdrop.active {
        opacity: 1;
        visibility: visible;
    }

    body.ros-filters-open {
        overflow: hidden;
    }

    .ros-product-grid,
    .ros-shop-look .product-list-item,
    #visitor-category .product-list-item,
    #search-products .product-list-item,
    .ros-category-cards,
    .ros-selling-points,
    .ros-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ros-mosaic {
        height: auto;
        grid-template-columns: 1fr;
        grid-template-rows: none;
        grid-auto-rows: 210px;
    }

    .ros-mosaic__tile {
        grid-column: 1 !important;
        grid-row: auto !important;
    }

    .ros-mosaic__vertical-left,
    .ros-mosaic__vertical-right {
        left: 22px;
        right: auto;
        bottom: 18px;
        writing-mode: initial;
        transform: none;
    }

    /* About: annulla l'effetto "sbordo" (solo desktop) e impila in modo pulito */
    .ros-origin-grid {
        gap: 40px;
    }

    .ros-origin-grid .ros-media {
        transform: none;
        height: clamp(240px, 62vw, 380px);
        margin-bottom: 0;
    }

    .ros-service-detail__media {
        height: clamp(240px, 62vw, 380px);
        margin-bottom: 0;
    }

    .ros-origin-grid p {
        align-self: start;
    }

    /* Le statistiche: rimuovi lo spazio extra sopra (serviva solo per lo
       sbordo dell'immagine su desktop, qui non c'è) */
    .ros-stats {
        padding: 48px 0 44px;
    }
}

@media (max-width: 640px) {
    .ros-container,
    .ros-text-container {
        width: min(100% - 28px, var(--ros26-site));
    }

    .ros-logo img {
        width: 100px;
    }

    .ros-hero {
        min-height: 420px;
    }

    /* Banner categoria/shop più basso su mobile */
    .ros-catalog-hero {
        min-height: 240px;
    }

    .ros-hero h1 {
        font-size: 3.8rem;
    }

    .ros-category-cards,
    .ros-selling-points,
    .ros-stats,
    .ros-instagram-grid,
    .ros-timeline__grid {
        grid-template-columns: 1fr;
    }

    /* Timeline mobile: card verticali pulite (anno in alto, immagine, testo) */
    .ros-timeline {
        padding: 44px 0;
    }

    .ros-timeline__grid {
        gap: 22px;
    }

    .ros-timeline__item {
        display: flex;
        flex-direction: column;
        background: var(--ros26-white);
        box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    }

    .ros-timeline__year,
    .ros-timeline__item:nth-child(even) .ros-timeline__year {
        order: 1;
        grid-row: auto;
        width: 100%;
        height: 52px;
        justify-content: flex-start;
        padding: 0 18px;
        clip-path: none;
        font-size: 2.4rem;
    }

    .ros-timeline__card,
    .ros-timeline__item:nth-child(even) .ros-timeline__card {
        order: 2;
        width: 100%;
        align-self: stretch;
        grid-row: auto;
    }

    .ros-timeline__media {
        height: 190px;
    }

    .ros-timeline__card p {
        min-height: 0;
        padding: 14px 18px;
        font-size: 1.25rem;
        line-height: 1.45;
    }

    /* Footer compatto su mobile: due colonne e spaziature ridotte */
    .ros-footer {
        padding: 34px 0 22px;
    }

    .ros-footer__logo {
        width: 140px;
        margin: 0 auto 26px;
    }

    .ros-footer__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px 20px;
    }

    .ros-footer h3 {
        margin: 0 0 10px;
        font-size: 1.4rem;
    }

    .ros-footer p,
    .ros-footer li,
    .ros-footer a {
        font-size: 1.1rem;
        line-height: 1.7;
    }

    .ros-footer__socials {
        margin-top: 12px;
    }

    .ros-footer__legal {
        margin-top: 24px;
    }

    /* Sullo shop mantieni 2 colonne prodotti (più compatto di 1) */
    .ros-product-grid,
    .ros-shop-look .product-list-item,
    #visitor-category .product-list-item,
    #search-products .product-list-item {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ros-product-card {
        min-height: 280px;
    }

    .ros-product-card__image {
        height: 150px;
        padding: 14px;
    }

    .ros-product-card__title {
        font-size: 1.2rem;
    }

    .ros-contact-panel {
        min-height: auto;
    }
}

@media (max-width: 380px) {
    .ros-product-card__body {
        padding: 12px 10px 40px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

    .ros-marquee__track {
        animation: none !important;
        transform: none !important;
    }

    .ros-marquee [aria-hidden="true"] {
        display: none;
    }
}