/* =========================================================
   ANNA DENTAL – CASSIOPEIA GYEREKSABLON
   ========================================================= */


:root {
    --link-color: #315aab!important;
	--h2-color:#259900;
}
h1 {
    color: var(--link-color);
}
h2 {
    color: var(--h2-color);
}

/* =========================================================
   1. NORMÁL CIKKOLDALAK KÉPEI
   ========================================================= */

/*
 * A normál cikkek képei:
 * - legfeljebb 450 px szélesek;
 * - megtartják az eredeti képarányukat;
 * - alapértelmezetten balra rendeződnek;
 * - minden kép új sorban kezdődik;
 * - a szöveg körbefuthat mellettük.
 */
.com-content-article__body img {
    display: block;
    float: left;
    clear: left;
    max-width: min(100%, 450px);
    height: auto;
    margin: 0 1.5rem 1.5rem 0;
}

/* A lebegő képek maradjanak a cikk területén belül */
.com-content-article__body::after {
    display: block;
    clear: both;
    content: "";
}

/* Az egyedi HTML-modulok képei legyenek reszponzívak */
.mod-custom img {
    max-width: 100%;
    height: auto;
}


/* =========================================================
   2. KAPCSOLATI MODUL
   ========================================================= */

.contact-card {
    display: grid;
    grid-template-columns:
        minmax(220px, 1fr)
        minmax(260px, 1.2fr)
        minmax(220px, 1fr);
    gap: 2rem;
    align-items: start;
}

.contact-card__portrait,
.contact-card__logo {
    display: block;
    max-width: 100%;
    height: auto;
}

.contact-card__details address {
    font-style: normal;
}

.contact-card__details address p {
    margin: 0 0 0.5rem;
}

.contact-card__social {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 2rem;
}


/* =========================================================
   3. JOOMLA ÉS CASSIOPEIA ELRENDEZÉS
   ========================================================= */

/*
 * A rendszerüzenet után következő fő tartalom
 * alapértelmezett felső margójának megszüntetése.
 */
.container-component > #system-message-container + main {
    margin-top: 0;
}

/*
 * A teljes böngészőszélességű elemek ne hozzanak létre
 * vízszintes görgetősávot.
 */
body.site {
    overflow-x: clip;
}


/* =========================================================
   4. CIKKOLDALI HERO – ALAPSZERKEZET
   ========================================================= */

.page-hero {
    position: relative;
    width: 100vw;
    margin-top: 0;
    margin-right: calc(50% - 50vw);
    margin-bottom: 3rem;
    margin-left: calc(50% - 50vw);
    overflow: hidden;
    background: #202830;
}

/* A Joomla képkonténereinek alaphelyzetbe állítása */
.page-hero__image,
.page-hero__image figure,
.page-hero__image .item-image {
    width: 100%;
    margin: 0;
    padding: 0;
}

.page-hero__image img {
    display: block;
    width: 100%;
    height: clamp(360px, 42vw, 650px);
    object-fit: cover;
    object-position: center;
}


/* =========================================================
   5. CIKKOLDALI HERO – ÁRNYÉKOLÁS ÉS FELIRAT
   ========================================================= */

.page-hero__shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.58) 0%,
        rgba(0, 0, 0, 0.28) 48%,
        rgba(0, 0, 0, 0.08) 100%
    );
}

.page-hero__content {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    width: min(1320px, calc(100% - 3rem));
    color: #ffffff;
    transform: translate(-50%, -50%);
}

.page-hero__title {
    max-width: 850px;
    margin: 0;
    color: #ffffff;
    font-size: clamp(2.1rem, 5vw, 4.5rem);
    font-weight: 700;
    line-height: 1.08;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
}

.page-hero__subtitle {
    max-width: 760px;
    margin: 1rem 0 0;
    color: #ffffff;
    font-size: clamp(1.05rem, 2vw, 1.6rem);
    line-height: 1.45;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}


/* =========================================================
   6. KEZDŐOLDAL – ÁLTALÁNOS
   ========================================================= */

/*
 * A kezdőoldal saját elrendezést használ, ezért a normál
 * cikkoldalak képúsztatását itt kikapcsoljuk.
 */
.home-page img {
    float: none;
    clear: none;
    max-width: 100%;
    height: auto;
    margin: 0;
}

/* A kezdőoldal központi tartalomszélessége */
.home-container {
    width: min(1140px, calc(100% - 3rem));
    margin-inline: auto;
}

.home-brand-green {
    color: #259900;
}

.home-highlight-orange {
    color: #ff5a00;
}


/* =========================================================
   7. KEZDŐOLDAL – BEVEZETŐ
   ========================================================= */

.home-intro {
    padding: 3.5rem 0 3rem;
}

.home-intro__lead {
    margin: 0 0 0.4rem;
    font-size: clamp(1.25rem, 2vw, 1.8rem);
    color: #259900;
}

.home-intro h1 {
    max-width: 1000px;
    margin: 0;
    color: #2e59ad;
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.1;
}

.home-intro__summary {
    max-width: 1000px;
    margin: 0.75rem 0 0;
    font-size: clamp(1.1rem, 2vw, 1.5rem);
    line-height: 1.35;
}

/* linkek */

.home-action-links {
    display: grid;
    gap: 0.8rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
	font-size: 1.2rem;
    line-height: 1.45;
}

.home-action-links li {
    font-size: 1.2rem;
    line-height: 1.45;
}

.home-action-links li::before {
    margin-right: 0.4rem;
    color: #e42313;
    content: "+";
}

/* Unicode: pipa */
.home-action-links li:first-child::before {
    content: "\2713";
}


/* =========================================================
   8. KEZDŐOLDAL – SZOLGÁLTATÁSKÁRTYÁK
   ========================================================= */

.home-services {
    width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding: 1rem 0 4rem;
    background: #f4f4f4;
}

.home-services__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.75rem;
    align-items: stretch;
}

.home-service-card {
    display: flex;
    flex-direction: column;
    padding: 0.75rem;
    background: #ffffff;
    text-align: center;
}

.home-service-card h2 {
    min-height: 3.3rem;
    margin: 0 0 0.6rem;
    color: #1764cc;
    font-size: 1.55rem;
    font-weight: 400;
    line-height: 1.15;
}

.home-service-card > img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.home-service-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
}

.home-service-card__content p {
    margin: 0.6rem 0;
}

.home-button {
    display: block;
    width: 100%;
    margin-top: auto;
    padding: 0.75rem 1rem;
    background: #2e59ad;
    color: #ffffff;
    font-size: 1.15rem;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
}

/* Unicode: jobbra mutató idézőjel */
.home-button::before {
    margin-right: 0.35rem;
    content: "\203A";
    font-weight: 700;
}

.home-button:hover,
.home-button:focus {
    background: #214384;
    color: #ffffff;
}


/* =========================================================
   9. KEZDŐOLDAL – EGÉSZSÉG HÁTTÉRKÉPES SZAKASZ
   ========================================================= */

/*
 * Teljes szélességű, normál módon gördülő háttérkép.
 * Ez a szakasz nem parallax.
 */
.home-feature {
    position: relative;
    width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.home-feature--health {
    min-height: 500px;
    background-image:
        url("/images/annadental/annadental-04c.webp");
    background-position: center center;
}

/* Finom bal oldali árnyékolás a fehér szöveg mögött */
.home-feature__shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.30) 0%,
        rgba(0, 0, 0, 0.10) 45%,
        rgba(0, 0, 0, 0) 70%
    );
}

.home-feature__inner {
    position: relative;
    z-index: 2;
    display: flex;
    min-height: inherit;
    align-items: center;
}

.home-feature__content {
    width: min(520px, 48%);
    padding-block: 4rem;
    color: #ffffff;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.55);
}

.home-feature__content h2 {
    margin: 0 0 2rem;
    color: #ffffff;
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 400;
    line-height: 1.2;
}

.home-feature__content p {
    margin: 0 0 2rem;
    color: #ffffff;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.4;
}

.home-feature__content p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   10. KEZDŐOLDAL – VALÓDI PARALLAX SZAKASZ
   ========================================================= */

/*
 * Ezt az osztályt csak azok a szakaszok kapják,
 * amelyeknél a háttér a görgetés alatt rögzített marad.
 */
.home-parallax {
    position: relative;
    display: flex;
    width: 100vw;
    min-height: 560px;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    align-items: center;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.home-parallax--materials {
    background-image:
        url("/images/annadental/water-lily-1857350_1920.webp");
}

.home-parallax__shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.38) 0%,
        rgba(0, 0, 0, 0.16) 45%,
        rgba(0, 0, 0, 0) 72%
    );
}

.home-parallax__inner {
    position: relative;
    z-index: 2;
    display: flex;
    width: min(1140px, calc(100% - 3rem));
    min-height: inherit;
    margin-inline: auto;
    align-items: center;
}

.home-parallax__content {
    color: #ffffff;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.65);
}

.home-parallax__content--left {
    width: min(520px, 48%);
}

.home-parallax__content h2 {
    margin: 0 0 2rem;
    color: #ffffff;
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 400;
    line-height: 1.2;
}

.home-parallax__content p {
    margin: 0 0 2rem;
    color: #ffffff;
    font-size: 1.05rem;
    line-height: 1.45;
}

.home-parallax__content p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   11. NORMÁL CIKKOLDALAK – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .contact-card {
        grid-template-columns: 1fr;
    }

    .page-hero {
        margin-bottom: 2rem;
    }

    .page-hero__image img {
        height: 360px;
    }

    .page-hero__content {
        width: calc(100% - 2rem);
    }

    .page-hero__shade {
        background: rgba(0, 0, 0, 0.42);
    }

    .com-content-article__body img {
        float: none;
        max-width: 100%;
        margin: 0 0 1.5rem;
    }
}


/* =========================================================
   12. KEZDŐOLDAL – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .home-container {
        width: min(100% - 2rem, 1140px);
    }

    .home-intro {
        padding: 2.5rem 0;
    }

    .home-services__grid {
        grid-template-columns: 1fr;
    }

    .home-service-card h2 {
        min-height: auto;
    }

    /*
     * Mobilon a lányos háttérkép továbbra is normál módon
     * együtt gördül az oldallal.
     */
    .home-feature--health {
        min-height: 520px;
        background-position: 62% center;
    }

    .home-feature__inner {
        align-items: flex-end;
    }

    .home-feature__content {
        width: 100%;
        padding-block: 3rem;
    }

    .home-feature__shade {
        background: rgba(0, 0, 0, 0.48);
    }

    .home-feature__content h2 {
        margin-bottom: 1.5rem;
    }

    .home-feature__content p {
        margin-bottom: 1.25rem;
    }

    /*
     * A background-attachment: fixed mobilböngészőkben
     * nem megbízható, ezért mobilon kikapcsoljuk.
     */
    .home-parallax {
        min-height: 520px;
        background-position: 62% center;
        background-attachment: scroll;
    }

    .home-parallax__inner {
        width: min(100% - 2rem, 1140px);
        padding-block: 3rem;
        align-items: flex-end;
    }

    .home-parallax__content--left {
        width: 100%;
    }

    .home-parallax__shade {
        background: rgba(0, 0, 0, 0.48);
    }

    .home-parallax__content h2 {
        margin-bottom: 1.5rem;
    }

    .home-parallax__content p {
        margin-bottom: 1.25rem;
    }
}
/* =========================================================
   13. KEZDŐOLDAL – UNGARN, ZAHNMEDIZINISCHER TOURISMUS
   ========================================================= */

.home-hungary {
    padding: 3.5rem 0;
    background: #f4f4f4;
}

.home-hungary__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem;
    align-items: center;
}

.home-hungary__image img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 0.78;
    object-fit: cover;
}

.home-hungary__content h2 {
    margin: 0 0 1rem;
    color: #2e59ad;
    font-size: clamp(2rem, 3.5vw, 3rem);
    line-height: 1.08;
}

.home-hungary__content p {
    margin: 0 0 1.5rem;
    line-height: 1.6;
}

.home-hungary__content p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   14. KEZDŐOLDAL – BUDAPEST PARALLAX
   ========================================================= */

.home-parallax--budapest {
    min-height: 360px;
    background-image:
        url("/images/annadental/budapest-3655787_1920.webp");
    background-position: center 55%;
}


/* =========================================================
   15. UNGARN SZAKASZ – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .home-hungary {
        padding: 2.5rem 0;
    }

    .home-hungary__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .home-hungary__content h2 {
        font-size: clamp(1.8rem, 8vw, 2.5rem);
    }

    .home-parallax--budapest {
        min-height: 280px;
        background-position: center;
    }
}
/* =========================================================
   16. KEZDŐOLDAL – ACCESS SMILE ZAHNKLINIK
   ========================================================= */

.home-clinic {
    padding: 3.5rem 0 4rem;
    background: #ffffff;
}

.home-clinic__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem;
    align-items: start;
}

.home-clinic__image img {
    display: block;
    width: 100%;
    height: auto;
}

.home-clinic__content {
    padding-top: 0.75rem;
}

.home-clinic__eyebrow {
    margin: 0 0 1rem;
    color: #666666;
    font-size: 0.95rem;
    line-height: 1.4;
}

.home-clinic__content h2 {
    margin: 0 0 1rem;
    color: #2e59ad;
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 500;
    line-height: 1.15;
}

.home-clinic__content p {
    margin: 0 0 1.25rem;
    line-height: 1.65;
}

.home-clinic__content h3 {
    margin: 1.5rem 0 0;
    color: #2e59ad;
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 700;
    line-height: 1.15;
}


/* =========================================================
   17. ACCESS SMILE ZAHNKLINIK – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .home-clinic {
        padding: 2.5rem 0 3rem;
    }

    .home-clinic__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .home-clinic__content {
        padding-top: 0;
    }
}
/* =========================================================
   18. KEZDŐOLDAL – HOCHWERTIGE DENTALMATERIALIEN
   ========================================================= */

.home-parallax--materials {
    min-height: 620px;
    background-position: center center;
}

.home-parallax__shade--materials {
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.05) 42%,
        rgba(0, 0, 0, 0.30) 100%
    );
}

.home-parallax__inner--right {
    justify-content: flex-end;
}

.home-materials {
    width: min(650px, 58%);
    padding-block: 3rem;
}

.home-materials__content {
    padding: 1.25rem;
    background: rgba(20, 35, 20, 0.58);
    color: #ffffff;
}

.home-materials__content h2 {
    margin: 0 0 0.75rem;
    color: #ffffff;
    font-size: clamp(1.8rem, 3vw, 2.5rem);
    font-weight: 500;
    line-height: 1.15;
}

.home-materials__content p {
    margin: 0 0 1.25rem;
    color: #ffffff;
    line-height: 1.55;
}

.home-materials__list {
    display: grid;
    gap: 0.35rem;
    margin: 0;
}

.home-materials__list > div {
    display: grid;
    grid-template-columns: minmax(160px, 0.8fr) minmax(0, 2fr);
    gap: 1rem;
}

.home-materials__list dt {
    color: #ffffff;
    font-weight: 700;
}

.home-materials__list dd {
    margin: 0;
    color: #ffffff;
}

.home-materials__actions {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.home-materials__button {
    font-size: clamp(1rem, 2vw, 1.25rem);
}


/* =========================================================
   19. DENTALMATERIALIEN – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .home-parallax--materials {
        min-height: auto;
        background-position: 38% center;
    }

    .home-parallax__inner--right {
        align-items: center;
        justify-content: center;
    }

    .home-materials {
        width: 100%;
        padding-block: 3rem;
    }

    .home-materials__content {
        background: rgba(15, 30, 15, 0.68);
    }

    .home-materials__list > div {
        grid-template-columns: 1fr;
        gap: 0.1rem;
    }
}
/* =========================================================
   20. KEZDŐOLDAL – MAXIMALE VERSORGUNGSSICHERHEIT
   ========================================================= */

.home-security {
    padding: 4rem 0;
    background: #ffffff;
}

.home-security__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 1fr);
    gap: 3rem;
    align-items: start;
}

.home-security__content h2 {
    margin: 0;
    color: #2e59ad;
    font-size: clamp(2.2rem, 4vw, 3.4rem);
    font-weight: 700;
    line-height: 1.08;
}

.home-security__lead {
    margin: 0.5rem 0 2.5rem;
    color: #259900;
    font-size: clamp(1.65rem, 3vw, 2.5rem);
    line-height: 1.2;
}

.home-security__text {
    max-width: 720px;
}

.home-security__text p {
    margin: 0 0 1.25rem;
    line-height: 1.65;
}

.home-security__text p:last-child {
    margin-bottom: 0;
}

.home-security__image img {
    display: block;
    width: 100%;
    height: auto;
}


/* =========================================================
   21. VERSORGUNGSSICHERHEIT – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .home-security {
        padding: 3rem 0;
    }

    .home-security__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .home-security__lead {
        margin-bottom: 1.75rem;
    }

    .home-security__image {
        order: -1;
    }
}
/* =========================================================
   22. KEZDŐOLDAL – ZAHNTOURISMUS UND AUSBILDUNG
   ========================================================= */

.home-dental-history {
    width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding: 4rem 0;
    background: #f4f4f4;
}

.home-dental-history__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3rem;
    align-items: start;
}

.home-dental-history__column h2 {
    margin: 0 0 1rem;
    color: #2e59ad;
    font-size: clamp(2rem, 3vw, 2.8rem);
    font-weight: 700;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.home-dental-history__column p {
    margin: 0 0 1.25rem;
    line-height: 1.65;
}

.home-dental-history__column p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   23. ZAHNTOURISMUS UND AUSBILDUNG – KÖZTES NÉZET
   ========================================================= */

@media (min-width: 768px) and (max-width: 1099.98px) {
    .home-dental-history__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-dental-history__column:last-child {
        grid-column: 1 / -1;
    }
}


/* =========================================================
   24. ZAHNTOURISMUS UND AUSBILDUNG – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .home-dental-history {
        padding: 3rem 0;
    }

    .home-dental-history__grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .home-dental-history__column h2 {
        font-size: clamp(1.8rem, 8vw, 2.5rem);
        overflow-wrap: normal;
    }
}
/* =========================================================
   25. KEZDŐOLDAL – BADEKULTUR
   ========================================================= */

.home-bathing {
    padding: 4rem 0 3rem;
    background: #ffffff;
}

.home-bathing__header {
    margin-bottom: 2.5rem;
}

.home-bathing__header h2 {
    margin: 0 0 0.75rem;
    color: #2e59ad;
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 700;
    line-height: 1.1;
}

.home-bathing__header p {
    margin: 0 0 1.25rem;
    line-height: 1.65;
}

.home-bathing__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
    align-items: start;
}

.home-bath-card img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.home-bath-card h3 {
    margin: 0;
    color: #2e59ad;
    font-size: clamp(1.45rem, 2.5vw, 2rem);
    font-weight: 400;
    line-height: 1.15;
}

.home-bath-card p {
    margin: 0.75rem 0 0;
    line-height: 1.65;
}


/* =========================================================
   26. KEZDŐOLDAL – WEINKULTUR
   ========================================================= */

.home-wine {
    width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding: 2rem 0;
    background: #f4f4f4;
}

.home-wine__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr);
    gap: 3rem;
    align-items: center;
}

.home-wine__content p {
    margin: 0;
    line-height: 1.65;
}

.home-wine__image img {
    display: block;
    width: 100%;
    height: auto;
}


/* =========================================================
   27. BADEKULTUR ÉS WEINKULTUR – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .home-bathing {
        padding: 3rem 0 2.5rem;
    }

    .home-bathing__header {
        margin-bottom: 2rem;
    }

    .home-bathing__grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .home-wine {
        padding: 2.5rem 0;
    }

    .home-wine__grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .home-wine__image {
        order: -1;
    }
}
/* =========================================================
   28. ÜBER ANNA DENTAL – MISSION ÉS LEITBILD
   ========================================================= */

.annadental-mission,
.annadental-leitbild {
    box-sizing: border-box;
    width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding: 3rem max(1.5rem, calc((100vw - 1140px) / 2));
    background-color: #f5f5f5;
}

/* A két egymást követő szakasz között ne legyen fehér rés */
.annadental-mission {
    padding-bottom: 2rem;
}

.annadental-leitbild {
    padding-top: 2rem;
}

/* Az idézet Cassiopeia alapértelmezett margójának rendezése */
.annadental-leitbild blockquote {
    margin: 0;
}

.annadental-leitbild blockquote footer {
    margin-top: 1.5rem;
    font-weight: 600;
}
/* =========================================================
   29. PROFESSIONELLE ZAHNREINIGUNG – PROPHYLAXE-TEAM
   ========================================================= */

.pzr-team {
    box-sizing: border-box;
    width: 100vw;
    margin-top: 3rem;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding: 4rem max(1.5rem, calc((100vw - 1140px) / 2));
    background-color: #f5f5f5;
}

.pzr-team__inner {
    width: 100%;
}

.pzr-team h2 {
    margin: 0 0 2rem;
    color: #2e59ad;
}

.pzr-team__grid {
    display: grid;
    grid-template-columns: repeat(2, 230px);
    gap: 3.5rem;
    justify-content: start;
    align-items: start;
}

/*
 * Felülírja a normál cikkképekre vonatkozó úsztatást,
 * de kizárólag ebben a szakaszban.
 */
.pzr-team__member img {
    display: block;
    float: none;
    clear: none;
    width: 230px;
    max-width: 100%;
    aspect-ratio: 1 / 1;
    height: auto;
    margin: 0;
    object-fit: cover;
}

.pzr-team__member {
    margin: 0;
}

.pzr-team__member figcaption {
    margin-top: 0.75rem;
    color: #2e59ad;
    font-size: 1.4rem;
    line-height: 1.25;
}

@media (max-width: 575.98px) {
    .pzr-team {
        padding-block: 3rem;
    }

    .pzr-team__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .pzr-team__member img {
        width: min(100%, 300px);
    }
}
/* =========================================================
   30. BOTTOM-A – SZAKEMBERKÁRTYÁK
   ========================================================= */

/*
 * A bottom-a tartalma a Cassiopeia központi tartalomszélességén
 * belül marad, a háttér viszont teljes monitorszélességű.
 */
.container-bottom-a {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 3rem;
    align-items: start;
    padding-top: 4rem;
    padding-bottom: 4rem;
    background-color: #f5f5f5;
    box-shadow: 0 0 0 100vmax #f5f5f5;
    clip-path: inset(0 -100vmax);
}

/* A modulok saját kereteinek semlegesítése */
.container-bottom-a .team-module {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.doctor-card {
    max-width: 300px;
    margin: 0;
}

.doctor-card__portrait {
    display: block;
    float: none;
    clear: none;
    width: 230px;
    max-width: 100%;
    aspect-ratio: 1 / 1;
    height: auto;
    margin: 0 0 0.4rem;
    object-fit: cover;
}

.doctor-card__degree {
    margin: 0 0 1rem;
    color: #707070;
    font-size: 0.9rem;
}

.doctor-card h2 {
    margin: 0 0 0.65rem;
    color: #2e59ad;
    font-size: 1.55rem;
    font-weight: 500;
    line-height: 1.2;
}

.doctor-card__position {
    text-transform: uppercase;
}

.doctor-card h3 {
    margin: 1.25rem 0 0.65rem;
    color: inherit;
    font-size: 1rem;
    font-weight: 500;
}

.doctor-card p {
    margin: 0 0 1rem;
    line-height: 1.55;
}

.doctor-card ul {
    margin: 0 0 1.25rem;
    padding: 0;
    list-style: none;
}

.doctor-card li {
    margin: 0 0 0.25rem;
    color: #666666;
    line-height: 1.45;
}

.doctor-card__languages {
    display: grid;
    gap: 0.5rem;
}

.doctor-card__flags {
    font-size: 1.9rem;
    line-height: 1;
    letter-spacing: 0.25rem;
}


/* =========================================================
   31. BOTTOM-A – MOBILNÉZET
   ========================================================= */

@media (max-width: 767.98px) {
    .container-bottom-a {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .doctor-card {
        max-width: 100%;
    }

    .doctor-card__portrait {
        width: min(100%, 300px);
    }
}
/* =========================================================
   FOOTER
   ========================================================= */

.container-footer {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 1rem max(1.5rem, calc((100vw - 1140px) / 2));
  background-color: #18375f;
  color: #ffffff;
}

/* A Joomla modul saját hátterének és keretének eltávolítása */
.container-footer .mod-custom,
.container-footer .moduletable,
.container-footer .card {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.site-copyright {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #ffffff;
  font-size: 0.9rem;
  line-height: 1.5;
  text-align: center;
}

.site-copyright a {
  background: transparent;
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.site-copyright a:hover,
.site-copyright a:focus-visible {
  background: transparent;
  color: #ffffff;
  text-decoration-thickness: 2px;
}
/* =========================================================
   VORHER–NACHHER FOTÓGALÉRIA
   ========================================================= */

.before-after-gallery {
  clear: both;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 5rem) 0;
}

.before-after-gallery > h1 {
  margin: 0 0 clamp(2.5rem, 6vw, 5rem);
  text-align: center;
}

.before-after-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(3rem, 7vw, 6rem) 2rem;
}

.before-after-case {
  min-width: 0;
  margin: 0;
}

.before-after-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
}

.before-after-item {
  min-width: 0;
}

.before-after-item h2,
.before-after-case--composite > h2 {
  margin: 0 0 0.5rem;
  text-align: center;
  font-size: clamp(1.25rem, 2.2vw, 1.8rem);
  font-weight: 400;
}

.before-after-subgrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
}

/* Felülírja a normál cikkképekre vonatkozó 450 px-es és float szabályt */
.com-content-article .before-after-gallery img {
  display: block;
  float: none;
  clear: none;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
}

.before-after-case--composite img {
  width: 100%;
}

/* A négy képből álló összehasonlítás teljes sort kap */
.before-after-case--four {
  grid-column: 1 / -1;
}

@media (max-width: 767.98px) {
  .before-after-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  .before-after-case--four {
    grid-column: auto;
  }

  /* A képpárok mobilon is egymás mellett maradnak */
  .before-after-pair {
    gap: 0.5rem;
  }

  .before-after-item h2,
  .before-after-case--composite > h2 {
    font-size: 1.2rem;
  }
}
/* =========================================================
   ORGELMUSIK OLDAL
   ========================================================= */

.orgelmusic-page {
  clear: both;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 1rem 0 3rem;
}

.orgelmusic-page > h1 {
  margin: 0 0 1.25rem;
  padding: 0.6rem 1rem;
  background: #f0f1f2;
  color: #1f426d;
  font-size: clamp(1.35rem, 2.5vw, 1.8rem);
  text-align: center;
}

.orgelmusic-posters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
  align-items: start;
}

/* A normál cikkképek 450 px-es és float szabályainak felülírása */
.com-content-article .orgelmusic-posters img {
  display: block;
  float: none;
  clear: none;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
}

@media (max-width: 767.98px) {
  .orgelmusic-posters {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}
/* =========================================================
   Ü50 SELBSTFÜRSORGE – PAGEBUILDER NÉLKÜLI OLDAL
   ========================================================= */

.u50-page {
  --u50-content-width: 1140px;
  color: #252525;
}

.u50-container {
  width: min(var(--u50-content-width), calc(100% - 3rem));
  margin-inline: auto;
}

.u50-grid {
  display: grid;
  gap: clamp(2rem, 4vw, 4rem);
}

.u50-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

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

.u50-page h1,
.u50-page h2,
.u50-page h3 {
  margin-top: 0;
}

.u50-page article p:last-child {
  margin-bottom: 0;
}

/* Felső, keskeny naplementés sáv */
.u50-banner {
  width: 100vw;
  min-height: clamp(110px, 14vw, 190px);
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  background:
    url("/images/annadental/annadental-1171.webp")
    center center / cover no-repeat;
}

/* Háttérképes bevezető rész */
.u50-intro {
  position: relative;
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: clamp(3rem, 6vw, 6rem) 0;
  overflow: hidden;
  background:
    url("/images/annadental/old-people-616718_1920.webp")
    center center / cover no-repeat;
}

.u50-intro__overlay {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.82);
  pointer-events: none;
}

.u50-intro__content {
  position: relative;
  z-index: 1;
}

.u50-intro h1 {
  margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
  text-align: center;
}

/* Normál tartalmi blokkok */
.u50-section {
  padding: clamp(3rem, 6vw, 6rem) 0;
}

.u50-periodontal,
.u50-doctor-info {
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: clamp(3rem, 6vw, 6rem) 0;
  background: #f5f5f5;
}

.u50-section-title {
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
  text-align: center;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 500;
}

/* Belső hivatkozások */
.u50-more {
  margin-top: 1.25rem;
}

.u50-more a {
  font-weight: 600;
  text-decoration: none;
}

.u50-more a:hover,
.u50-more a:focus-visible {
  text-decoration: underline;
}

/* Natív HTML lenyíló rész */
.u50-details {
  margin-top: 2rem;
  border: 1px solid #d9e1e8;
  border-radius: 0.25rem;
  background: #f5f8fa;
}

.u50-details summary {
  position: relative;
  padding: 1rem 3rem 1rem 1.25rem;
  color: #1f456f;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}

.u50-details summary::-webkit-details-marker {
  display: none;
}

.u50-details summary::after {
  position: absolute;
  top: 50%;
  right: 1.25rem;
  content: "+";
  font-size: 1.5rem;
  line-height: 1;
  transform: translateY(-50%);
}

.u50-details[open] summary::after {
  content: "−";
}

.u50-details__content {
  padding: 0 1.25rem 1.5rem;
}

.u50-details__content h3 {
  margin-top: 1.75rem;
}

/* Az oldal alján lévő fogorvosi tájékoztató */
.u50-doctor-info {
  border-top: 1px solid #d5d5d5;
}

.u50-doctor-info article {
  padding-top: 1rem;
  border-top: 1px solid #c8c8c8;
}

/* Tablet */
@media (max-width: 991.98px) {
  .u50-grid--3 {
    grid-template-columns: 1fr;
  }

  .u50-intro {
    background-position: 60% center;
  }
}

/* Mobil */
@media (max-width: 767.98px) {
  .u50-container {
    width: min(var(--u50-content-width), calc(100% - 2rem));
  }

  .u50-grid--2 {
    grid-template-columns: 1fr;
  }

  .u50-banner {
    min-height: 100px;
  }

  .u50-intro {
    background-position: 65% center;
  }

  .u50-intro__overlay {
    background: rgba(255, 255, 255, 0.9);
  }
}
/* =========================================================
   FOGORVOSI ADATLAPOK ÉS BOTTOM MODULOK
   ========================================================= */

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 410px));
  gap: 2.5rem;
  align-items: start;
  justify-content: start;
  width: min(100%, 1140px);
  margin-inline: auto;
  padding: 3rem 1rem;
}

.team-card {
  width: 100%;
  max-width: 410px;
}

.team-card__photo {
  display: block;
  width: 100%;
  max-width: 410px;
  height: auto;
  margin: 0 0 0.35rem;
  object-fit: cover;
}

.team-card__degree {
  margin: 0 0 0.75rem;
  color: #666666;
  font-size: 0.95rem;
}

.team-card h3 {
  margin: 0 0 0.5rem;
}

.team-card p {
  margin: 0 0 1rem;
}

.team-card__specialities {
  margin: 0 0 1.25rem;
  padding-left: 1.25rem;
}

.team-card__specialities li {
  margin-bottom: 0.25rem;
}

.team-card__languages {
  display: block;
  width: auto;
  max-width: min(290px, 100%);
  height: auto;
  margin: 0;
}

/* Mobilnézet */
@media (max-width: 575.98px) {
  .team-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2rem 1rem;
  }

  .team-card {
    max-width: 100%;
  }

  .team-card__photo {
    max-width: 100%;
  }
}
/* =========================================================
   FEJLÉC – LOGÓ
   ========================================================= */

.container-header .navbar-brand img {
  display: block;
  width: auto;
  max-width: min(280px, 70vw);
  max-height: 90px;
}
/* =========================================================
   FEJLÉC – LOGÓ ÉS KÉK MENÜSÁV
   ========================================================= */

/* A teljes fejléc és a logó mögötti terület */
.container-header {
  background: #ffffff;
  background-image: none;
  box-shadow: none;
}

/* A logó környezete */
.container-header .container-topbar,
.container-header .container-nav,
.container-header .navbar-brand {
  background-image: none;
}

.container-header .navbar-brand {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* Kék, teljes szélességű menüsáv */
.container-header .container-nav {
  position: relative;
  z-index: 1000;
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
  overflow: visible;
  background-color: #315aab;
}

/*
 * A teljes böngészőszélességű kék háttér külön rétegen készül,
 * így nem kell clip-path, ezért a lenyíló menüt sem vágja le.
 */
.container-header .container-nav::before {
  position: absolute;
  z-index: 0;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  background-color: #315aab;
  content: "";
  pointer-events: none;
  transform: translateX(-50%);
}

/* A navigáció tartalma a kék háttérréteg fölött marad */
.container-header .container-nav > * {
  position: relative;
  z-index: 1;
}

/* Főmenü feliratai */
.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span,
.container-header .mod-menu > li > button,
.container-header .metismenu.mod-menu > .metismenu-item > a,
.container-header .metismenu.mod-menu > .metismenu-item > button {
  color: #ffffff;
}

/* Aktív és egérrel érintett menüpont */
.container-header .mod-menu > li.active > a,
.container-header .mod-menu > li.current > a,
.container-header .mod-menu > li > a:hover,
.container-header .mod-menu > li > a:focus,
.container-header .metismenu.mod-menu > .metismenu-item > a:hover,
.container-header .metismenu.mod-menu > .metismenu-item > a:focus {
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

/* Almenüt jelző nyilak */
.container-header .metismenu.mod-menu .mm-collapsed::after,
.container-header .metismenu.mod-menu .mm-toggler::after {
  color: #ffffff;
}

/* Lenyíló almenük maradjanak fehérek */
.container-header .metismenu.mod-menu .mm-collapse {
  background-color: #ffffff;
}

/* Almenük szövege sötét legyen */
.container-header .metismenu.mod-menu .mm-collapse a,
.container-header .metismenu.mod-menu .mm-collapse button {
  color: #1f2933;
}

/* Almenü kijelölése */
.container-header .metismenu.mod-menu .mm-collapse a:hover,
.container-header .metismenu.mod-menu .mm-collapse a:focus {
  color: #315aab;
  background-color: #f2f5f9;
}

/* Mobil menü gombja */
.container-header .navbar-toggler {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.7);
}

.container-header .navbar-toggler-icon {
  filter: brightness(0) invert(1);
}

/* =========================================================
   LENYÍLÓ MENÜ A HERO ÉS A TARTALOM FÖLÖTT
   ========================================================= */

@media (min-width: 992px) {
  .container-header {
    position: relative;
    z-index: 1000;
    overflow: visible;
  }

  .container-header .container-nav,
  .container-header nav,
  .container-header .navbar,
  .container-header .mod-menu,
  .container-header .metismenu,
  .container-header .metismenu-item {
    overflow: visible;
  }

  .container-header .metismenu.mod-menu .mm-collapse {
    z-index: 2000;
  }
}

/* Facebook, LinkedIn és Online Termin gombok */
.com-content-article a[href*="facebook.com"],
.com-content-article a[href*="linkedin.com"],
.com-content-article a[href*="forms.gle/r4RcM5zESn7JCnF58"],
.online-termin-panel > summary {
    background: var(--link-color);
    color: #ffffff !important;
    text-decoration: none !important;
    padding: 8px 14px;
    margin: 6px 0;
    border: 0;
    border-radius: 0 !important;
    box-shadow: none;
    cursor: pointer;
}

/* Facebook és LinkedIn */
.com-content-article a[href*="facebook.com"],
.com-content-article a[href*="linkedin.com"] {
    display: inline-block;
}

/* Accordion */
.online-termin-panel > summary {
    display: list-item;
    width: fit-content;
}

/* Hover */
.com-content-article a[href*="facebook.com"]:hover,
.com-content-article a[href*="linkedin.com"]:hover,
.online-termin-panel > summary:hover {
    background: #294d8f;
    color: #ffffff !important;
    text-decoration: none !important;
}
/* =====================================================
   ANNA DENTAL – FŐOLDALI NEWS / PDF SLIDER
   ===================================================== */

/* A főoldali cikk legyen a pozicionálás alapja */
.com-content-article:has(.annadental-news-slider) {
    position: relative;
}

/* Slider doboz – asztali nézet */
.annadental-news-slider {
    position: absolute;
    top: 45px;
    right: 3%;

    width: clamp(260px, 26vw, 360px);
    z-index: 10;

    background: #ffffff;
    border: 3px solid #ffffff;
    border-radius: 0;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.30);

    overflow: hidden;
}

/* Alaphelyzetben minden kép rejtve */
.annadental-news-slide {
    display: none;
}

/* Aktív kép */
.annadental-news-slide.is-active {
    display: block;
}

.annadental-news-slide a {
    display: block;
    line-height: 0;
}

.annadental-news-slide img {
    display: block;
    width: 100%;
    height: auto;
}

/* Lapozó gombok */
.annadental-news-prev,
.annadental-news-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

    width: 38px;
    height: 52px;
    padding: 0;

    border: 0;
    border-radius: 0;

    background: rgba(53, 99, 181, 0.90);
    color: #ffffff !important;

    font-size: 32px;
    font-weight: 400;
    line-height: 1;

    cursor: pointer;
    z-index: 2;
}

.annadental-news-prev {
    left: 0;
}

.annadental-news-next {
    right: 0;
}

.annadental-news-prev:hover,
.annadental-news-next:hover {
    background: var(--link-color);
    color: #ffffff !important;
}

/* =====================================================
   MOBIL
   ===================================================== */

@media (max-width: 767px) {

    .annadental-news-slider {
        position: relative;
        top: auto;
        right: auto;

        width: calc(100% - 30px);
        max-width: 420px;

        margin: 20px auto 30px;

        transform: none;
    }

    .annadental-news-prev,
    .annadental-news-next {
        width: 34px;
        height: 48px;
        font-size: 28px;
    }
}
/* Zahnbehandlung in Ungarn – felső képsor */
.clinic-top-gallery {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin: 1.5rem 0 2.5rem;
}

/* Felülírjuk a normál cikkképek float/max-width szabályait */
.com-content-article .clinic-top-gallery img {
    display: block;
    float: none;
    clear: none;
    width: auto;
    max-width: none;
    height: 360px;
    margin: 0;
    object-fit: contain;
}

/* Mobil */
@media (max-width: 767.98px) {
    .clinic-top-gallery {
        flex-direction: column;
        align-items: stretch;
    }

    .com-content-article .clinic-top-gallery img {
        width: 100%;
        max-width: 100%;
        height: auto;
    }
}