/* ---- Morocco Application brand (colours taken from the logo) ---- */
:root {
  --brand-primary: #e67e0f;      /* logo orange */
  --brand-primary-600: #c96a06;
  --brand-accent: #fba531;       /* light orange */
  --brand-dark: #16171d;         /* logo charcoal */
  --brand-dark-2: #24252d;
  --brand-green: #1e7b34;        /* star green */
  --brand-cream: #fff8ef;
  --ink: #16171d;
  --bs-primary: #e67e0f;
  --bs-primary-rgb: 230, 126, 15;
  --bs-link-color: #c96a06;
  --bs-link-hover-color: #a45505;
}
body { background: #fbfaf8; }
a { color: var(--brand-primary-600); }
::selection { background: rgba(230,126,15,.25); }

/* buttons */
.btn-primary, .btn-warning {
  --bs-btn-color: #fff; --bs-btn-bg: var(--brand-primary); --bs-btn-border-color: var(--brand-primary);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--brand-primary-600); --bs-btn-hover-border-color: var(--brand-primary-600);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: #a45505; --bs-btn-active-border-color: #a45505;
  --bs-btn-disabled-bg: #f0b36f; --bs-btn-disabled-border-color: #f0b36f; --bs-btn-disabled-color: #fff;
  font-weight: 700; box-shadow: 0 6px 18px rgba(230,126,15,.28);
}
.btn-outline-primary {
  --bs-btn-color: var(--brand-primary-600); --bs-btn-border-color: var(--brand-primary);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--brand-primary); --bs-btn-hover-border-color: var(--brand-primary);
  --bs-btn-active-bg: var(--brand-primary-600); --bs-btn-active-border-color: var(--brand-primary-600); --bs-btn-active-color: #fff;
}
.btn-dark { --bs-btn-bg: var(--brand-dark); --bs-btn-border-color: var(--brand-dark); }
.btn-check:checked + .btn-outline-primary, .btn-check:checked + .btn-outline-secondary {
  background: var(--brand-primary); border-color: var(--brand-primary); color: #fff;
}
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: var(--brand-accent); box-shadow: 0 0 0 .25rem rgba(230,126,15,.2);
}
.form-check-input:checked { background-color: var(--brand-primary); border-color: var(--brand-primary); }
.text-primary { color: var(--brand-primary-600) !important; }
.bg-primary { background-color: var(--brand-primary) !important; }

/* navbar: white, with the logo */
.site-navbar { background: rgba(255,255,255,.96) !important; backdrop-filter: blur(8px); box-shadow: 0 1px 0 #eee5da, 0 6px 24px rgba(22,23,29,.06); padding: .45rem 0; }
.site-navbar .navbar-brand { display: flex; align-items: center; gap: .55rem; color: var(--brand-dark); }
.site-navbar .brand-logo { width: 46px; height: 46px; object-fit: contain; }
.site-navbar .brand-text { line-height: 1; display: flex; flex-direction: column; }
.site-navbar .brand-text b { font-size: 1.15rem; font-weight: 800; letter-spacing: .02em; color: var(--brand-dark); }
.site-navbar .brand-text small { font-size: .62rem; font-weight: 700; letter-spacing: .32em; color: var(--brand-primary); text-transform: uppercase; margin-top: 3px; }
.site-navbar .nav-link { color: #3b3d46 !important; font-weight: 600; }
.site-navbar .nav-link:hover, .site-navbar .nav-link.active { color: var(--brand-primary-600) !important; }
.site-navbar .navbar-toggler { border-color: #e6dccf; }
.site-navbar .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(22,23,29,0.85)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
.brand-badge { display: none; }

/* hero: warm light background like the logo */
.hero { background: radial-gradient(circle at 12% 18%, #fff 0%, var(--brand-cream) 45%, #fdebd3 100%) !important; color: var(--brand-dark) !important; border-bottom: 1px solid #f3e3cf; }
.hero::after { background: radial-gradient(circle at 88% 28%, rgba(251,165,49,.28), transparent 42%), radial-gradient(circle at 70% 95%, rgba(30,123,52,.07), transparent 35%) !important; }
.hero .lead, .hero-stats .lbl { color: #555866 !important; }
.hero-stats .num { color: var(--brand-primary) !important; }
.hero-badge { background: #fff !important; color: var(--brand-primary-600) !important; border: 1px solid #f6d3a6 !important; box-shadow: 0 4px 14px rgba(230,126,15,.12); }
.hero-feature { background: #fff !important; border: 1px solid #f1e4d4 !important; color: #3b3d46 !important; box-shadow: 0 4px 14px rgba(22,23,29,.04); }
.hero-features { border-color: #efdfca !important; }
.hero .btn-outline-light { --bs-btn-color: var(--brand-dark); --bs-btn-border-color: var(--brand-dark); --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: var(--brand-dark); font-weight: 600; }
.hero-logo { max-width: 260px; width: 100%; display: block; margin: 0 auto 1.2rem; filter: drop-shadow(0 12px 24px rgba(230,126,15,.18)); }

/* cards / sections */
.app-icon { background: #fff2e2 !important; }
.app-card:hover { border-color: #f6d3a6; }
.how-num, .step-num { background: linear-gradient(135deg, var(--brand-accent), var(--brand-primary)) !important; }
.section-title { color: var(--brand-dark); }
.section-title::after { content: ""; display: block; width: 56px; height: 4px; border-radius: 4px; margin-top: .6rem; background: linear-gradient(90deg, var(--brand-primary), var(--brand-accent)); }
.text-center .section-title::after, .section-title.text-center::after { margin-inline: auto; }
.cta-band { background: linear-gradient(120deg, var(--brand-dark), var(--brand-dark-2)) !important; position: relative; overflow: hidden; }
.cta-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 90% 10%, rgba(251,165,49,.35), transparent 45%); pointer-events: none; }
.cta-band > * { position: relative; }
.faq .accordion-button:not(.collapsed) { background: #fff4e6 !important; color: var(--brand-dark) !important; }
.faq .accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(230,126,15,.2); }
.price-big { color: var(--brand-primary) !important; }
.compare-table thead th { background: #fff4e6 !important; }
.pay-choice, .order-ref { background: #fff6ec !important; }
.timeline li.done::before, .timeline li.done::after { background: var(--brand-green) !important; }

/* phone mockup */
.phone-mock { background: var(--brand-dark) !important; }
.pm-top { background: linear-gradient(90deg, var(--brand-dark), var(--brand-dark-2)) !important; }
.pm-logo { background: var(--brand-primary) !important; color: #fff !important; }

/* footer */
.site-footer { background: var(--brand-dark) !important; position: relative; }
.site-footer::before { content: ""; display: block; height: 4px; background: linear-gradient(90deg, var(--brand-primary), var(--brand-accent) 60%, var(--brand-green)); }
.footer-logo { background: #fff; border-radius: 16px; padding: 10px 14px; display: inline-block; margin-bottom: 1rem; }
.footer-logo img { width: 170px; height: auto; display: block; }
.site-footer .footer-links a:hover { color: var(--brand-accent) !important; }