/* =====================================================================
   Ana sayfa — kampanya tasarımı (home/campaign.php)
   Panel > Site Yönetimi > Ana Sayfa Tasarımı

   Afiş yüksekliği ekran yüksekliğinden türetilir: menü (~118px) + afiş +
   kutular ilk ekrana sığar; yazılar da afiş yüksekliğine göre ölçeklenir.
   ===================================================================== */
:root {
    --hc-navy: #042a45;
    --hc-red: #e8443d;
    --hc-red-2: #d23630;
    --hc-teal: #016983;
    --hc-teal-2: #015a70;
    --hc-cream: #faf2e8;
    /* menü + kutular + boşluklar için ayrılan yükseklik */
    --hc-reserve: 372px;
}

/* ---------- Afiş ---------- */
.hc-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--hc-cream);
    min-height: clamp(340px, calc(100vh - var(--hc-reserve)), 680px);
    min-height: clamp(340px, calc(100svh - var(--hc-reserve)), 680px);
    display: flex;
    align-items: center;
}
.hc-hero__bg, .hc-hero__bg img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    z-index: -1;
}
.hc-hero__bg img { object-fit: cover; object-position: center; display: block; }

.hc-hero__inner {
    position: relative;
    text-align: center;
    padding-top: clamp(.75rem, 2.2svh, 1.75rem);
    padding-bottom: clamp(.75rem, 2.2svh, 1.75rem);
    display: flex; flex-direction: column; align-items: center;
    max-width: 900px;
}
/* Fotoğraf yüklenirse yazı okunur kalsın: arkada yumuşak krem ışık */
.hc-hero__inner::before {
    content: ""; position: absolute; inset: 4% 6%; z-index: -1;
    background: radial-gradient(closest-side, rgba(250, 242, 232, .6), rgba(250, 242, 232, 0));
    filter: blur(6px);
}
.hc-hero__eyebrow {
    margin: 0 0 .3em;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: clamp(1rem, min(2vw, 2.7svh), 1.7rem);
    color: var(--hc-navy);
    letter-spacing: -.01em;
}
.hc-hero__title {
    margin: 0;
    font-family: var(--font-sans);
    font-weight: 800;
    text-transform: uppercase;
    line-height: .95;
    letter-spacing: -.035em;
    display: flex; flex-direction: column; align-items: center;
}
.hc-hero__lead {
    color: var(--hc-navy);
    font-size: clamp(1.9rem, min(5.4vw, 6svh), 4.6rem);
    max-width: 12ch;
    text-wrap: balance;
}
.hc-hero__big {
    color: var(--hc-red);
    font-size: clamp(4.6rem, min(14vw, 16svh), 12rem);
    line-height: .86;
    letter-spacing: -.055em;
    margin-top: .05em;
}
.hc-hero__sub {
    color: var(--hc-red);
    font-size: clamp(2.5rem, min(7.5vw, 8.4svh), 6.4rem);
    line-height: .9;
}
.hc-hero__btn {
    margin-top: clamp(.7rem, 1.8svh, 1.3rem);
    display: inline-flex; align-items: center; justify-content: center;
    min-width: min(100%, 24rem);
    padding: clamp(.65rem, 1.6svh, .95rem) 2.2em;
    background: var(--hc-red);
    color: #fff;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: clamp(.95rem, min(1.5vw, 2.1svh), 1.3rem);
    letter-spacing: .02em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 8px;
    box-shadow: 0 14px 30px -14px rgba(210, 54, 48, .7);
    transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}
.hc-hero__btn:hover, .hc-hero__btn:focus-visible { background: var(--hc-red-2); color: #fff; transform: translateY(-1px); box-shadow: 0 18px 34px -14px rgba(210, 54, 48, .8); }

/* Yazısız afiş: görselin tamamı bağlantı; yükseklik yine ekrana göre, kenarlar kırpılır */
.hc-hero--plain { display: block; }
.hc-hero--plain a { position: absolute; inset: 0; display: block; }
.hc-hero--plain picture, .hc-hero--plain img { display: block; width: 100%; height: 100%; }
.hc-hero--plain img { object-fit: cover; object-position: center; }

/* ---------- Yönlendirme kutuları ---------- */
.hc-cards { padding: clamp(.75rem, 1.6vw, 1.25rem) 0 0; }
.hc-cards__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); }
.hc-card {
    background: var(--hc-teal);
    color: #fff;
    border-radius: 6px;
    padding: clamp(1.1rem, 1.8vw, 1.6rem) clamp(1.25rem, 3vw, 2.5rem);
    text-align: center;
    display: flex; flex-direction: column; align-items: center; gap: .55rem;
    box-shadow: 0 18px 40px -26px rgba(1, 60, 75, .6);
}
.hc-card__title {
    margin: 0;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: clamp(1.3rem, 2vw, 1.8rem);
    letter-spacing: -.015em;
    line-height: 1.2;
    color: #fff;
}
.hc-card__text { margin: 0; font-size: clamp(.95rem, 1.2vw, 1.06rem); line-height: 1.5; color: rgba(255, 255, 255, .92); max-width: 34rem; }
.hc-card__btn {
    margin-top: auto;
    display: inline-flex; align-items: center; justify-content: center;
    min-width: min(100%, 16rem);
    padding: .72em 2em;
    background: #fff;
    color: var(--hc-teal);
    font-weight: 700;
    font-size: .95rem;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 999px;
    transition: transform .15s ease, box-shadow .15s ease;
}
.hc-card__text + .hc-card__btn { margin-top: .35rem; }
.hc-card__btn:hover, .hc-card__btn:focus-visible { color: var(--hc-teal-2); transform: translateY(-1px); box-shadow: 0 10px 22px -12px rgba(0, 0, 0, .45); }

/* ---------- Tanıtım ---------- */
.hc-about { padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(1rem, 3vw, 2rem); text-align: center; }
.hc-about__title {
    margin: 0 0 .7rem;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: clamp(1.8rem, 3.6vw, 2.8rem);
    letter-spacing: -.025em;
    color: #152934;
}
.hc-about__text { margin: 0 auto; max-width: 62rem; color: var(--text-2); font-size: clamp(1rem, 1.4vw, 1.18rem); line-height: 1.65; }
.hc-about__link { display: inline-block; margin-top: 1.1rem; color: var(--hc-teal); font-weight: 700; text-decoration: none; }
.hc-about__link:hover { text-decoration: underline; }

.hc-branches { padding-top: clamp(2rem, 4vw, 3.5rem); }

/* ---------- Telefon ve dikey tablet: mobil kesit; yazı üstte, dekor altta ----------
   Ekranda: menü (~108) + afiş + iki kutu yan yana + alt hızlı işlem çubuğu (~61);
   yazılar ekran yüksekliğine (svh) göre küçülür ki kısa telefonlarda da kutular görünsün. */
@media (max-width: 700px), (orientation: portrait) and (max-width: 1100px) {
    /* Yükseklik içerikten gelir (yazı + alttaki dekor payı); boş alan kalmaz */
    .hc-hero { align-items: flex-start; min-height: 0; }
    .hc-hero__bg img { object-position: center bottom; }
    .hc-hero__inner {
        padding-top: clamp(.7rem, 2svh, 1.25rem);
        /* altta dekor (gift kutuları) için yer: görselin alt %33'ü */
        padding-bottom: clamp(4.5rem, min(27vw, 12.5svh), 11rem);
    }
    .hc-hero__inner::before { inset: 0 0 30%; }
    .hc-hero__eyebrow { font-size: clamp(.95rem, min(4.6vw, 2.4svh), 1.3rem); margin-bottom: .2em; }
    .hc-hero__lead { font-size: clamp(1.5rem, min(8.8vw, 4.2svh), 2.7rem); }
    .hc-hero__big { font-size: clamp(3.8rem, min(28vw, 11.5svh), 8rem); }
    .hc-hero__sub { font-size: clamp(2.1rem, min(14.5vw, 6.2svh), 4.3rem); }
    .hc-hero__btn { width: 100%; max-width: 21rem; min-width: 0; padding: clamp(.6rem, 1.5svh, .85rem) 1.2em; font-size: clamp(.9rem, 2svh, 1.05rem); margin-top: clamp(.5rem, 1.4svh, 1rem); }

    /* İki kutu yan yana, kompakt */
    .hc-cards { padding-top: .6rem; }
    .hc-cards__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
    .hc-card { padding: .85rem .7rem .9rem; gap: .4rem; border-radius: 8px; }
    .hc-card__title { font-size: clamp(.98rem, 4.2vw, 1.3rem); line-height: 1.2; }
    .hc-card__text {
        font-size: clamp(.78rem, 3.3vw, .95rem); line-height: 1.38;
        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    }
    .hc-card__btn { width: 100%; min-width: 0; padding: .62em .5em; font-size: clamp(.72rem, 3.1vw, .88rem); letter-spacing: .01em; }
    .hc-card__text + .hc-card__btn { margin-top: .25rem; }
}
/* Çok dar telefonlar: kutu metni 2 satır */
@media (max-width: 360px) {
    .hc-card__text { -webkit-line-clamp: 2; }
}
/* Kısa telefonlar (iPhone SE vb.): dekor payını ve büyük yazıyı biraz kıs */
@media (max-width: 700px) and (max-height: 700px) {
    .hc-hero__inner { padding-bottom: 3.9rem; }
    .hc-hero__big { font-size: clamp(3.6rem, 10.5svh, 5rem); }
}

/* ---------- Misafir yorumları (Google, 5 yıldızlı) — yana kaydırmalı ---------- */
.hc-rv { padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 4.5rem); background: var(--hc-cream); }
.hc-rv__head { text-align: center; margin-bottom: clamp(1.4rem, 3vw, 2.2rem); }
.hc-rv__title {
    margin: 0 0 .55rem;
    font-family: var(--font-sans); font-weight: 700;
    font-size: clamp(1.7rem, 3.4vw, 2.6rem); letter-spacing: -.025em; line-height: 1.15;
    color: #152934;
}
.hc-rv__sub { margin: 0; display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: center; color: var(--text-2); font-size: 1.05rem; font-weight: 600; }
.hc-rv__g { width: 22px; height: 22px; flex: none; }
.hc-rv__stars { display: inline-flex; gap: 2px; }
.hc-rv__stars svg { width: 18px; height: 18px; fill: #fbbc04; }

.hc-rv__track {
    display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * 1.2rem) / 3); gap: 1.2rem;
    overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain;
    padding: .3rem .1rem 1rem; scrollbar-width: none;
}
.hc-rv__track::-webkit-scrollbar { display: none; }
.hc-rv__track:focus-visible { outline: 2px solid var(--hc-teal); outline-offset: 4px; border-radius: 14px; }
.hc-rv__card {
    scroll-snap-align: start; display: flex; flex-direction: column; gap: .7rem;
    padding: 1.3rem 1.3rem 1.2rem; background: #fff; border-radius: 14px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 12px 30px -20px rgba(0, 0, 0, .35);
}
.hc-rv__who { display: flex; align-items: center; gap: .75rem; }
.hc-rv__who .hc-rv__g { margin-left: auto; width: 20px; height: 20px; }
.hc-rv__ava {
    width: 44px; height: 44px; flex: none; border-radius: 50%; object-fit: cover;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--hc-teal); color: #fff; font-weight: 700; font-size: 1.1rem;
}
.hc-rv__meta { min-width: 0; display: grid; line-height: 1.3; }
.hc-rv__meta b { color: #152934; font-size: 1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-rv__meta small { color: var(--text-3, #6b7280); font-size: .82rem; }
.hc-rv__text {
    margin: 0; color: var(--text-2); font-size: .97rem; line-height: 1.6;
    display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden;
}
.hc-rv__card.is-open .hc-rv__text { -webkit-line-clamp: unset; display: block; }
.hc-rv__more { font: inherit; align-self: flex-start; padding: 0; border: 0; background: none; color: var(--hc-teal); font-weight: 700; font-size: .9rem; cursor: pointer; }
.hc-rv__more:hover { text-decoration: underline; }
.hc-rv__foot { margin-top: auto; padding-top: .7rem; border-top: 1px solid #efe7dc; display: flex; }
.hc-rv__like {
    font: inherit; display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .7rem .35rem .55rem; margin-left: -.55rem;
    border: 0; border-radius: 999px; background: none; color: var(--text-2); font-size: .92rem; font-weight: 600; cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.hc-rv__like svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform .2s ease; }
.hc-rv__like:hover { background: #fbeeee; color: #e0245e; }
.hc-rv__like[aria-pressed="true"] { color: #e0245e; }
.hc-rv__like[aria-pressed="true"] svg { fill: currentColor; }
.hc-rv__like.is-pop svg { transform: scale(1.3); }
.hc-rv__like:disabled { opacity: .6; cursor: wait; }

.hc-rv__ctrl { display: flex; justify-content: center; gap: .7rem; margin-top: .4rem; }
.hc-rv__nav {
    width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    background: #fff; color: var(--hc-teal); box-shadow: 0 6px 18px -6px rgba(0, 0, 0, .35);
    transition: opacity .15s ease, transform .15s ease;
}
.hc-rv__nav svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.hc-rv__nav:hover { transform: scale(1.06); }
.hc-rv__nav[disabled] { opacity: .35; pointer-events: none; box-shadow: none; }

.hc-rv__links { margin: 1.1rem 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.2rem; font-size: .92rem; color: var(--text-2); }
.hc-rv__links a { color: var(--hc-teal); font-weight: 700; text-decoration: none; }
.hc-rv__links a:hover { text-decoration: underline; }

@media (max-width: 1024px) {
    .hc-rv__track { grid-auto-columns: calc((100% - 1.2rem) / 2); }
}
/* Telefon: bir kart + sonrakinin ucu görünür (kaydırılabildiği belli olsun); oklar gizli, parmakla kaydırılır */
@media (max-width: 700px) {
    .hc-rv__track { grid-auto-columns: 86%; gap: .8rem; margin: 0 calc(-1 * var(--gutter)); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); }
    .hc-rv__ctrl { display: none; }
    .hc-rv__card { padding: 1.1rem; }
}