/* ===========================================================
   IL CAZAR — C North | Google Landing (No-Form)
   إضافات فوق style.css الأساسي: نافبار، أزرار اتصال/واتساب،
   شريط CTA ثابت للموبايل، وتعديل الهيرو لعمود واحد.
   =========================================================== */

:root {
    --black: #07171A;
    --black-soft: #0B2428;
    --black-card: #0D2B30;
    --ivory: #FFF7E8;
    --muted: #B6C8C7;
    --line: rgba(212, 247, 244, 0.14);
    --neon: #55E6DF;
    --neon-dim: #21BDB8;
    --gold: #FF9A5C;
    --glow: 0 0 14px rgba(85, 230, 223, .46), 0 0 36px rgba(85, 230, 223, .2);
    --wa: #25D366;
    --call: var(--neon);
}

/* ---------- Nav links inside header ---------- */
.nav {
    display: flex;
    align-items: center;
    gap: 26px;
}
.nav__links {
    display: flex;
    align-items: center;
    gap: 22px;
    list-style: none;
}
.nav__links a {
    font-family: var(--font-head);
    font-size: 1rem;
    color: var(--ivory);
    opacity: .85;
    position: relative;
    padding: 4px 0;
    transition: color .25s ease, opacity .25s ease;
}
.nav__links a::after {
    content: '';
    position: absolute;
    inset: auto 0 -4px 0;
    height: 2px;
    background: var(--neon);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .3s ease;
    box-shadow: var(--glow);
}
.nav__links a:hover,
.nav__links a.active { color: var(--neon); opacity: 1; }
.nav__links a:hover::after,
.nav__links a.active::after { transform: scaleX(1); }

.header__actions { display: flex; align-items: center; gap: 10px; }

/* ---------- Call / WhatsApp buttons ---------- */
.btn-call {
    background: var(--neon);
    color: #04150E;
    box-shadow: var(--glow);
}
.btn-call:hover { transform: translateY(-3px); box-shadow: 0 0 22px rgba(57,255,176,.85), 0 0 60px rgba(57,255,176,.35); }
.btn-wa {
    background: var(--wa);
    color: #04210F;
    box-shadow: 0 8px 24px rgba(37,211,102,.4);
}
.btn-wa:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(37,211,102,.6); }

.btn svg { width: 20px; height: 20px; }
.header .btn { padding: 10px 18px; font-size: .9rem; }

.cta-row {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}
.cta-row.center { justify-content: center; }

/* ---------- Hero (single column for no-form version) ---------- */
.hero--solo .container { display: block; max-width: 820px; text-align: center; }
.hero--solo .hero__eyebrow {
    display: block;
    margin-bottom: 14px;
}
.hero--solo .hero__eyebrow::before { display: none; }
.hero--solo .hero__sub { margin-inline: auto; }
.hero--solo .hero__location { justify-content: center; }
.hero--solo .hero__price { margin-inline: auto; }
.hero--solo .cta-row { margin-top: 28px; justify-content: center; }
.hero--solo .btn { font-size: 1.1rem; padding: 16px 32px; }
.hero--solo .hero__bg {
    background-position: 62% center;
    transform: none;
}
.hero--solo {
    min-height: auto;
    align-items: flex-start;
}
.hero--solo .hero__bg::after {
    background: linear-gradient(to top, #07171A 1%, rgba(7,23,26,.5) 50%, rgba(7,23,26,.65) 100%);
}
.launch-pill {
    display: table;
    margin: 0 auto 14px;
    padding: 7px 16px;
    border: 1px solid rgba(255,154,92,.7);
    border-radius: 999px;
    color: #FFD0B3;
    background: rgba(255,112,48,.16);
    font-family: var(--font-en);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: 2px;
    box-shadow: 0 0 22px rgba(255,112,48,.2);
}

/* ---------- EOI ---------- */
.eoi-section { background: linear-gradient(145deg, #0B2428, #07171A); }
.eoi-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-width: 920px;
    margin: 0 auto;
}
.eoi-card {
    padding: 30px 22px;
    text-align: center;
    background: rgba(13,43,48,.9);
    border: 1px solid rgba(85,230,223,.3);
    border-radius: var(--radius);
}
.eoi-card span { display: block; color: var(--muted); margin-bottom: 10px; }
.eoi-card strong {
    display: block;
    color: var(--neon);
    font-family: var(--font-head);
    font-size: clamp(1.7rem, 4vw, 2.35rem);
    text-shadow: var(--glow);
}
.eoi-card small { font-size: .85rem; color: var(--ivory); text-shadow: none; }

/* ---------- Big contact section ---------- */
.contact-section { text-align: center; }
.contact-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
    max-width: 720px;
    margin: 0 auto;
}
.contact-card {
    background: var(--black-card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 38px 26px;
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.contact-card:hover { transform: translateY(-6px); }
.contact-card.call:hover { border-color: rgba(57,255,176,.5); box-shadow: var(--glow); }
.contact-card.wa:hover { border-color: rgba(37,211,102,.6); box-shadow: 0 10px 30px rgba(37,211,102,.35); }
.contact-card__icon {
    width: 66px; height: 66px; margin: 0 auto 18px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
}
.contact-card.call .contact-card__icon { background: rgba(57,255,176,.1); border: 1px solid rgba(57,255,176,.4); }
.contact-card.wa .contact-card__icon { background: rgba(37,211,102,.12); border: 1px solid rgba(37,211,102,.5); }
.contact-card__icon svg { width: 30px; height: 30px; }
.contact-card.call svg { fill: var(--neon); }
.contact-card.wa svg { fill: var(--wa); }
.contact-card h4 { font-family: var(--font-head); font-size: 1.3rem; margin-bottom: 6px; }
.contact-card .num { color: var(--muted); font-size: 1.05rem; direction: ltr; }

/* ---------- Floating Call + WhatsApp (side stack) ---------- */
.float-btns {
    position: fixed;
    bottom: 22px;
    left: 16px;
    z-index: 90;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.float-btn {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .25s ease, box-shadow .25s ease;
}
.float-btn:hover { transform: translateY(-3px) scale(1.05); }
.float-btn svg { width: 28px; height: 28px; fill: #fff; }
.float-wa {
    background: #25D366;
    box-shadow: 0 8px 26px rgba(37,211,102,.5);
    animation: wa-pulse 2.4s infinite;
}
.float-call {
    background: var(--neon);
    box-shadow: var(--glow);
}
.float-call svg { fill: #04150E; }

/* hide legacy wa-float if any */
.wa-float, .mobile-bar { display: none !important; }

/* ---------- Responsive ---------- */
@media (max-width: 880px) {
    .nav__links { display: none; }
}
@media (max-width: 600px) {
    .hero--solo {
        min-height: auto;
        align-items: flex-start;
        padding: 70px 0 28px;
    }
    .hero--solo .hero__bg {
        background-position: center top;
    }
    .hero--solo h1 { font-size: clamp(1.85rem, 7.5vw, 2.4rem); }
    .hero--solo .hero__sub { font-size: .95rem; margin: 10px 0 16px; }
    .hero--solo .cta-row { margin-top: 16px; gap: 10px; }
    .hero--solo .btn { font-size: .9rem; padding: 13px 18px; width: 100%; }
    .hero--solo .cta-row { flex-direction: column; }
    .header__actions .btn-label { display: none; }
    .header__actions .btn { padding: 10px; border-radius: 50%; width: 42px; height: 42px; }
    .header__actions .btn svg { width: 18px; height: 18px; }
    .contact-cards { grid-template-columns: 1fr; }
    .eoi-grid { grid-template-columns: 1fr; gap: 14px; }
    .float-btns { bottom: 18px; left: 12px; gap: 10px; }
    .float-btn { width: 52px; height: 52px; }
    .float-btn svg { width: 24px; height: 24px; }
    .units-grid { grid-template-columns: 1fr; }
}