/* ===== Almasanadah — sector detail page styles ===== */

/* breadcrumb */
.breadcrumb{ display:flex; align-items:center; gap:.5em; font-size:.82rem; color:var(--ink-soft); flex-wrap:wrap; margin-bottom:1.4rem; }
.breadcrumb a:hover{ color:var(--ink); }
.breadcrumb .sep{ width:14px; height:14px; opacity:.5; }
html[dir="rtl"] .breadcrumb .sep{ transform:scaleX(-1); }
.breadcrumb .cur{ color:var(--red-1); font-weight:700; }

/* hero */
.sec-hero{ position:relative; overflow:hidden; padding-top:140px; padding-bottom:clamp(40px,6vw,72px); }
.sec-hero-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(28px,5vw,64px); align-items:center; }
.sec-hero h1{ font-size:clamp(2rem,5vw,3.4rem); margin:.6rem 0 1.2rem; }
.sec-hero .lead{ margin-bottom:1.8rem; }
.sec-illus-frame{ position:relative; aspect-ratio:1/1; max-width:420px; margin-inline:auto; width:100%; display:grid; place-items:center; }
.sec-illus-frame::before, .sec-illus-frame::after{ content:""; position:absolute; border-radius:50%; }
.sec-illus-frame::before{ inset:6%; border:1.5px dashed var(--line); }
.sec-illus-frame::after{ inset:18%; border:1.5px solid var(--line); }
.sec-illus-frame .ring-dot{ position:absolute; width:12px; height:12px; border-radius:50%; }
.sec-illus-frame .rd1{ inset-block-start:4%; inset-inline-start:48%; background:var(--red-1); }
.sec-illus-frame .rd2{ inset-block-end:14%; inset-inline-end:16%; background:var(--green-1); }
.sec-illus-frame .il{ width:46%; height:46%; color:var(--ink); position:relative; z-index:1; }

/* advantages strip */
.adv-strip{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:.5rem; }
.adv-item{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:1.2rem 1.2rem; }
.adv-item .ic{ width:26px; height:26px; color:var(--green-1); margin-bottom:.6rem; }
.adv-item b{ display:block; font-size:.96rem; margin-bottom:.25rem; }
.adv-item span{ font-size:.84rem; color:var(--ink-soft); line-height:1.5; }
@media (max-width:760px){ .adv-strip{ grid-template-columns:1fr; } }

/* categories grid */
.cat-section{ padding-block:clamp(56px,8vw,104px); }
.cat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:3rem; }
.cat-card{ position:relative; background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:1.7rem 1.6rem; transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .3s; overflow:hidden; }
.cat-card::before{ content:""; position:absolute; inset-block-start:0; inset-inline-start:0; width:100%; height:3px; background:linear-gradient(90deg,var(--red-1),var(--green-1)); transform:scaleX(0); transform-origin:inline-start; transition:transform .5s var(--ease); }
.cat-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent; }
.cat-card:hover::before{ transform:scaleX(1); }
.cat-illus{ width:60px; height:60px; border-radius:14px; background:var(--bg-2); display:grid; place-items:center; margin-bottom:1.1rem; }
.cat-illus .il{ width:38px; height:38px; color:var(--ink); }
.cat-card h3{ font-size:1.14rem; font-weight:700; line-height:1.3; }
.cat-card p{ font-size:.9rem; color:var(--ink-soft); line-height:1.55; margin:.5rem 0 0; }
.cat-benefits{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.cat-benefits span{ display:inline-flex; align-items:center; gap:.4em; font-size:.76rem; font-weight:600; color:var(--green-2); background:rgba(30,132,73,.08); border:1px solid rgba(30,132,73,.18); padding:.35em .75em; border-radius:999px; }
@media (max-width:900px){ .cat-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .cat-grid{ grid-template-columns:1fr; } }

/* cta band */
.cta-band{ background:var(--ink); color:#EDEAE3; position:relative; overflow:hidden; }
.cta-band .m-pattern{ opacity:.05; filter:invert(1); }
.cta-inner{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; padding-block:clamp(40px,6vw,72px); }
.cta-inner h2{ color:#fff; font-size:clamp(1.6rem,3.4vw,2.4rem); max-width:18ch; }
.cta-inner p{ color:#B9B4AB; margin:.7rem 0 0; max-width:44ch; }

@media (max-width:820px){ .sec-hero-grid{ grid-template-columns:1fr; } .sec-illus-frame{ order:-1; max-width:320px; } }

/* ===== ABOUT page extras ===== */
.mv-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:3rem; }
@media (max-width:760px){ .mv-grid{ grid-template-columns:1fr; } }
.step-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:3rem; }
.step-card{ position:relative; background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:1.7rem 1.5rem; overflow:hidden; transition:transform .5s var(--ease), box-shadow .5s var(--ease); }
.step-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.step-card .step-no{ font-size:.82rem; font-weight:800; color:var(--line); letter-spacing:.04em; position:absolute; inset-block-start:1.4rem; inset-inline-end:1.4rem; }
.step-card .il{ width:46px; height:46px; color:var(--ink); margin-bottom:1rem; display:block; }
.step-card h3{ font-size:1.06rem; font-weight:700; line-height:1.3; }
.step-card p{ font-size:.88rem; color:var(--ink-soft); line-height:1.55; margin:.5rem 0 0; }
@media (max-width:860px){ .step-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .step-grid{ grid-template-columns:1fr; } }
.vision-band{ background:var(--bg-2); }
.vision-band .vb-inner{ display:flex; align-items:center; gap:clamp(28px,5vw,64px); flex-wrap:wrap; padding-block:clamp(48px,7vw,88px); }
.vision-band .vb-mark{ font-size:clamp(3.4rem,9vw,6rem); font-weight:800; line-height:1; flex-shrink:0; }
html[lang="ar"] .vision-band .vb-mark{ font-weight:700; }
.vision-band .vb-copy{ flex:1; min-width:260px; }
.vision-band .vb-copy h2{ font-size:clamp(1.5rem,3.2vw,2.2rem); margin-bottom:.8rem; }