.app-link{
    text-decoration: none;
    color: #667eea;
}

.app-link:hover{
    text-decoration: none;
    color: #667eea;
}

/* "De ce DAUNE.expert": titlurile cardurilor micșorate pe mobil ca să încapă pe un singur rând
   (clasă proprie, nu .home-explore-title direct — folosită și pe homepage la secțiunea "Explorează",
   unde rămâne neschimbată). */
@media (max-width: 767px) {
    .why-diff-title {
        font-size: clamp(0.58rem, calc(4vw - 3.5px), 1rem) !important;
    }
}

.app-mention {
    font-style: italic;
    color: #667eea;
}

/* Wrapper dedicat /asistenta-calatorie: aceeași imagine (bg.jpg) folosită azi prin .wrapper (generică,
   folosită și de calatorie-bt/calatorie-rf, neatinsă), mutată aici ca variantă scopată — vezi §3 din
   REDESIGN_CALATORIE.md. */
.wrapper-calatorie {
    background: url('../img/bg.jpg') no-repeat center 40px fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
/* /asistenta-calatorie primește și ea clasa .page-home (vezi layouts/first.blade.php) — la fel ca la
   rutier, fundalul se mută exclusiv în .home-above-fold, ca să nu se vadă prin restul paginii. */
.page-home .wrapper-calatorie { background: none; }
/* Above-fold: aceeași imagine, ca fundal activ de hero (poză + overlay), în loc de urmă transparentă */
.wrapper-calatorie .home-above-fold {
    background-image: url('../img/bg.jpg');
}

/* =====================================================
   PRIM EXEMPLU — paletă navy + albastru deschis (DirectDoc)
   Navy #393978 și cyan #0bc7d3 extrase din logo-ul DirectDoc
   (public/img/directdoc-logo-200x100.png). Înlocuiesc verde-închis
   (#1a3d18) / verde-deschis (#c8da2b) DOAR pe /asistenta-calatorie —
   formularul de plată (wizard, butoane BT/Odero) rămâne neatins
   în acest prim exemplu, ca zonă sensibilă la achiziție.
   ===================================================== */

/* Hero: overlay navy peste poza de fundal, în loc de verde-închis */
.wrapper-calatorie .home-above-fold::before {
    background: linear-gradient(180deg, rgba(30,30,70,.72) 0%, rgba(30,30,70,.42) 45%, rgba(20,20,55,.80) 100%);
}
/* Eyebrow pe fundal închis (hero) → cyan; eyebrow pe fundal alb (restul secțiunilor) → navy */
.wrapper-calatorie .home-eyebrow {
    color: #0bc7d3;
}
.wrapper-calatorie .home-eyebrow-dark {
    color: #393978;
}
/* Chips țări din hero — bordură cyan discretă */
.wrapper-calatorie .calatorie-chip {
    border-color: rgba(11,199,211,0.55);
}
/* CTA principal hero: navy plin, hover cyan */
.wrapper-calatorie .calatorie-hero-cta-primary {
    background-color: #393978 !important;
    border-color: #393978 !important;
}
.wrapper-calatorie a.btn-success.calatorie-hero-cta-primary:hover {
    background-color: #0bc7d3 !important;
    border-color: #0bc7d3 !important;
    color: #1a1a3d !important;
}
/* CTA secundar hero ("Vezi lista completă de beneficii") — outline navy.
   Specificitate ridicată explicit (a.btn-success.home-cta-secondary:hover) ca să câștige
   față de regula FIX ".wrapper-calatorie a.btn-success:hover{color:#000}" de mai jos. */
.wrapper-calatorie .home-cta-secondary {
    border-color: #393978 !important;
    color: #393978 !important;
}
.wrapper-calatorie a.btn-success.home-cta-secondary:hover {
    background-color: #393978 !important;
    border-color: #393978 !important;
    color: #fff !important;
}

/* Iconițele din cardurile de beneficii — tentă cyan în loc de verde */
.wrapper-calatorie .calatorie-benefit-icon {
    background: rgba(11,199,211,0.14);
}
.wrapper-calatorie .calatorie-benefit-card:hover {
    border-color: #393978;
}

/* "De ce DAUNE.expert" — bifele și titlurile navy/cyan */
.wrapper-calatorie .home-explore-icon {
    color: #0a99a3;
}
.wrapper-calatorie .home-explore-title {
    color: #393978;
}
.wrapper-calatorie .home-explore-card:hover {
    border-color: #393978;
}

/* "Cum funcționează" — numerele pașilor navy, telefon/non-stop albastru deschis */
.wrapper-calatorie .home-step-number {
    background: #393978;
}
.wrapper-calatorie .home-phone-link {
    color: #0bc7d3;
}
.wrapper-calatorie .home-phone-link:hover {
    color: #393978;
}

/* Banda "Vacanța perfectă începe cu liniștea că ești acoperit" — navy în loc de verde-închis,
   cu bordură bold sus/jos în albastru deschis (același tratament ca la rutier, dar cu accent cyan). */
.wrapper-calatorie .coverage-cta-section {
    background-color: #393978 !important;
    border-top: 4px solid #0bc7d3;
    border-bottom: 4px solid #0bc7d3;
}
.wrapper-calatorie .coverage-cta-btn {
    background-color: #0bc7d3 !important;
    border-color: #0bc7d3 !important;
    color: #1a1a3d !important;
}
.wrapper-calatorie a.btn-success.coverage-cta-btn:hover {
    background-color: #fff !important;
    border-color: #fff !important;
    color: #393978 !important;
}

/* FAQ — navy/cyan doar pe /asistenta-calatorie (.blog-faq e folosit și pe alte pagini din site,
   care rămân neschimbate: nu se atinge clasa direct, doar scopat sub .wrapper-calatorie). */
.wrapper-calatorie .blog-faq-header {
    background: linear-gradient(90deg, #393978 0%, #0bc7d3 100%);
}
.wrapper-calatorie .blog-faq-toggle {
    background: linear-gradient(90deg, #393978 0%, #0bc7d3 100%);
}

/* Preț și titlu card formular — navy în loc de verde-închis (doar afișaj, formularul propriu-zis
   rămâne neatins) */
.wrapper-calatorie .home-price-amount,
.wrapper-calatorie .home-price-currency {
    color: #393978;
}
.wrapper-calatorie .calatorie-form-name {
    color: #393978;
}

/* Hero: chips țări (România / Bulgaria / Grecia) */
.calatorie-hero-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}
.calatorie-chip {
    display: inline-block;
    padding: 0.3rem 0.9rem;
    border-radius: 20px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #fff;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.35);
}

/* Beneficii: card cu icon + efect hover reluat de la .home-explore-card (bordură verde + umbră) —
   identic cu tratamentul aplicat la rutier, redenumit pentru scope-ul acestei pagini. */
.calatorie-benefit-card {
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.calatorie-benefit-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.09);
    border-color: #61953A;
}
.calatorie-benefit-icon {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    background: rgba(97,149,58,0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 6px;
    margin-bottom: 1rem;
}
.calatorie-benefit-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.calatorie-benefit-card .card-title {
    font-size: 1rem;
    line-height: 1.3;
}
.calatorie-benefit-card .card-body p {
    font-size: 0.85rem;
}
@media (max-width: 480px) {
    .calatorie-benefit-icon {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        margin-bottom: 0.75rem;
    }
    .calatorie-benefit-card .card-title {
        font-size: 0.9rem;
    }
    .calatorie-benefit-card .card-body p {
        font-size: 0.8rem;
    }
}

/* Formular: look reluat de la .home-product-card / .rutier-form-card (bordură subțire, colțuri rotunjite) */
.calatorie-form-card {
    border: 1px solid #e0e0e0;
    border-radius: 16px;
    background: #fff;
}
.calatorie-form-header {
    text-align: center;
    padding: 2rem 1.5rem 1.5rem;
    border-bottom: 1px solid #eee;
    margin-bottom: 1.5rem;
}
.calatorie-form-name {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1a3d18;
    margin-bottom: 0.75rem;
}
.calatorie-form-body {
    padding: 0 2.5rem 2rem;
}
.calatorie-form-section-label {
    display: flex;
    align-items: center;
    margin-top: 1.5rem;
}
.calatorie-form-section-label p {
    font-size: 20px;
    font-weight: bold;
    margin-left: 10px !important;
}
.calatorie-form-card .form-control {
    border-radius: 8px;
    border: 1px solid #ddd;
    padding: 0.6rem 0.9rem;
    height: auto;
}
.calatorie-form-card .form-control:focus {
    border-color: #393978;
    box-shadow: 0 0 0 0.15rem rgba(57,57,120,0.15);
}

@media (max-width: 768px) {
    .calatorie-form-body { padding: 0 1.25rem 1.5rem; }
}

/* FIX: blog-post.css definește global "a:hover{color:#5d8e28 !important}" (gândit pt. link-uri din
   articole), dar se încarcă și pe această pagină pt. stilul FAQ și suprascrie culorile de hover ale
   butoanelor/link-urilor de mai jos. */
.wrapper-calatorie a.btn-success:hover { color: #000 !important; }
.wrapper-calatorie .home-explore-link:hover,
.wrapper-calatorie .home-explore-link:focus { color: #1a3d18 !important; }

/* CTA discount (deasupra formularului): banda navy pe toată lățimea, cu bordură bold sus/jos
   în albastru deschis — la fel ca banda "Vacanța perfectă". */
.wrapper-calatorie .summer-trigger {
    background-color: #393978 !important;
    padding: 3rem 20px;
    margin-top: 0;
    border-top: 4px solid #0bc7d3;
    border-bottom: 4px solid #0bc7d3;
}
.wrapper-calatorie .summer-trigger-subtitle {
    color: rgba(255,255,255,0.85);
}
.wrapper-calatorie .summer-trigger-btn {
    background: linear-gradient(135deg, #0bc7d3 0%, #4fd8e0 100%);
    color: #1a1a3d;
}
.wrapper-calatorie .summer-trigger-btn:hover {
    background: linear-gradient(135deg, #4fd8e0 0%, #0bc7d3 100%);
    color: #1a1a3d;
}

/* WIZARD: indicator de progres și tranziție între pași */
.wizard-dots {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    margin-bottom: 4px;
}

.wizard-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ccc;
    display: inline-block;
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
}

.wizard-dot.active {
    background: #0bc7d3;
}

#wizard-step-1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.odero-btn-custom{
    background-color: #334D37;
    padding: 2px 0px 2px 0px;
    border: none;
    transition: ease-in-out;
}

.odero-btn-custom:hover{
    background: #35D32F;
    background: linear-gradient(90deg, rgba(53, 211, 47, 1) 0%, rgba(87, 199, 133, 1) 50%, rgba(51, 77, 55, 1) 100%);
    border: none;
    color: #fff;
    transition: ease-in-out;
}

/* Butonul "Continuă" din wizard + butoanele de plată (BT/Odero) — navy, doar pe această pagină. */
.wrapper-calatorie #wizard-next {
    background-color: #393978 !important;
    border-color: #393978 !important;
}
.wrapper-calatorie #wizard-next:hover {
    background-color: #0bc7d3 !important;
    border-color: #0bc7d3 !important;
    color: #1a1a3d !important;
}
.wrapper-calatorie button.btn-success.submit-btn:not(.odero-btn-custom) {
    background-color: #393978 !important;
    border-color: #393978 !important;
}
.wrapper-calatorie .odero-btn-custom {
    background-color: #393978 !important;
}
.wrapper-calatorie .odero-btn-custom:hover {
    background: linear-gradient(90deg, #0bc7d3 0%, #4fd8e0 50%, #393978 100%) !important;
}

.odero-btn-custom-pay{
    transform: translateY(3px);
}

.pay-btn-custom{
    border: none !important;
}

.pay-inline{
    display: inline-flex;
    align-items: center;
    gap: .25em;
}

.pay-logo{
    display: inline-block;
    height: 1.1em;
}

.pay-logo-bt{
    transform: translateY(4px);
}

@media (max-width: 480px) {
    .pay-btn-custom{
        font-size: 1rem !important;
    }

    .odero-btn-custom-pay {
        width: 75px !important;
    }
    .bt-btn-custom-pay {
        width: 25px !important;
    }
}

/* Navbar hover — albastru deschis (cyan) DOAR pe /asistenta-calatorie. Navbar-ul e randat în
   layouts/first.blade.php, în afara .wrapper-calatorie (înaintea @yield('content')), deci nu poate
   fi scopat prin .wrapper-calatorie; în schimb, scriptul din calatorie.blade.php adaugă
   .navbar-calatorie-theme pe <nav> doar când se randează această pagină (nu și pe homepage/rutier,
   care folosesc același .navbar-home și trebuie să rămână cu hover verde/lime). Specificitate
   ridicată explicit ca să câștige față de regulile .navbar-home(:not)(.scrolled) .nav-link:hover
   din style.css. */
.navbar-home.navbar-calatorie-theme:not(.scrolled) .nav-link:hover,
.navbar-home.navbar-calatorie-theme.scrolled .nav-link:hover {
    color: #0bc7d3 !important;
}

/* POP-UP "Bonus la cumpărare — 20% reducere la ARODEC" — navy/cyan DOAR pe /asistenta-calatorie.
   Partialul partials/summer-popup e reutilizat neschimbat pe homepage și pe /asistenta-rutiera
   (unde rămâne verde), de-asta orice regulă de aici e scopată sub .wrapper-calatorie. */
.wrapper-calatorie .summer-modal-icon {
    background: linear-gradient(135deg, #393978, #0bc7d3);
}
.wrapper-calatorie .summer-modal-eyebrow {
    color: #393978;
}
.wrapper-calatorie .summer-modal-title {
    color: #393978;
}
.wrapper-calatorie .summer-modal-body strong {
    color: #393978;
}
.wrapper-calatorie .summer-modal-badge {
    background: rgba(11,199,211,0.12);
    color: #393978;
}
.wrapper-calatorie .summer-modal-cta {
    background-color: #393978 !important;
    border-color: #393978 !important;
}
.wrapper-calatorie a.btn-success.summer-modal-cta:hover {
    background-color: #0bc7d3 !important;
    border-color: #0bc7d3 !important;
    color: #1a1a3d !important;
}

/* Link "Termenii si conditiile" din formular — navy în loc de verde (.text-success e utilitară
   Bootstrap, dar pe această pagină e folosită doar aici, o singură dată). Funcționalitatea
   checkbox-ului "agree" nu e atinsă, doar culoarea textului link-ului. */
.wrapper-calatorie a.text-success {
    color: #393978 !important;
}

/* CTA "Vacanța perfectă începe cu liniștea că ești acoperit." — pe mobil (≤768px) trebuie să încapă
   pe maximum 2 rânduri; sub ~404px lățime, dimensiunea fixă ".home-title{font-size:1.6rem}" din
   style.css produce 3 rânduri. Scădem în jos doar sub acel prag — scopat strict la acest CTA
   (nu la .home-title global, folosit de multe alte titluri de secțiune pe tot site-ul).
   IMPORTANT: style.css are o regulă veche ".container{width:95%}" (linia ~210) care se aplică sub
   992px lățime, deci containerul e cu ~5% mai îngust decât lățimea ecranului — un calcul care
   ignoră acest lucru (varianta anterioară) rămâne prea aproape de limită și tot trece pe 3 rânduri.
   Formula de mai jos ține cont de acest -5% și lasă o marjă de siguranță de-a lungul întregului
   interval 320-768px, verificată prin măsurarea reală a lățimii textului randat. */
@media (max-width: 768px) {
    .wrapper-calatorie .coverage-cta-section .home-title {
        font-size: clamp(1rem, calc(7.1vw - 4.6px), 1.6rem) !important;
    }
}

/* Butonul "Cumpără ARODEC Travel — 130 RON" din acest CTA — puțin mai mic pe mobil (font + padding
   reduse); pe desktop rămâne neschimbat (.btn-lg.px-5 din Bootstrap). Valori verificate prin
   randare reală (nu doar calcul), la fel ca la titlu mai sus. */
@media (max-width: 768px) {
    .wrapper-calatorie .coverage-cta-btn {
        font-size: 0.85rem !important;
        padding: 0.65rem 1rem !important;
    }
}

/* Rând de preț în hero — folosit doar pe varianta cu discount (calatorie-bt), care afișează
   prețul redus direct în hero, spre deosebire de ARODEC Travel standard (fără discount). */
.hero-price-row {
    margin-bottom: 1.5rem;
}
.hero-price-old {
    color: rgba(255,255,255,0.55);
    text-decoration: line-through;
    font-size: 1.1rem;
    margin-right: 0.5rem;
}
.hero-price-new {
    color: #fff;
    font-size: 1.8rem;
    font-weight: 800;
}
.hero-price-suffix {
    color: rgba(255,255,255,0.75);
    font-size: 0.9rem;
    margin-left: 0.4rem;
}

/* Preț tăiat în header-ul formularului — pereche cu .home-price-amount (style.css), folosită doar
   pe calatorie-bt, unde formularul standard nu are preț redus de afișat. */
.home-price-old {
    font-size: 1.1rem;
    color: #999;
    text-decoration: line-through;
    margin-right: 0.5rem;
}

/* Badge ofertă sub prețul din formular (calatorie-bt) — navy, consistent cu paleta DirectDoc a paginii */
.calatorie-form-badge {
    display: inline-block;
    margin-top: 0.5rem;
    padding: 4px 12px;
    background: rgba(57,57,120,0.10);
    color: #393978;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 20px;
}

.home-hero-title .home-subtitle {
    display: block;
    font-size: 1.125rem;        /* valoarea pe care o avea <p>-ul inainte */
    font-weight: 400;           /* AICI e bold-ul din screenshot */
    line-height: 1.5;
    letter-spacing: normal;
    text-transform: none;
    text-shadow: none;          /* daca titlul are text-shadow, il scoti de pe subtitlu */
    font-family: inherit;       /* doar daca h1 foloseste alt font decat body */
    margin-top: 0.75rem;
    margin-bottom: 0;
}