/* ============================================================
   Scheda cane — video + stampa/PDF
   ============================================================ */

.dog-scheda-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    margin: 0 0 1.25rem;
}

.dog-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    text-decoration: none;
    border: 1px solid var(--grigio-medio, #e6e3df);
    background: var(--bianco, #fff);
    color: var(--grigio-testo, #2c2a28);
    padding: 0.55rem 0.95rem;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.92rem;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, color .2s ease;
}

.dog-action-btn:hover {
    border-color: var(--arancio-scuro, #B8631B);
    color: var(--arancio-scuro, #B8631B);
}

.dog-action-btn--print {
    background: #1a1a1a;
    border-color: #1a1a1a;
    color: #fff;
}

.dog-action-btn--print:hover {
    background: #333;
    border-color: #333;
    color: #fff;
}

.dog-action-btn--pdf {
    background: #B8631B;
    border-color: #B8631B;
    color: #fff;
}

.dog-action-btn--pdf:hover {
    background: #9a5216;
    border-color: #9a5216;
    color: #fff;
}

.dog-action-icon {
    flex: 0 0 auto;
}

.dog-print-hint {
    font-size: 0.85rem;
    color: var(--grigio-soft, #6b6661);
    flex: 1 1 220px;
}

.dog-scheda-gallery-grid .gallery-item {
    cursor: pointer;
}

.dog-main-photo {
    margin: 1rem 0 1.5rem;
    width: 100%;
}

.dog-main-photo img {
    width: 100%;
    max-width: none;
    height: auto;
    display: block;
    margin: 0;
    border-radius: 8px;
    object-fit: contain;
    cursor: pointer;
}

.dog-table-wrap {
    overflow-x: auto;
    margin: 1rem 0 1.5rem;
}

.dog-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.dog-table th,
.dog-table td {
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--grigio-medio, #e6e3df);
    vertical-align: top;
}

.dog-table th {
    text-align: left;
    background: #fafafa;
    width: 35%;
    font-weight: 600;
}

.dog-scheda-section-title {
    font-family: var(--font-heading, 'Josefin Sans', sans-serif);
    font-size: 1.25rem;
    margin: 1.75rem 0 0.85rem;
    color: var(--nero-soft, #111);
}

.dog-scheda-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem;
}

.dog-scheda-gallery-grid .gallery-item {
    margin: 0;
}

.dog-scheda-gallery-grid img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    border-radius: 6px;
    display: block;
}

.dog-scheda-section-count {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.1rem 0.55rem;
    border-radius: 999px;
    background: var(--grigio-chiaro, #f1eeea);
    color: var(--grigio-soft, #6b6661);
    font-size: 0.8rem;
    font-weight: 600;
    vertical-align: middle;
}

.dog-video-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1rem;
}

/* Un solo video: non allargarlo a tutta la colonna */
.dog-video-grid--single {
    grid-template-columns: minmax(0, 720px);
    justify-content: center;
}

.dog-video-item {
    margin: 0;
}

.dog-video-frame {
    position: relative;
    background: #0d0d0d;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.14);
}

/* Cornice 16:9 con object-fit: contain, così i video verticali
   non diventano giganti e restano tutti allineati. */
.dog-video-frame video {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    max-height: 60vh;
    object-fit: contain;
    background: #0d0d0d;
}

.dog-video-badge {
    position: absolute;
    top: 0.6rem;
    left: 0.6rem;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.62);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    pointer-events: none;
}

@media (max-width: 600px) {
    .dog-video-grid,
    .dog-video-grid--single {
        grid-template-columns: minmax(0, 1fr);
    }

    .dog-video-frame video {
        aspect-ratio: 4 / 3;
    }
}

.dog-scheda-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0 0 1.35rem;
    padding: 0.65rem 1.15rem;
    border-radius: 999px;
    border: 1.5px solid var(--arancio-scuro, #B8631B);
    background: transparent;
    color: var(--arancio-scuro, #B8631B);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.dog-scheda-back-btn:hover {
    background: var(--arancio-scuro, #B8631B);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(184, 99, 27, 0.25);
}

.dog-scheda-back-btn__arrow {
    font-size: 1.05em;
    line-height: 1;
}

/* Foglio dati: nascosto a schermo */
.dog-scheda-foglio {
    display: none;
}

.dog-print-masthead,
.dog-print-footer,
.print-only {
    display: none;
}

/* ============================================================
   HERO della scheda cane
   - altezza fluida: i titoli lunghi non vengono mai tagliati
   - su schermi larghi la foto è mostrata intera (contain) a destra,
     con la stessa immagine sfocata come sfondo
   ============================================================ */
.hero.hero--scheda {
    height: auto;
    min-height: clamp(340px, 50vh, 560px);
    padding-block: clamp(3.5rem, 7vh, 6rem);
}

.hero.hero--scheda .hero-content {
    position: relative;
    z-index: 4;
    max-width: min(900px, 92vw);
    width: 100%;
}

.hero.hero--scheda .hero-title {
    font-size: clamp(1.7rem, 1rem + 2.1vw, 2.7rem);
    line-height: 1.16;
    margin-bottom: 0.5rem;
    overflow-wrap: break-word;
    text-wrap: balance;
}

.hero.hero--scheda .hero-title--long {
    font-size: clamp(1.5rem, 0.85rem + 1.75vw, 2.2rem);
}

.hero.hero--scheda .hero-subtitle {
    font-size: clamp(1rem, 0.85rem + 0.5vw, 1.35rem);
    margin-bottom: 0;
}

/* Inquadratura: le foto dei cani hanno il soggetto in alto-centro */
.hero.hero--scheda .hero-bg {
    background-position: var(--hero-focus, 50% 35%);
}

.hero.hero--scheda .hero-photo {
    display: none;
}

@media (min-width: 1100px) {
    .hero.hero--scheda {
        justify-content: flex-start;
        text-align: left;
        min-height: clamp(420px, 52vh, 600px);
    }

    .hero.hero--scheda .hero-content {
        width: min(46%, 620px);
        max-width: none;
        margin-left: clamp(2rem, 6vw, 6rem);
        padding-inline: 0;
    }

    /* Sfondo: stessa foto sfocata, riempie tutta la hero senza tagli fastidiosi */
    .hero.hero--scheda .hero-bg {
        inset: 0;
        animation: none;
        transform: scale(1.14);
        filter: blur(24px) brightness(0.68) saturate(1.05);
    }

    /* Foto intera, mai croppata */
    .hero.hero--scheda .hero-photo {
        display: block;
        position: absolute;
        top: clamp(1.5rem, 4vh, 2.75rem);
        bottom: clamp(1.5rem, 4vh, 2.75rem);
        right: clamp(1.5rem, 4vw, 4rem);
        left: 52%;
        background-size: contain;
        background-position: center right;
        background-repeat: no-repeat;
        z-index: 3;
    }
}

@media (min-width: 1100px) and (prefers-reduced-motion: reduce) {
    .hero.hero--scheda .hero-bg {
        transform: none;
    }
}

/* ---------- Stampa / PDF ---------- */
@media print {
    @page {
        size: A4;
        margin: 14mm 12mm;
    }

    html, body {
        background: #fff !important;
        color: #111 !important;
        font-size: 11pt;
        line-height: 1.45;
    }

    .skip-link,
    .no-print,
    .site-header,
    .header,
    .main-header,
    header.site-header,
    .main-nav,
    .nav-menu,
    .mobile-menu,
    .menu-toggle,
    .navbar-toggle,
    .navbar-menu,
    .navbar-brand,
    nav,
    .nav,
    .navbar,
    .footer,
    .site-footer,
    .footer-main,
    footer,
    .hero,
    .hero-small,
    .hero--small,
    .cookie-banner,
    .cookie-consent,
    #cookie-banner,
    .lightbox,
    .article-back,
    .dog-scheda-back-btn,
    .dog-scheda-toolbar,
    .whatsapp-float,
    .back-to-top {
        display: none !important;
    }

    .section,
    .container,
    .container--narrow {
        padding: 0 !important;
        margin: 0 !important;
        max-width: none !important;
        width: 100% !important;
    }

    a[href]::after {
        content: none !important;
    }

    /* === Modalità: stampa pagina (scheda web) === */
    body.dog-printing-page .dog-scheda-foglio {
        display: none !important;
    }

    body.dog-printing-page .dog-scheda--web {
        display: block !important;
    }

    body.dog-printing-page .dog-scheda-videos,
    body.dog-printing-page .dog-video-item {
        display: none !important;
    }

    body.dog-printing-page .dog-scheda-header .article-title {
        font-size: 1.55rem;
        margin: 0 0 0.35rem;
    }

    body.dog-printing-page .dog-main-photo img {
        max-width: 55%;
        max-height: 260px;
        object-fit: cover;
        border-radius: 0;
    }

    body.dog-printing-page .dog-scheda-gallery-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.45rem;
    }

    body.dog-printing-page .dog-scheda-gallery-grid img {
        height: 110px;
        border-radius: 0;
    }

    /* === Modalità: foglio dati / PDF === */
    body.dog-printing-foglio .dog-scheda--web {
        display: none !important;
    }

    body.dog-printing-foglio .dog-scheda-foglio {
        display: block !important;
    }

    .dog-foglio-masthead {
        border-bottom: 2.5px solid #B8631B;
        padding-bottom: 0.55rem;
        margin-bottom: 0.85rem;
    }

    .dog-foglio-brand {
        font-family: var(--font-heading, 'Josefin Sans', sans-serif);
        font-size: 1.4rem;
        font-weight: 600;
        letter-spacing: 0.02em;
    }

    .dog-foglio-sub {
        font-size: 0.85rem;
        color: #666;
        margin-top: 0.15rem;
    }

    .dog-foglio-title {
        font-family: var(--font-heading, 'Josefin Sans', sans-serif);
        font-size: 1.75rem;
        margin: 0 0 0.25rem;
        font-weight: 600;
    }

    .dog-foglio-meta {
        margin: 0 0 0.85rem;
        color: #555;
        font-size: 0.95rem;
    }

    .dog-foglio-photo {
        margin: 0 0 1rem;
    }

    .dog-foglio-photo img {
        max-width: 42%;
        max-height: 200px;
        width: auto;
        height: auto;
        object-fit: cover;
        display: block;
        border: 1px solid #ddd;
    }

    .dog-foglio-table {
        margin: 0 0 1rem;
        font-size: 10pt;
    }

    .dog-foglio-table th,
    .dog-foglio-table td {
        border: 1px solid #ccc;
        padding: 0.4rem 0.55rem;
    }

    .dog-foglio-table th {
        width: 32%;
        background: #f3f3f3 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        font-weight: 600;
    }

    .dog-foglio-excerpt {
        margin: 0 0 0.85rem;
        font-size: 0.95rem;
        color: #333;
        line-height: 1.5;
    }

    .dog-foglio-thumbs {
        display: flex;
        gap: 0.5rem;
        margin: 0 0 0.75rem;
    }

    .dog-foglio-thumbs img {
        width: 28%;
        max-height: 90px;
        object-fit: cover;
        border: 1px solid #ddd;
    }

    .dog-foglio-note {
        font-size: 9pt;
        color: #666;
        margin: 0 0 0.75rem;
        font-style: italic;
    }

    .dog-foglio-footer {
        margin-top: 1.25rem;
        padding-top: 0.5rem;
        border-top: 1px solid #ccc;
        font-size: 9pt;
        color: #666;
        text-align: center;
    }

    /* Condiviso: tabella */
    .dog-table th,
    .dog-table td {
        border-color: #ccc;
        padding: 0.4rem 0.55rem;
        font-size: 10pt;
    }

    .dog-table th {
        background: #f3f3f3 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .dog-scheda-section-title {
        font-size: 1.05rem;
        margin: 1rem 0 0.5rem;
        border-bottom: 1px solid #ddd;
        padding-bottom: 0.25rem;
    }

    /* Fallback se JS non ha settato la classe: stampa pagina web */
    body:not(.dog-printing-foglio) .dog-scheda-foglio {
        display: none !important;
    }
}