/* MRI Center Pro Theme — main styles. RTL-first, local assets only. */

:root {
  --mri-blue: #0a6cff;
  --mri-blue-dark: #084cba;
  --mri-cyan: #16c2d5;
  --mri-ink: #0f2540;
  --mri-muted: #5b6b82;
  --mri-bg: #f4f8fd;
  --mri-card: #ffffff;
  --mri-border: #e2ecf7;
  --mri-radius: 14px;
  --mri-shadow: 0 10px 30px rgba(10, 60, 120, 0.08);
  --mri-font: "Vazirmatn", "Sahel", "Tahoma", "Segoe UI", "Geeza Pro", "DejaVu Sans", system-ui, sans-serif;
  --mri-container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--mri-font);
  color: var(--mri-ink);
  background: var(--mri-bg);
  line-height: 1.8;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; }
a { color: var(--mri-blue-dark); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { color: var(--mri-ink); line-height: 1.35; }

.mri-container { width: 100%; max-width: var(--mri-container); margin-inline: auto; padding-inline: 20px; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }
.skip-link { background: var(--mri-blue); color: #fff; padding: 8px 14px; border-radius: 8px; position: absolute; z-index: 999; }

/* Buttons */
.mri-btn { display: inline-block; border: none; border-radius: 10px; padding: 12px 22px; font-size: 16px; font-weight: 700; cursor: pointer; text-align: center; transition: transform .15s, box-shadow .2s, background .2s; }
.mri-btn-primary { background: linear-gradient(135deg, var(--mri-blue), var(--mri-cyan)); color: #fff; }
.mri-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(10,108,255,.25); text-decoration: none; }
.mri-btn-ghost { background: #fff; color: var(--mri-blue-dark); border: 1.5px solid var(--mri-border); }
.mri-btn-ghost:hover { background: #eef4ff; text-decoration: none; }

/* Announcements */
.mri-announce { background: #eef6ff; color: var(--mri-blue-dark); text-align: center; padding: 10px; font-size: 14px; }
.mri-emergency { background: #fdeaea; color: #b23131; text-align: center; padding: 10px; font-size: 14px; font-weight: 700; }

/* Header */
.mri-header { background: #fff; border-bottom: 1px solid var(--mri-border); position: sticky; top: 0; z-index: 100; }
.mri-header-inner { display: flex; align-items: center; gap: 16px; padding-block: 12px; flex-wrap: wrap; }
.mri-brand-link { display: flex; align-items: center; gap: 10px; font-weight: 800; color: var(--mri-ink); font-size: 18px; }
.mri-brand img { border-radius: 10px; }
.mri-nav { flex: 1; }
.mri-menu { list-style: none; display: flex; gap: 8px; margin: 0; padding: 0; flex-wrap: wrap; }
.mri-menu li a { padding: 8px 12px; border-radius: 8px; color: var(--mri-ink); font-weight: 600; }
.mri-menu li a:hover { background: #eef4ff; text-decoration: none; }
.mri-header-actions { display: flex; gap: 8px; }
.mri-burger { display: none; background: none; border: none; cursor: pointer; padding: 8px; }
.mri-burger span { display: block; width: 26px; height: 3px; background: var(--mri-ink); margin: 4px 0; border-radius: 2px; }
.mri-mobile-menu { background: #fff; border-top: 1px solid var(--mri-border); }
.mri-mobile-menu .mri-menu { flex-direction: column; padding: 12px; }

/* Hero */
.mri-hero { background: linear-gradient(135deg, rgba(10,108,255,.06), rgba(22,194,213,.08)); padding: 56px 0; }
.mri-hero-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 36px; align-items: center; }
.mri-hero h1 { font-size: 38px; margin: 0 0 14px; }
.mri-hero p { color: var(--mri-muted); font-size: 18px; }
.mri-hero-actions { display: flex; gap: 12px; margin-top: 22px; flex-wrap: wrap; }
.mri-hero-img { width: 100%; border-radius: var(--mri-radius); box-shadow: var(--mri-shadow); }

/* Sections */
.mri-section { padding: 48px 0; }
.mri-section-title { text-align: center; margin-bottom: 28px; }
.mri-section-title h2 { font-size: 28px; margin: 0 0 8px; }
.mri-section-title p { color: var(--mri-muted); margin: 0; }

.mri-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.mri-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.mri-card-box { background: #fff; border: 1px solid var(--mri-border); border-radius: var(--mri-radius); padding: 24px; box-shadow: var(--mri-shadow); }
.mri-card-box h3 { margin-top: 0; }
.mri-feature-ico { width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg, var(--mri-blue), var(--mri-cyan)); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; margin-bottom: 10px; }

/* Stats */
.mri-stats { background: linear-gradient(135deg, var(--mri-blue), var(--mri-cyan)); color: #fff; }
.mri-stats .mri-grid-4 { color: #fff; }
.mri-stat { text-align: center; padding: 14px; }
.mri-stat .num { font-size: 34px; font-weight: 800; display: block; }
.mri-stat .lbl { opacity: .9; }

/* Process */
.mri-process { counter-reset: step; }
.mri-step { display: flex; gap: 16px; align-items: flex-start; padding: 14px 0; }
.mri-step .n { width: 40px; height: 40px; flex: none; border-radius: 50%; background: #eef4ff; color: var(--mri-blue-dark); font-weight: 800; display: flex; align-items: center; justify-content: center; }
.mri-step h4 { margin: 0 0 4px; }
.mri-step p { margin: 0; color: var(--mri-muted); }

/* Map / contact */
.mri-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }

/* Footer */
.mri-footer { background: #0f2540; color: #cfe0f5; margin-top: 40px; padding-top: 36px; }
.mri-footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding-bottom: 24px; }
.mri-footer h3 { color: #fff; font-size: 16px; }
.mri-footer a { color: #aed3ff; }
.mri-footer ul { list-style: none; padding: 0; margin: 0; }
.mri-footer li { padding: 4px 0; }
.mri-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); padding: 16px 0; font-size: 13px; }
.mri-disclaimer { opacity: .7; font-size: 12px; }

/* Single / archive content */
.mri-content { background: #fff; border: 1px solid var(--mri-border); border-radius: var(--mri-radius); padding: 32px; margin: 28px 0; box-shadow: var(--mri-shadow); }
.mri-post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.mri-post-card { background: #fff; border: 1px solid var(--mri-border); border-radius: var(--mri-radius); padding: 20px; box-shadow: var(--mri-shadow); }
.mri-post-card h3 { margin-top: 0; }
.mri-post-card .meta { color: var(--mri-muted); font-size: 13px; }
.mri-faq-item { background: #fff; border: 1px solid var(--mri-border); border-radius: 10px; padding: 4px 16px; margin-bottom: 10px; }
.mri-faq-item summary { cursor: pointer; font-weight: 600; padding: 10px 0; }

/* Accessibility */
:focus-visible { outline: 3px solid var(--mri-blue); outline-offset: 2px; }

/* Responsive */
@media (max-width: 980px) {
  .mri-hero-grid, .mri-contact-grid { grid-template-columns: 1fr; }
  .mri-grid-3, .mri-grid-4, .mri-post-grid { grid-template-columns: repeat(2, 1fr); }
  .mri-footer-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .mri-menu { display: none; }
  .mri-burger { display: block; margin-inline-start: auto; }
  .mri-header-actions { width: 100%; }
  .mri-grid-3, .mri-grid-4, .mri-post-grid, .mri-footer-grid { grid-template-columns: 1fr; }
  .mri-hero h1 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* v1.3 lively visual layer — lightweight and accessibility-aware */
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 15% 15%,rgba(22,194,213,.08),transparent 28%),radial-gradient(circle at 85% 25%,rgba(10,108,255,.08),transparent 30%)}
.mri-header{background:rgba(255,255,255,.9);backdrop-filter:blur(16px);box-shadow:0 8px 30px rgba(15,37,64,.04)}.mri-header.is-scrolled{box-shadow:0 10px 35px rgba(15,37,64,.12)}
.mri-menu li a{position:relative}.mri-menu li a:after{content:"";position:absolute;inset-inline:12px;bottom:2px;height:2px;background:linear-gradient(90deg,var(--mri-blue),var(--mri-cyan));transform:scaleX(0);transition:transform .25s}.mri-menu li a:hover:after,.mri-menu .current-menu-item>a:after{transform:scaleX(1)}
.mri-hero{position:relative;overflow:hidden;min-height:560px;display:grid;align-items:center}.mri-hero:before,.mri-hero:after{content:"";position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.mri-hero:before{width:420px;height:420px;background:rgba(10,108,255,.08);top:-180px;right:-90px;animation:mriFloat 8s ease-in-out infinite}.mri-hero:after{width:300px;height:300px;background:rgba(22,194,213,.09);bottom:-150px;left:-80px;animation:mriFloat 10s ease-in-out infinite reverse}.mri-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;background:#fff;border:1px solid var(--mri-border);box-shadow:var(--mri-shadow);border-radius:999px;color:var(--mri-blue-dark);font-size:13px;font-weight:800}.mri-kicker:before{content:"";width:8px;height:8px;background:#22c55e;border-radius:50%;box-shadow:0 0 0 5px rgba(34,197,94,.12);animation:mriPulse 2s infinite}.mri-hero h1{font-size:clamp(34px,5vw,58px);letter-spacing:-1.5px;background:linear-gradient(135deg,var(--mri-ink),var(--mri-blue-dark));-webkit-background-clip:text;background-clip:text;color:transparent}.mri-hero-visual{position:relative}.mri-hero-img{position:relative;z-index:2;transform:perspective(900px) rotateY(-4deg);transition:transform .5s;box-shadow:0 30px 70px rgba(10,60,120,.18)}.mri-hero-visual:hover .mri-hero-img{transform:perspective(900px) rotateY(0) translateY(-6px)}.mri-orbit{position:absolute;border:1px dashed rgba(10,108,255,.28);border-radius:50%;animation:mriRotate 18s linear infinite}.mri-orbit-one{width:120%;aspect-ratio:1;inset:-10%;}.mri-orbit-two{width:90%;aspect-ratio:1;inset:5%;animation-direction:reverse;animation-duration:13s}.mri-card-box{position:relative;overflow:hidden;transition:transform .28s,box-shadow .28s,border-color .28s}.mri-card-box:before{content:"";position:absolute;width:110px;height:110px;border-radius:50%;background:linear-gradient(135deg,rgba(10,108,255,.12),rgba(22,194,213,.08));top:-70px;left:-55px;transition:transform .35s}.mri-card-box:hover{transform:translateY(-7px);box-shadow:0 20px 45px rgba(10,60,120,.13);border-color:rgba(10,108,255,.25)}.mri-card-box:hover:before{transform:scale(1.5)}.mri-feature-ico{box-shadow:0 10px 24px rgba(10,108,255,.2);transition:transform .3s}.mri-card-box:hover .mri-feature-ico{transform:rotate(-5deg) scale(1.08)}.mri-btn-primary{position:relative;overflow:hidden}.mri-btn-primary:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.35) 45%,transparent 65%);transform:translateX(-120%)}.mri-btn-primary:hover:before{animation:mriShine .7s}.mri-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}.mri-reveal.is-visible{opacity:1;transform:none}.mri-stats{position:relative;overflow:hidden}.mri-stat .num{text-shadow:0 8px 24px rgba(0,0,0,.16)}
@keyframes mriFloat{50%{transform:translateY(25px) translateX(-12px)}}@keyframes mriRotate{to{transform:rotate(360deg)}}@keyframes mriPulse{50%{box-shadow:0 0 0 9px rgba(34,197,94,0)}}@keyframes mriShine{to{transform:translateX(120%)}}
@media(max-width:640px){.mri-hero{min-height:auto;padding:46px 0}.mri-hero-grid{gap:28px}.mri-hero-visual{max-width:460px;margin:auto}.mri-header-actions .mri-btn-ghost{display:none}}
@media(prefers-reduced-motion:reduce){.mri-reveal{opacity:1;transform:none}.mri-orbit,.mri-kicker:before,.mri-hero:before,.mri-hero:after{animation:none!important}}