/* V7.2 — Homepage modern design layer.
   Loaded after the page's own styles, so everything here is an override:
   the markup, texts (all editable in Website Text) and behaviour are the
   same as before. Deeper hero with light glows and a dot grid, a one-line
   "what do you need?" request box, glass stat cards overlapping the hero,
   gradient icon tiles, swipeable services on phones (EIRADAH idea),
   connected process steps, and a richer final call-to-action. */

/* V8.2: hero and numbers → assets/css/home-v8.css */

/* ---------- Section headings ---------- */
.section-label{display:inline-flex!important;align-items:center;gap:6px;letter-spacing:.4px;text-transform:none;font-size:.8rem;background:#EAF2FC;color:#0B4F93;padding:5px 14px;border-radius:999px;margin-bottom:12px}
.section-title{font-size:1.75rem;letter-spacing:-.2px;line-height:1.3}
@media (min-width:860px){ .section-title{font-size:2.15rem} }

/* V8.2: page cards and services → assets/css/home-v8.css */

/* ---------- Process ---------- */
.process-num{background:linear-gradient(135deg,#1268A8,#063B70);box-shadow:0 0 0 6px #EAF2FC,0 8px 18px rgba(6,59,112,.25)}
.process-step::before{background:linear-gradient(180deg,#1268A8,#DCEAFB)!important}
@media (min-width:900px){ .process-step::before{background:linear-gradient(90deg,#DCEAFB,#1268A8,#DCEAFB)!important} }

/* ---------- About ---------- */
.about-card{border-radius:18px;border-color:#E6ECF3;transition:transform .2s,box-shadow .2s}
.about-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(15,30,51,.08)}
.about-card .icon{background:linear-gradient(135deg,#EAF2FC,#DCEAFB);border-radius:12px}

/* ---------- FAQ ---------- */
.faq-item{background:#fff;border:1px solid #E6ECF3;border-radius:16px;margin-bottom:10px;padding:0 16px}
.faq-item[open]{box-shadow:0 10px 26px rgba(15,30,51,.07);border-color:#D3E4F8}

/* ---------- Final call-to-action ---------- */
.cta-box{background:radial-gradient(600px 260px at 90% 0%,rgba(125,211,252,.3),transparent 60%),linear-gradient(135deg,#041A33,#063B70 55%,#0B4F93);border-radius:28px;box-shadow:0 24px 50px rgba(6,32,64,.22)}
.cta-box::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);background-size:22px 22px;pointer-events:none}
.cta-box>*{position:relative}
.cta-buttons .btn{border-radius:14px}

/* ---------- Scroll reveal (assets/js/v7-ui.js adds .kk-reveal) ---------- */
.kk-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
.kk-reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .kk-reveal{opacity:1;transform:none;transition:none}
}