/* Wordcraft V2 — WordPress-only additions. The design itself is assets/site.css (verbatim copy of the mockup). */

/* images with width/height attributes keep their ratio unless the design sets a height (zero specificity) */
:where(img[width][height]){height:auto}

/* accessibility */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;left:12px;top:12px;z-index:100000;padding:12px 18px;border-radius:999px;background:#fff;color:var(--ink)}

/* logged-in admin bar: keep the fixed header below it */
body.admin-bar .hdr{top:32px}
@media (max-width:782px){body.admin-bar .hdr{top:46px}}

/* WordPress content inside .prose — only for posts NOT imported from the mockup (those are styled by site.css exactly) */
body:not(.wcv2-rendered) .prose img{height:auto;border-radius:18px}
body:not(.wcv2-rendered) .prose .alignleft{float:left;margin:6px 24px 12px 0}
body:not(.wcv2-rendered) .prose .alignright{float:right;margin:6px 0 12px 24px}
body:not(.wcv2-rendered) .prose .aligncenter{margin-inline:auto}
body:not(.wcv2-rendered) .prose .wp-caption{max-width:100%;margin:0}
body:not(.wcv2-rendered) .prose figure{max-width:100%} /* margins come from site.css (mockup) */
body:not(.wcv2-rendered) .prose .wp-caption-text,body:not(.wcv2-rendered) .prose figcaption{font-size:13.5px;color:var(--w60);margin-top:8px}
body:not(.wcv2-rendered) .prose iframe,body:not(.wcv2-rendered) .prose video{max-width:100%;border:0;border-radius:18px}
body:not(.wcv2-rendered) .prose hr{border:0;border-top:1px solid var(--line);margin-block:32px}
body:not(.wcv2-rendered) .prose::after{content:"";display:table;clear:both}

/* search form (404, empty results) */
.wcv2-sf{display:flex;flex-wrap:wrap;gap:10px;align-items:center;max-width:560px}
.wcv2-sf input[type=search]{flex:1 1 220px;min-height:52px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:#fff;font:inherit;font-size:15px;padding:0 20px;box-sizing:border-box}
.wcv2-sf input[type=search]:focus{outline:none;border-color:var(--sky)}

/* archive / search pagination */
.wcv2-pg{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}
.wcv2-pg .page-numbers{min-width:44px;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:14px;color:var(--w70)}
.wcv2-pg .page-numbers.current,.wcv2-pg a.page-numbers:hover{background:var(--blue);border-color:var(--blue);color:#fff}

/* chrome titles that are <p> instead of headings (SEO heading order) — site.css has them, home.css (front page) not */
.fg .fh{margin:0 0 20px;line-height:1.6;font-family:var(--fd);font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:#fff}
.sh-h p.sh-tt{font-family:var(--fd);font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.15;margin-top:6px;color:inherit}
@media (max-width:640px){.sh-h p.sh-tt{font-size:22px}}

/* site/home.html has no <!doctype> (quirks mode); WordPress renders in standards mode, where an inline line after a
   block child gets the parent's 27.2px strut. These two rules reproduce the approved spacing exactly (verified
   element-by-element vs the mockup, 2026-09-29). */
.rv .who>span>small{display:block}
.founder .q>span>span{display:block}
.glass .g2>div>span{display:block}
/* 2026-09-30: Odoo live chat bubble loaded (body.has-lc) -> WhatsApp button stacks above it instead of on top of it */
html:not([dir="rtl"]) body.has-lc .fab{bottom:92px}
/* 2026-09-30: the Odoo chat bubble covered the phone menu's buttons and the Call/WhatsApp/Quote popups */
body:has(.drawer.open) .o-livechat-root,body:has(.sheet.on) .o-livechat-root{display:none!important}   /* Odoo sets inline display:block */
/* homepage popups don't add .on — they lock page scroll (body overflow:hidden) */
body[style*="overflow: hidden"] .o-livechat-root,body[style*="overflow:hidden"] .o-livechat-root{display:none!important}
/* 1.0.49 (2026-10-03): metric-matched fallback fonts, so text does not reflow when Sora / Instrument Sans / Readex Pro
   arrive (cold-load CLS 0.17 EN / 0.28 AR in the audit). Values measured with fontTools against Arial. */
@font-face{font-family:'Sora Fallback';src:local('Arial'),local('ArialMT'),local('Helvetica Neue'),local('Roboto');size-adjust:115.3%;ascent-override:84.1%;descent-override:25.2%;line-gap-override:0%}
@font-face{font-family:'Instrument Sans Fallback';src:local('Arial'),local('ArialMT'),local('Helvetica Neue'),local('Roboto');size-adjust:103.1%;ascent-override:94.1%;descent-override:24.3%;line-gap-override:0%}
@font-face{font-family:'Readex Pro Fallback';src:local('Arial'),local('ArialMT'),local('Tahoma'),local('Geeza Pro'),local('Noto Naskh Arabic');size-adjust:136%;ascent-override:73.5%;descent-override:18.3%;line-gap-override:0%}
:root{--fd:'Sora','Sora Fallback',ui-sans-serif,system-ui,sans-serif;--fb:'Instrument Sans','Instrument Sans Fallback',ui-sans-serif,system-ui,sans-serif}
html[lang="ar"]{--fd:'Readex Pro','Readex Pro Fallback',ui-sans-serif,system-ui,sans-serif;--fb:'Readex Pro','Readex Pro Fallback',ui-sans-serif,system-ui,sans-serif}
.prose[lang="ar"],.prose[lang="ar"] h2,.prose[lang="ar"] h3,.sc h3[lang="ar"],.alt-line.ar,.lang .a{font-family:'Readex Pro','Readex Pro Fallback',sans-serif}