@charset "UTF-8";
/* ==========================================================================
   مؤسسة محبوب للمقاولات العامة — Prototype Stylesheet
   Afnan Ali WordPress Framework
   الألوان مستخرجة من الشعار الرسمي — brand-guide.md §3
   ========================================================================== */

/* ---------- Fonts (self-hosted, subset: Arabic + Latin basic) ---------- */
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/IBMPlexSansArabic-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/IBMPlexSansArabic-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/IBMPlexSansArabic-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}

/* ---------- Design Tokens ---------- */
:root{
  /* Brand — من الشعار */
  --brand-primary:#064FAD;
  --brand-primary-dark:#00329D;
  --brand-primary-darkest:#042591;
  --brand-primary-light:#0655B6;
  --brand-accent:#0FB6CA;
  --brand-accent-mid:#059FB8;
  --brand-accent-deep:#038FA9;
  --brand-accent-text:#0A6E80;   /* اللون الوحيد المسموح للنص التركوازي — 5.91:1 */
  --brand-accent-soft:#E8F8FA;

  /* Text */
  --text-primary:#0F172A;
  --text-secondary:#475569;
  --text-muted:#64748B;
  --text-inverse:#FFFFFF;

  /* Surfaces */
  --bg:#FFFFFF;
  --surface:#F8FAFC;
  --surface-alt:#F1F5F9;
  --surface-dark:#00329D;
  --surface-darkest:#042591;

  /* Borders */
  --border:#E2E8F0;
  --border-strong:#CBD5E1;
  --border-focus:#064FAD;

  /* State */
  --success:#15803D;--success-bg:#F0FDF4;
  --error:#B91C1C;--error-bg:#FEF2F2;
  --warning:#B45309;--warning-bg:#FFFBEB;
  --whatsapp:#25D366;--whatsapp-dark:#128C7E;

  /* Overlays */
  --overlay-hero:linear-gradient(180deg,rgba(4,37,145,.82) 0%,rgba(4,37,145,.55) 45%,rgba(4,37,145,.72) 100%);
  --overlay-card:linear-gradient(180deg,rgba(15,23,42,0) 40%,rgba(4,37,145,.85) 100%);

  /* Type */
  --font-heading:"IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fs-xs:.8125rem;--fs-sm:.875rem;--fs-base:1rem;--fs-lg:1.125rem;
  --fs-xl:1.375rem;--fs-2xl:1.75rem;--fs-3xl:2.25rem;--fs-4xl:2.75rem;--fs-5xl:3.5rem;
  --fw-regular:400;--fw-semibold:600;--fw-bold:700;
  --lh-tight:1.25;--lh-heading:1.4;--lh-body:1.8;--lh-loose:1.9;
  --measure:68ch;

  /* Space */
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;
  --space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;
  --space-20:5rem;--space-24:6rem;--space-32:8rem;

  /* Layout */
  --container-max:1280px;--container-narrow:820px;--container-wide:1440px;
  --container-pad:1.25rem;
  --section-py:3rem;

  /* Radius */
  --radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;

  /* Shadow */
  --shadow-xs:0 1px 2px rgba(15,23,42,.05);
  --shadow-sm:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.04);
  --shadow-md:0 4px 12px rgba(15,23,42,.08);
  --shadow-lg:0 12px 28px rgba(15,23,42,.10);
  --shadow-xl:0 24px 48px rgba(4,37,145,.14);
  --shadow-focus:0 0 0 3px rgba(6,79,173,.40);

  /* Motion */
  --duration-fast:150ms;--duration-base:250ms;--duration-slow:350ms;
  --ease-out:cubic-bezier(.16,1,.3,1);--ease-in-out:cubic-bezier(.4,0,.2,1);

  /* z-index */
  --z-dropdown:100;--z-sticky:200;--z-float:300;--z-overlay:400;--z-modal:500;--z-skip:700;

  /* Touch */
  --touch-min:44px;--touch-comfort:48px;

  --header-h:74px;
}

@media (min-width:768px){:root{--container-pad:2rem;--section-py:4.5rem;}}
@media (min-width:1024px){:root{--section-py:6rem;--header-h:84px;}}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden;}
body{
  margin:0;font-family:var(--font-body);font-size:var(--fs-base);font-weight:var(--fw-regular);
  line-height:var(--lh-body);color:var(--text-primary);background:var(--bg);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-wrap:break-word;
}
img,picture,video,svg{display:block;max-width:100%;}
img{height:auto;}
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);line-height:var(--lh-heading);margin:0 0 var(--space-4);font-weight:var(--fw-bold);color:var(--text-primary);text-wrap:balance;}
h1{font-size:var(--fs-3xl);line-height:var(--lh-tight);letter-spacing:-.01em;}
h2{font-size:var(--fs-2xl);}
h3{font-size:var(--fs-xl);}
h4{font-size:var(--fs-lg);font-weight:var(--fw-semibold);}
p{margin:0 0 var(--space-4);}
ul,ol{margin:0 0 var(--space-4);padding-inline-start:1.4em;}
li{margin-bottom:var(--space-2);}
a{color:var(--brand-primary);text-decoration-thickness:1px;text-underline-offset:3px;}
a:hover{color:var(--brand-primary-dark);}
strong,b{font-weight:var(--fw-semibold);}
hr{border:0;border-top:1px solid var(--border);margin:var(--space-10) 0;}
button{font:inherit;}
:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px;border-radius:var(--radius-sm);}

@media (min-width:768px){h1{font-size:var(--fs-4xl);}h2{font-size:var(--fs-3xl);}h3{font-size:var(--fs-2xl);}}

/* ---------- Utilities ---------- */
.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad);}
.container--narrow{max-width:var(--container-narrow);}
.container--wide{max-width:var(--container-wide);}
.section{padding-block:var(--section-py);}
.section--surface{background:var(--surface);}
.section--alt{background:var(--surface-alt);}
.section--dark{background:var(--surface-dark);color:var(--text-inverse);}
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{color:var(--text-inverse);}
.section--dark p{color:rgba(255,255,255,.88);}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.skip-link{position:absolute;inset-inline-start:var(--space-4);top:-100px;z-index:var(--z-skip);background:var(--brand-primary-dark);color:#fff;padding:.75rem 1.25rem;border-radius:0 0 var(--radius-md) var(--radius-md);font-weight:var(--fw-semibold);text-decoration:none;transition:top var(--duration-fast);}
.skip-link:focus{top:0;color:#fff;}

/* Section head */
.section-head{max-width:760px;margin-bottom:var(--space-10);}
.section-head--center{margin-inline:auto;text-align:center;}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--brand-accent-text);letter-spacing:.02em;margin-bottom:var(--space-3);}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--brand-accent);border-radius:2px;flex:none;}
.section--dark .eyebrow{color:var(--brand-accent);}
.section--dark .eyebrow::before{background:var(--brand-accent);}
.section-head p{color:var(--text-secondary);font-size:var(--fs-lg);margin-bottom:0;}
.section--dark .section-head p{color:rgba(255,255,255,.85);}
.lead{font-size:var(--fs-lg);color:var(--text-secondary);}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  min-height:var(--touch-comfort);padding:.8rem 1.5rem;border-radius:var(--radius-md);
  font-family:var(--font-heading);font-size:var(--fs-base);font-weight:var(--fw-semibold);
  text-decoration:none;border:2px solid transparent;cursor:pointer;
  transition:background var(--duration-base) var(--ease-out),color var(--duration-base),transform var(--duration-fast),box-shadow var(--duration-base);
  text-align:center;line-height:1.3;
}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0);}
.btn svg{flex:none;width:20px;height:20px;}
.btn--primary{background:var(--brand-primary);color:#fff;box-shadow:0 4px 14px rgba(6,79,173,.28);}
.btn--primary:hover{background:var(--brand-primary-dark);color:#fff;box-shadow:0 8px 22px rgba(0,50,157,.34);}
.btn--outline{background:transparent;color:var(--brand-primary);border-color:var(--border-strong);}
.btn--outline:hover{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff;}
.btn--ghost-light{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.55);backdrop-filter:blur(6px);}
.btn--ghost-light:hover{background:#fff;color:var(--brand-primary-dark);border-color:#fff;}
.btn--whatsapp{background:var(--whatsapp-dark);color:#fff;box-shadow:0 4px 14px rgba(18,140,126,.3);}
.btn--whatsapp:hover{background:#0d6e62;color:#fff;}
.btn--lg{min-height:56px;padding:1rem 2rem;font-size:var(--fs-lg);}
.btn--block{width:100%;}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--space-3);}
.btn-row--center{justify-content:center;}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:var(--z-sticky);background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);transition:box-shadow var(--duration-base);}
.site-header.is-scrolled{box-shadow:var(--shadow-md);}
.header-inner{display:flex;align-items:center;gap:var(--space-4);min-height:var(--header-h);}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:none;}
.brand img{height:46px;width:auto;}
.brand-text{display:none;line-height:1.2;}
.brand-text strong{display:block;font-family:var(--font-heading);font-size:1rem;font-weight:var(--fw-bold);color:var(--brand-primary-dark);}
.brand-text span{display:block;font-size:var(--fs-xs);color:var(--brand-accent-text);font-weight:var(--fw-semibold);}
@media (min-width:480px){.brand-text{display:block;}}
@media (min-width:1024px){.brand img{height:56px;}.brand-text strong{font-size:1.06rem;}}

.main-nav{display:none;margin-inline-start:auto;}
.main-nav ul{display:flex;align-items:center;gap:.25rem;list-style:none;margin:0;padding:0;}
.main-nav li{margin:0;}
.main-nav > ul > li > a,.nav-toggle-btn{
  display:inline-flex;align-items:center;gap:.3rem;padding:.6rem .7rem;border-radius:var(--radius-md);
  font-family:var(--font-heading);font-size:.95rem;font-weight:var(--fw-semibold);color:var(--text-primary);
  text-decoration:none;background:none;border:0;cursor:pointer;transition:color var(--duration-fast),background var(--duration-fast);
}
.main-nav > ul > li > a:hover,.nav-toggle-btn:hover{color:var(--brand-primary);background:var(--surface-alt);}
.main-nav a[aria-current="page"]{color:var(--brand-primary);position:relative;}
.main-nav a[aria-current="page"]::after{content:"";position:absolute;inset-inline:.7rem;bottom:.25rem;height:2px;background:var(--brand-accent);border-radius:2px;}
.nav-toggle-btn svg{width:14px;height:14px;transition:transform var(--duration-fast);}
.has-mega[aria-expanded="true"] svg,.nav-toggle-btn[aria-expanded="true"] svg{transform:rotate(180deg);}
@media (min-width:1100px){.main-nav{display:block;}}

.header-actions{display:flex;align-items:center;gap:.5rem;margin-inline-start:auto;}
@media (min-width:1100px){.header-actions{margin-inline-start:var(--space-4);}}
.header-phone{display:none;align-items:center;gap:.45rem;font-family:var(--font-heading);font-weight:var(--fw-bold);color:var(--brand-primary-dark);text-decoration:none;font-size:1.02rem;direction:ltr;padding:.5rem .6rem;border-radius:var(--radius-md);}
.header-phone:hover{background:var(--surface-alt);color:var(--brand-primary);}
.header-phone svg{width:18px;height:18px;flex:none;}
@media (min-width:640px){.header-phone{display:inline-flex;}}
.header-cta{display:none;}
@media (min-width:900px){.header-cta{display:inline-flex;}}

.burger{display:inline-flex;align-items:center;justify-content:center;width:var(--touch-min);height:var(--touch-min);border:1px solid var(--border);background:#fff;border-radius:var(--radius-md);cursor:pointer;color:var(--brand-primary-dark);}
.burger svg{width:22px;height:22px;}
@media (min-width:1100px){.burger{display:none;}}

/* Mega menu */
.mega{
  position:absolute;inset-inline-start:0;inset-inline-end:0;top:100%;
  background:#fff;border-top:1px solid var(--border);box-shadow:var(--shadow-lg);
  padding:var(--space-8) 0;display:none;
}
.mega[data-open="true"]{display:block;}
.mega-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-8);}
.mega-col h3{font-size:var(--fs-sm);text-transform:none;color:var(--brand-accent-text);margin-bottom:var(--space-3);letter-spacing:.02em;}
.mega-col ul{list-style:none;margin:0;padding:0;}
.mega-col li{margin-bottom:.15rem;}
.mega-col a{display:flex;align-items:center;gap:.6rem;padding:.55rem .6rem;border-radius:var(--radius-md);text-decoration:none;color:var(--text-primary);font-weight:var(--fw-semibold);font-size:.95rem;transition:background var(--duration-fast),color var(--duration-fast);}
.mega-col a:hover{background:var(--brand-accent-soft);color:var(--brand-primary-dark);}
.mega-col a small{display:block;font-weight:400;color:var(--text-muted);font-size:var(--fs-xs);margin-top:.1rem;}
.mega-col a .mi{width:34px;height:34px;flex:none;border-radius:var(--radius-sm);background:var(--surface-alt);display:grid;place-items:center;color:var(--brand-primary);}
.mega-col a .mi svg{width:19px;height:19px;}
.mega-foot{margin-top:var(--space-6);padding-top:var(--space-5);border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;justify-content:space-between;}
.mega-foot p{margin:0;color:var(--text-secondary);font-size:var(--fs-sm);}

/* Mobile menu */
.mobile-nav{position:fixed;inset:0;z-index:var(--z-modal);background:#fff;transform:translateX(100%);transition:transform var(--duration-slow) var(--ease-out);display:flex;flex-direction:column;visibility:hidden;}
.mobile-nav[data-open="true"]{transform:translateX(0);visibility:visible;}
.mobile-nav-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:var(--space-4) var(--container-pad);border-bottom:1px solid var(--border);min-height:var(--header-h);}
.mobile-nav-close{width:var(--touch-min);height:var(--touch-min);border:1px solid var(--border);background:#fff;border-radius:var(--radius-md);display:grid;place-items:center;cursor:pointer;color:var(--brand-primary-dark);}
.mobile-nav-close svg{width:22px;height:22px;}
.mobile-nav-body{flex:1;overflow-y:auto;padding:var(--space-5) var(--container-pad) var(--space-16);-webkit-overflow-scrolling:touch;}
.mobile-nav-body ul{list-style:none;margin:0 0 var(--space-4);padding:0;}
.mobile-nav-body > ul > li > a{display:block;padding:.9rem .25rem;font-family:var(--font-heading);font-weight:var(--fw-semibold);font-size:1.08rem;color:var(--text-primary);text-decoration:none;border-bottom:1px solid var(--border);min-height:var(--touch-min);}
.mobile-nav-body > ul > li > a:hover{color:var(--brand-primary);}
.m-group{border-bottom:1px solid var(--border);}
.m-group > button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem .25rem;background:none;border:0;font-family:var(--font-heading);font-weight:var(--fw-semibold);font-size:1.08rem;color:var(--text-primary);cursor:pointer;min-height:var(--touch-min);text-align:start;}
.m-group > button svg{width:16px;height:16px;flex:none;transition:transform var(--duration-fast);color:var(--brand-primary);}
.m-group > button[aria-expanded="true"] svg{transform:rotate(180deg);}
.m-group ul{display:none;padding:0 0 .75rem;margin:0;}
.m-group ul[data-open="true"]{display:block;}
.m-group ul a{display:block;padding:.7rem .25rem .7rem 1rem;padding-inline-start:1rem;color:var(--text-secondary);text-decoration:none;font-size:.98rem;min-height:var(--touch-min);}
.m-group ul a:hover{color:var(--brand-primary);}
.mobile-nav-foot{padding:var(--space-5) var(--container-pad);border-top:1px solid var(--border);background:var(--surface);display:grid;gap:.65rem;}
.body-lock{overflow:hidden;}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--brand-primary-darkest);color:#fff;overflow:hidden;}
.hero-slides{position:relative;}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 700ms var(--ease-in-out);pointer-events:none;}
.hero-slide.is-active{position:relative;opacity:1;pointer-events:auto;}
.hero-media{position:absolute;inset:0;}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;}
.hero-media::after{content:"";position:absolute;inset:0;background:var(--overlay-hero);}
.hero-body{position:relative;z-index:2;padding-block:clamp(3.5rem,11vw,7.5rem);max-width:760px;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.5rem;background:rgba(15,182,202,.18);border:1px solid rgba(15,182,202,.5);color:#BFF3F8;padding:.4rem .9rem;border-radius:var(--radius-full);font-size:var(--fs-sm);font-weight:var(--fw-semibold);margin-bottom:var(--space-5);}
.hero-eyebrow svg{width:15px;height:15px;}
.hero .hero-title{color:#fff;font-size:clamp(1.85rem,5.4vw,3.5rem);line-height:1.18;margin-bottom:var(--space-5);letter-spacing:-.015em;text-shadow:0 2px 20px rgba(4,37,145,.5);font-weight:var(--fw-bold);font-family:var(--font-heading);}
.hero .hero-title .hl{color:var(--brand-accent);}
.hero-sub{font-size:clamp(1rem,2.3vw,1.2rem);color:rgba(255,255,255,.94);max-width:62ch;margin-bottom:var(--space-8);line-height:1.75;}
.hero-trust{display:flex;flex-wrap:wrap;gap:.5rem .5rem;margin-top:var(--space-8);}
.hero-trust span{display:inline-flex;align-items:center;gap:.4rem;font-size:var(--fs-sm);color:rgba(255,255,255,.92);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);padding:.4rem .8rem;border-radius:var(--radius-full);}
.hero-trust svg{width:15px;height:15px;color:var(--brand-accent);flex:none;}
.hero-controls{position:absolute;inset-inline:0;bottom:var(--space-5);z-index:3;display:flex;align-items:center;justify-content:center;gap:.75rem;}
.hero-dots{display:flex;gap:.5rem;}
.hero-dot{width:38px;height:5px;border-radius:var(--radius-full);border:0;background:rgba(255,255,255,.35);cursor:pointer;padding:0;transition:background var(--duration-base);position:relative;}
.hero-dot::after{content:"";position:absolute;inset:-14px -4px;}
.hero-dot[aria-current="true"]{background:var(--brand-accent);}
.hero-arrow{width:var(--touch-min);height:var(--touch-min);border-radius:var(--radius-full);border:1px solid rgba(255,255,255,.4);background:rgba(4,37,145,.4);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px);}
.hero-arrow:hover{background:#fff;color:var(--brand-primary-dark);}
.hero-arrow svg{width:20px;height:20px;}
@media (max-width:479px){.hero-arrow{display:none;}}

/* Page hero (inner pages) */
.page-hero{position:relative;background:var(--brand-primary-dark);color:#fff;overflow:hidden;}
.page-hero .hero-media{position:absolute;inset:0;}
.page-hero .hero-media img{width:100%;height:100%;object-fit:cover;}
.page-hero .hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,37,145,.88) 0%,rgba(4,37,145,.7) 100%);}
.page-hero-body{position:relative;z-index:2;padding-block:clamp(2.25rem,6vw,4rem);max-width:820px;}
.page-hero h1{color:#fff;margin-bottom:var(--space-4);}
.page-hero p{color:rgba(255,255,255,.92);font-size:var(--fs-lg);margin-bottom:0;max-width:62ch;}
.page-hero .btn-row{margin-top:var(--space-7,1.75rem);}

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{position:relative;z-index:2;font-size:var(--fs-sm);padding-block:.9rem;}
.breadcrumbs ol{display:flex;flex-wrap:nowrap;align-items:center;gap:.45rem;list-style:none;margin:0;padding:0;overflow-x:auto;scrollbar-width:none;}
.breadcrumbs ol::-webkit-scrollbar{display:none;}
.breadcrumbs li{margin:0;display:flex;align-items:center;gap:.45rem;white-space:nowrap;}
.breadcrumbs li:not(:last-child)::after{content:"‹";color:var(--border-strong);}
.breadcrumbs a{color:var(--text-secondary);text-decoration:none;}
.breadcrumbs a:hover{color:var(--brand-primary);text-decoration:underline;}
.breadcrumbs [aria-current="page"]{color:var(--text-muted);}
.page-hero .breadcrumbs a{color:rgba(255,255,255,.85);}
.page-hero .breadcrumbs a:hover{color:#fff;}
.page-hero .breadcrumbs [aria-current="page"]{color:rgba(255,255,255,.7);}
.page-hero .breadcrumbs li:not(:last-child)::after{color:rgba(255,255,255,.45);}

/* ---------- Cards / grids ---------- */
/* ملاحظة: تُستخدم minmax(0,1fr) لا 1fr — لأن 1fr تعني minmax(auto,1fr)
   فلا يستطيع العمود النزول تحت عرض المحتوى الأدنى، ما يسبب تجاوزًا أفقيًا. */
.grid{display:grid;gap:var(--space-5);}
.grid > *{min-width:0;}
.grid--2{grid-template-columns:minmax(0,1fr);}
.grid--3{grid-template-columns:minmax(0,1fr);}
.grid--4{grid-template-columns:minmax(0,1fr);}
@media (min-width:480px){.grid--4{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:640px){.grid--2{grid-template-columns:repeat(2,minmax(0,1fr));}.grid--3{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1024px){.grid--3{grid-template-columns:repeat(3,minmax(0,1fr));}.grid--4{grid-template-columns:repeat(4,minmax(0,1fr));}}

.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base),border-color var(--duration-base);}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--brand-accent);}
.card-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--surface-alt);}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform 600ms var(--ease-out);}
.card:hover .card-media img{transform:scale(1.05);}
.card-badge{position:absolute;inset-block-start:.7rem;inset-inline-start:.7rem;background:rgba(4,37,145,.92);color:#fff;font-size:var(--fs-xs);font-weight:var(--fw-semibold);padding:.3rem .65rem;border-radius:var(--radius-full);backdrop-filter:blur(4px);}
.card-body{padding:var(--space-5);display:flex;flex-direction:column;flex:1;}
.card-body h3{font-size:var(--fs-lg);margin-bottom:var(--space-2);}
.card-body h3 a{color:inherit;text-decoration:none;}
.card-body h3 a:hover{color:var(--brand-primary);}
.card-body p{color:var(--text-secondary);font-size:.95rem;margin-bottom:var(--space-4);flex:1;}
.card-link{display:inline-flex;align-items:center;gap:.4rem;font-weight:var(--fw-semibold);color:var(--brand-primary);text-decoration:none;font-size:.95rem;margin-top:auto;}
.card-link svg{width:16px;height:16px;transition:transform var(--duration-fast);}
.card-link:hover svg{transform:translateX(-4px);}

/* Service card with icon */
.svc-card{position:relative;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base),border-color var(--duration-base);}
.svc-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:var(--brand-accent);}
.svc-card .card-media{aspect-ratio:16/10;}
.svc-card .card-media::after{content:"";position:absolute;inset:0;background:var(--overlay-card);opacity:.9;}
.svc-icon{position:absolute;z-index:2;inset-block-end:-22px;inset-inline-start:var(--space-5);width:48px;height:48px;border-radius:var(--radius-md);background:#fff;box-shadow:var(--shadow-md);display:grid;place-items:center;color:var(--brand-primary);}
.svc-icon svg{width:25px;height:25px;}
.svc-card .card-body{padding-top:var(--space-8);}

/* Feature / why grid */
.feature{display:flex;gap:var(--space-4);align-items:flex-start;min-width:0;}
.feature > div{min-width:0;}
.feature-ic{flex:none;width:46px;height:46px;border-radius:var(--radius-md);background:var(--brand-accent-soft);color:var(--brand-accent-text);display:grid;place-items:center;}
.feature-ic svg{width:24px;height:24px;}
.feature h3{font-size:var(--fs-lg);margin-bottom:.4rem;}
.feature p{color:var(--text-secondary);font-size:.95rem;margin:0;}
.section--dark .feature-ic{background:rgba(15,182,202,.2);color:var(--brand-accent);}
.section--dark .feature p{color:rgba(255,255,255,.82);}

/* Steps */
.steps{list-style:none;counter-reset:step;padding:0;margin:0;display:grid;gap:var(--space-5);}
.steps > li{min-width:0;}
@media (min-width:768px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1100px){.steps{grid-template-columns:repeat(4,minmax(0,1fr));}}
.steps li{counter-increment:step;position:relative;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6) var(--space-5) var(--space-5);margin:0;}
.steps li::before{content:counter(step,decimal);position:absolute;inset-block-start:-16px;inset-inline-start:var(--space-5);width:38px;height:38px;border-radius:var(--radius-md);background:var(--brand-primary);color:#fff;display:grid;place-items:center;font-family:var(--font-heading);font-weight:var(--fw-bold);font-size:1rem;box-shadow:0 4px 12px rgba(6,79,173,.3);}
.steps h3{font-size:var(--fs-lg);margin:.5rem 0 .4rem;}
.steps p{color:var(--text-secondary);font-size:.95rem;margin:0;}

/* Stat / trust bar */
.trustbar{display:grid;gap:var(--space-4);grid-template-columns:minmax(0,1fr);}
@media (min-width:480px){.trustbar{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:900px){.trustbar{grid-template-columns:repeat(4,minmax(0,1fr));}}
.trustbar > div{display:flex;gap:.75rem;align-items:flex-start;padding:var(--space-4);background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);min-width:0;}
.trustbar > div > div{min-width:0;}
.trustbar svg{width:22px;height:22px;color:var(--brand-accent-text);flex:none;margin-top:.15rem;}
.trustbar strong{display:block;font-family:var(--font-heading);font-size:.98rem;margin-bottom:.15rem;}
.trustbar span{font-size:var(--fs-sm);color:var(--text-secondary);line-height:1.6;}

/* Split (image + text) */
.split{display:grid;gap:var(--space-8);align-items:center;}
.split > *{min-width:0;}
@media (min-width:900px){.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-12);}.split--rev .split-media{order:2;}}
.split-media img{width:100%;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);}
.split-media figure{margin:0;}
.split-media figcaption{margin-top:.6rem;font-size:var(--fs-sm);color:var(--text-muted);}

/* Checklist */
.checklist{list-style:none;padding:0;margin:0 0 var(--space-5);display:grid;gap:.65rem;}
.checklist li{display:flex;gap:.65rem;align-items:flex-start;margin:0;}
.checklist li::before{content:"";flex:none;width:21px;height:21px;margin-top:.3rem;border-radius:var(--radius-full);background:var(--brand-accent-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A6E80' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/13px no-repeat;}
.section--dark .checklist li::before{background-color:rgba(15,182,202,.22);}

/* ---------- Gallery (natural aspect ratio) ---------- */
.gallery{columns:2;column-gap:var(--space-4);}
@media (min-width:768px){.gallery{columns:3;}}
@media (min-width:1280px){.gallery{columns:4;}}
.gallery figure{break-inside:avoid;margin:0 0 var(--space-4);position:relative;border-radius:var(--radius-md);overflow:hidden;background:var(--surface-alt);border:1px solid var(--border);}
.gallery img{width:100%;height:auto;display:block;transition:transform 500ms var(--ease-out);}
.gallery button.g-open{position:absolute;inset:0;width:100%;height:100%;background:transparent;border:0;cursor:zoom-in;padding:0;}
.gallery figure:hover img{transform:scale(1.04);}
.gallery figcaption{padding:.6rem .75rem;font-size:var(--fs-sm);color:var(--text-secondary);background:#fff;position:relative;}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:var(--z-modal);background:rgba(4,20,60,.94);display:none;align-items:center;justify-content:center;padding:var(--space-4);}
.lightbox[data-open="true"]{display:flex;}
.lightbox img{max-width:min(1100px,94vw);max-height:82vh;width:auto;height:auto;border-radius:var(--radius-md);box-shadow:var(--shadow-xl);}
.lightbox-cap{position:absolute;inset-inline:0;bottom:var(--space-5);text-align:center;color:rgba(255,255,255,.92);font-size:var(--fs-sm);padding-inline:var(--space-6);}
.lb-btn{position:absolute;width:var(--touch-comfort);height:var(--touch-comfort);border-radius:var(--radius-full);border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px);}
.lb-btn:hover{background:#fff;color:var(--brand-primary-dark);}
.lb-btn svg{width:22px;height:22px;}
.lb-close{top:var(--space-4);inset-inline-end:var(--space-4);}
.lb-prev{inset-inline-end:var(--space-4);top:50%;transform:translateY(-50%);}
.lb-next{inset-inline-start:var(--space-4);top:50%;transform:translateY(-50%);}

/* Project filter */
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:var(--space-8);}
.filters button{min-height:var(--touch-min);padding:.55rem 1.05rem;border-radius:var(--radius-full);border:1px solid var(--border-strong);background:#fff;color:var(--text-secondary);font-family:var(--font-heading);font-weight:var(--fw-semibold);font-size:.92rem;cursor:pointer;transition:all var(--duration-fast);}
.filters button:hover{border-color:var(--brand-primary);color:var(--brand-primary);}
.filters button[aria-pressed="true"]{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff;}

/* ---------- Video ---------- */
.video-grid{display:grid;gap:var(--space-5);grid-template-columns:minmax(0,1fr);}
.video-grid > *{min-width:0;}
@media (min-width:700px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1100px){.video-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
.video-card{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:#000;}
.video-card video{width:100%;height:auto;display:block;background:#000;}
.video-card figcaption{padding:.7rem .9rem;background:#fff;font-size:var(--fs-sm);color:var(--text-secondary);}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:.75rem;}
.faq details{border:1px solid var(--border);border-radius:var(--radius-md);background:#fff;overflow:hidden;transition:border-color var(--duration-fast),box-shadow var(--duration-fast);}
.faq details[open]{border-color:var(--brand-accent);box-shadow:var(--shadow-sm);}
.faq summary{cursor:pointer;list-style:none;padding:1rem 1.15rem;font-family:var(--font-heading);font-weight:var(--fw-semibold);color:var(--text-primary);display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:var(--touch-min);}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"";flex:none;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23064FAD' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform var(--duration-fast);}
.faq details[open] summary::after{transform:rotate(180deg);}
.faq .faq-a{padding:0 1.15rem 1.15rem;color:var(--text-secondary);}
.faq .faq-a > *:last-child{margin-bottom:0;}

/* ---------- Tables (stay real tables on mobile) ---------- */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:var(--space-6);background:#fff;}
.table-wrap:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px;}
table{width:100%;border-collapse:collapse;table-layout:auto;font-size:.95rem;min-width:520px;}
caption{text-align:start;padding:.85rem 1rem;font-size:var(--fs-sm);color:var(--text-secondary);border-bottom:1px solid var(--border);background:var(--surface);}
th,td{padding:.75rem .85rem;text-align:start;border-bottom:1px solid var(--border);vertical-align:top;word-wrap:break-word;overflow-wrap:anywhere;}
thead th{background:var(--surface-alt);font-family:var(--font-heading);font-weight:var(--fw-semibold);color:var(--text-primary);white-space:nowrap;}
tbody tr:last-child td{border-bottom:0;}
tbody tr:nth-child(even){background:rgba(248,250,252,.6);}
@media (max-width:520px){table{font-size:.875rem;min-width:460px;}th,td{padding:.6rem .55rem;}}

/* ---------- Article ---------- */
.article-head{padding-block:var(--space-8) var(--space-6);}
.article-meta{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;color:var(--text-muted);font-size:var(--fs-sm);margin-bottom:var(--space-5);}
.article-meta span{display:inline-flex;align-items:center;gap:.4rem;}
.article-meta svg{width:15px;height:15px;color:var(--brand-accent-text);}
.article-cover{margin:0 0 var(--space-8);}
.article-cover img{width:100%;height:auto;border-radius:var(--radius-lg);}
.article-cover figcaption{margin-top:.6rem;font-size:var(--fs-sm);color:var(--text-muted);}
.prose{font-size:1.05rem;line-height:var(--lh-loose);color:var(--text-primary);}
.prose > h2{margin-top:var(--space-12);padding-top:var(--space-2);scroll-margin-top:calc(var(--header-h) + 1rem);}
.prose > h3{margin-top:var(--space-8);scroll-margin-top:calc(var(--header-h) + 1rem);}
.prose p,.prose li{color:var(--text-primary);}
.prose ul,.prose ol{margin-bottom:var(--space-5);}
.prose figure{margin:var(--space-8) 0;}
.prose figure img{width:100%;height:auto;border-radius:var(--radius-md);}
.prose figcaption{margin-top:.55rem;font-size:var(--fs-sm);color:var(--text-muted);text-align:start;}
.prose a{font-weight:var(--fw-semibold);}
/* معرض مصغّر داخل المقال — نسب طبيعية بلا قص */
.prose-gallery{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-3);margin:var(--space-8) 0 var(--space-3);}
@media (min-width:560px){.prose-gallery{grid-template-columns:repeat(2,minmax(0,1fr));}}
.prose-gallery figure{margin:0;position:relative;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--surface-alt);}
.prose-gallery img{width:100%;height:auto;display:block;}
.prose-gallery .g-open{position:absolute;inset:0;width:100%;height:100%;background:transparent;border:0;cursor:zoom-in;padding:0;}
.prose-gallery figcaption{padding:.5rem .7rem;font-size:var(--fs-sm);color:var(--text-secondary);background:#fff;position:relative;}
.prose .gal-cap{font-size:var(--fs-sm);color:var(--text-muted);margin:0 0 var(--space-8);}
.prose-video{margin:var(--space-8) 0;}
.prose-video video{width:100%;height:auto;}

.callout{border:1px solid var(--border);border-inline-start:4px solid var(--brand-accent);background:var(--brand-accent-soft);border-radius:var(--radius-md);padding:var(--space-5);margin:var(--space-8) 0;}
.callout h3{font-size:var(--fs-lg);margin-bottom:.5rem;color:var(--brand-accent-text);}
.callout > *:last-child{margin-bottom:0;}
.callout--warn{background:var(--warning-bg);border-inline-start-color:var(--warning);}
.callout--warn h3{color:var(--warning);}

/* TOC */
.toc{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);margin-bottom:var(--space-8);overflow:hidden;}
.toc summary{cursor:pointer;list-style:none;padding:1rem 1.15rem;font-family:var(--font-heading);font-weight:var(--fw-bold);display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:var(--touch-min);}
.toc summary::-webkit-details-marker{display:none;}
.toc summary::after{content:"";flex:none;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23064FAD' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform var(--duration-fast);}
.toc[open] summary::after{transform:rotate(180deg);}
.toc ol{margin:0;padding:0 1.15rem 1.15rem 1.15rem;padding-inline-start:2.2rem;}
.toc li{margin-bottom:.4rem;}
.toc a{color:var(--text-secondary);text-decoration:none;}
.toc a:hover{color:var(--brand-primary);text-decoration:underline;}

/* Related */
.related-service{display:flex;flex-wrap:wrap;gap:var(--space-5);align-items:center;background:var(--brand-primary-dark);color:#fff;border-radius:var(--radius-lg);padding:var(--space-6);margin:var(--space-10) 0;}
.related-service img{width:120px;height:90px;object-fit:cover;border-radius:var(--radius-md);flex:none;}
.related-service div{flex:1 1 260px;}
.related-service h3{color:#fff;font-size:var(--fs-lg);margin-bottom:.35rem;}
.related-service p{color:rgba(255,255,255,.85);font-size:.95rem;margin:0 0 .9rem;}

/* ---------- Forms ---------- */
.form{display:grid;gap:var(--space-5);}
.field{display:grid;gap:.4rem;}
.field label{font-family:var(--font-heading);font-weight:var(--fw-semibold);font-size:.95rem;}
.field .req{color:var(--error);font-weight:var(--fw-bold);}
.field .hint{font-size:var(--fs-sm);color:var(--text-muted);}
.field input,.field select,.field textarea{
  width:100%;min-height:var(--touch-comfort);padding:.7rem .9rem;border:1px solid var(--border-strong);
  border-radius:var(--radius-md);font-family:var(--font-body);font-size:1rem;color:var(--text-primary);
  background:#fff;transition:border-color var(--duration-fast),box-shadow var(--duration-fast);
}
.field textarea{min-height:130px;resize:vertical;line-height:1.7;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand-primary);box-shadow:var(--shadow-focus);}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"],.field select[aria-invalid="true"]{border-color:var(--error);}
.field .err{font-size:var(--fs-sm);color:var(--error);display:none;}
.field .err[data-show="true"]{display:block;}
.field input[type="file"]{padding:.55rem;background:var(--surface);cursor:pointer;}
.form-row{display:grid;gap:var(--space-5);}
.form-row > *{min-width:0;}
@media (min-width:640px){.form-row{grid-template-columns:repeat(2,minmax(0,1fr));}}
.form-note{font-size:var(--fs-sm);color:var(--text-muted);}
.form-alert{display:none;padding:1rem 1.15rem;border-radius:var(--radius-md);font-weight:var(--fw-semibold);}
.form-alert[data-show="true"]{display:block;}
.form-alert--ok{background:var(--success-bg);color:var(--success);border:1px solid rgba(21,128,61,.3);}
.form-alert--err{background:var(--error-bg);color:var(--error);border:1px solid rgba(185,28,28,.3);}
.proto-note{display:inline-flex;align-items:center;gap:.45rem;font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--warning);background:var(--warning-bg);border:1px dashed var(--warning);padding:.35rem .7rem;border-radius:var(--radius-sm);}

/* ---------- CTA band ---------- */
.cta-band{background:linear-gradient(135deg,var(--brand-primary-darkest) 0%,var(--brand-primary) 100%);color:#fff;border-radius:var(--radius-xl);padding:var(--space-10) var(--space-6);text-align:center;position:relative;overflow:hidden;}
.cta-band::before{content:"";position:absolute;inset-block-start:-60px;inset-inline-end:-60px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(15,182,202,.35) 0%,transparent 70%);}
.cta-band > *{position:relative;}
.cta-band h2{color:#fff;margin-bottom:var(--space-3);}
.cta-band p{color:rgba(255,255,255,.9);max-width:56ch;margin-inline:auto;margin-bottom:var(--space-6);}
.cta-band .btn-row{justify-content:center;}

/* ---------- Contact blocks ---------- */
.contact-list{display:grid;gap:var(--space-4);}
.contact-list > *{min-width:0;}
.contact-item{display:flex;gap:var(--space-4);align-items:flex-start;min-width:0;padding:var(--space-5);background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);}
.contact-item .ci{flex:none;width:46px;height:46px;border-radius:var(--radius-md);background:var(--brand-accent-soft);color:var(--brand-accent-text);display:grid;place-items:center;}
.contact-item .ci svg{width:23px;height:23px;}
.contact-item > div{min-width:0;}
.contact-item h3{font-size:var(--fs-base);margin-bottom:.25rem;}
.contact-item p{margin:0;color:var(--text-secondary);font-size:.95rem;}
.contact-item a{font-weight:var(--fw-semibold);}
.contact-item .val{direction:ltr;display:inline-block;unicode-bidi:isolate;}

/* Area chips */
.chips{display:flex;flex-wrap:wrap;gap:.5rem;}
.chips span{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;border-radius:var(--radius-full);background:#fff;border:1px solid var(--border);font-size:.92rem;font-weight:var(--fw-semibold);color:var(--text-secondary);}
.chips span.is-primary{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff;}
.section--dark .chips span{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:#fff;}
.section--dark .chips span.is-primary{background:var(--brand-accent);border-color:var(--brand-accent);color:var(--brand-primary-darkest);}

/* ---------- Footer ---------- */
.site-footer{background:var(--brand-primary-darkest);color:rgba(255,255,255,.82);padding-block:var(--space-16) var(--space-8);margin-top:var(--space-4);}
.footer-grid{display:grid;gap:var(--space-10);}
.footer-grid > *{min-width:0;}
@media (min-width:768px){.footer-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);}}
@media (min-width:1100px){.footer-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.1fr);}}
.footer-brand img{height:78px;width:auto;margin-bottom:var(--space-4);}
.footer-brand strong{display:block;font-family:var(--font-heading);font-size:1.1rem;color:#fff;margin-bottom:.5rem;}
.footer-brand p{font-size:.95rem;line-height:1.75;color:rgba(255,255,255,.72);max-width:42ch;}
.site-footer h3{color:#fff;font-size:var(--fs-base);margin-bottom:var(--space-4);}
.site-footer ul{list-style:none;margin:0;padding:0;}
.site-footer li{margin-bottom:.55rem;}
.site-footer a{color:rgba(255,255,255,.78);text-decoration:none;font-size:.95rem;}
.site-footer a:hover{color:#fff;text-decoration:underline;}
.footer-contact a{display:inline-flex;align-items:center;gap:.5rem;font-weight:var(--fw-semibold);color:#fff;}
.footer-contact svg{width:18px;height:18px;color:var(--brand-accent);flex:none;}
.footer-contact .val{direction:ltr;unicode-bidi:isolate;}
.footer-bottom{margin-top:var(--space-12);padding-top:var(--space-6);border-top:1px solid rgba(255,255,255,.16);display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;justify-content:space-between;font-size:var(--fs-sm);color:rgba(255,255,255,.6);}
.footer-bottom p{margin:0;}
.developer-credit{font-size:.85rem;color:rgba(255,255,255,.65);line-height:1.7;}
.developer-credit a{font-size:inherit;color:#fff;font-weight:var(--fw-semibold);text-decoration:underline;text-underline-offset:3px;}
.developer-credit a:hover{color:var(--brand-accent);text-decoration:underline;}
.developer-credit a:focus-visible{outline:3px solid var(--brand-accent);outline-offset:3px;color:#fff;}

/* ---------- Floating actions ---------- */
.floating{position:fixed;inset-inline-end:max(1rem,env(safe-area-inset-right));inset-block-end:max(1rem,env(safe-area-inset-bottom));z-index:var(--z-float);display:flex;flex-direction:column;gap:.7rem;align-items:center;}
.fab{position:relative;width:54px;height:54px;border-radius:var(--radius-full);display:grid;place-items:center;color:#fff;text-decoration:none;box-shadow:0 6px 20px rgba(15,23,42,.28);border:0;cursor:pointer;transition:transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base);}
.fab:hover{transform:scale(1.07);color:#fff;box-shadow:0 10px 26px rgba(15,23,42,.34);}
.fab svg{width:27px;height:27px;position:relative;z-index:2;}
.fab--wa{background:var(--whatsapp);}
.fab--wa:hover{background:#1ebe5b;}
.fab--call{background:var(--brand-primary);}
.fab--call:hover{background:var(--brand-primary-dark);}
.fab--top{width:44px;height:44px;background:rgba(4,37,145,.9);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity var(--duration-base),visibility var(--duration-base),transform var(--duration-base);}
.fab--top svg{width:20px;height:20px;}
.fab--top.is-visible{opacity:1;visibility:visible;transform:translateY(0);}
.fab::before{content:"";position:absolute;inset:0;border-radius:var(--radius-full);background:inherit;opacity:.65;animation:fabPulse 3.2s var(--ease-out) infinite;z-index:1;}
.fab--top::before{display:none;}
.fab--call::before{animation-delay:1.6s;}
@keyframes fabPulse{0%{transform:scale(1);opacity:.55;}70%{transform:scale(1.6);opacity:0;}100%{transform:scale(1.6);opacity:0;}}
.fab-label{position:absolute;inset-inline-end:calc(100% + .6rem);top:50%;transform:translateY(-50%);background:var(--text-primary);color:#fff;font-size:var(--fs-sm);font-weight:var(--fw-semibold);padding:.4rem .75rem;border-radius:var(--radius-md);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--duration-fast);z-index:3;}
.fab:hover .fab-label,.fab:focus-visible .fab-label{opacity:1;}
@media (max-width:479px){.fab{width:50px;height:50px;}.fab svg{width:25px;height:25px;}.floating{gap:.55rem;}.fab-label{display:none;}}
@media (min-width:1024px){.fab{width:58px;height:58px;}.fab svg{width:28px;height:28px;}}

/* ---------- Blog ---------- */
.post-featured{display:grid;gap:var(--space-8);align-items:center;background:#fff;border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;}
@media (min-width:900px){.post-featured{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);}}
.post-featured .pf-media{aspect-ratio:16/10;overflow:hidden;background:var(--surface-alt);}
.post-featured .pf-media img{width:100%;height:100%;object-fit:cover;}
.post-featured .pf-body{padding:var(--space-8) var(--space-6);}
@media (min-width:900px){.post-featured .pf-body{padding:var(--space-10);}}
.post-featured h2{font-size:var(--fs-2xl);margin-bottom:var(--space-3);}
.post-featured h2 a{color:inherit;text-decoration:none;}
.post-featured h2 a:hover{color:var(--brand-primary);}
.tag{display:inline-flex;align-items:center;gap:.35rem;font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--brand-accent-text);background:var(--brand-accent-soft);padding:.3rem .7rem;border-radius:var(--radius-full);margin-bottom:var(--space-3);}
.demo-badge{display:inline-flex;align-items:center;gap:.35rem;font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--warning);background:var(--warning-bg);border:1px dashed var(--warning);padding:.25rem .6rem;border-radius:var(--radius-sm);}

/* 404 */
.err-page{text-align:center;padding-block:var(--space-24);}
.err-code{font-family:var(--font-heading);font-size:clamp(4rem,18vw,9rem);font-weight:var(--fw-bold);line-height:1;color:var(--brand-primary);opacity:.16;margin-bottom:-1rem;}

/* ---------- Reveal animation ---------- */
[data-reveal]{opacity:0;transform:translateY(18px);transition:opacity 600ms var(--ease-out),transform 600ms var(--ease-out);}
[data-reveal].is-in{opacity:1;transform:none;}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
  html{scroll-behavior:auto;}
  .fab::before{display:none;}
  [data-reveal]{opacity:1;transform:none;}
  .card:hover,.svc-card:hover,.btn:hover,.fab:hover{transform:none;}
  .hero-slide{transition:none;}
}

/* ---------- Print ---------- */
@media print{
  .site-header,.floating,.mobile-nav,.hero-controls,.cta-band,.site-footer{display:none!important;}
  body{color:#000;}
}