/* Shared foundation for the three company websites.
   Only technical basics and shared components live here;
   each company owns its visual identity in its own style.css. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;overflow-x:hidden;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
:focus-visible{outline:3px solid var(--focus,#2b7fff);outline-offset:3px;border-radius:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Numbers, phone numbers and emails keep left-to-right order inside Arabic text */
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
a[href^="tel:"] .ltr,a.ltr[href^="tel:"]{white-space:nowrap}
a[href^="mailto:"]{overflow-wrap:anywhere}

/* Skip link */
.skip-link{position:absolute;inset-inline-start:16px;top:-100px;z-index:200;padding:12px 18px;background:#111;color:#fff;text-decoration:none;font-weight:600;border-radius:4px}
.skip-link:focus{top:12px}

/* Arabic never uses italics or letter-spacing */
html[lang="ar"] em,html[lang="ar"] i,html[lang="ar"] cite{font-style:normal}

/* ---------- Language switcher ---------- */
.lang-toggle{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:42px;min-width:44px;padding:6px 16px;border:1px solid currentColor;border-radius:999px;font-size:14px;line-height:1;transition:background .2s,color .2s,border-color .2s}
.lang-toggle:hover{background:rgba(127,127,127,.14)}
.lang-toggle:focus-visible{outline:3px solid var(--focus,#2b7fff);outline-offset:3px}
.lang-toggle:lang(ar){font-family:"IBM Plex Sans Arabic","Noto Kufi Arabic",Tahoma,sans-serif;font-size:15px}
.lang-toggle:lang(en){font-family:system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.04em}
.lang-toggle svg{width:16px;height:16px;flex:none}

/* ---------- Mobile navigation (shared behaviour; colours set per company) ---------- */
.nav-toggle{display:none;align-items:center;justify-content:center;flex-direction:column;gap:6px;width:46px;height:46px;padding:0 12px;background:transparent;border:1px solid currentColor;border-radius:4px;cursor:pointer}
.nav-toggle span:not(.sr-only){display:block;width:100%;height:1.5px;background:currentColor;transition:transform .25s}
.nav-open .nav-toggle span:nth-child(1){transform:translateY(3.75px) rotate(45deg)}
.nav-open .nav-toggle span:nth-child(2){transform:translateY(-3.75px) rotate(-45deg)}

/* ---------- Enquiry form ---------- */
.enq{display:grid;gap:18px;color:var(--enq-fg,inherit)}
.enq-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.enq-field{display:grid;gap:7px;align-content:start}
.enq label{font-size:13px;font-weight:600;letter-spacing:.03em}
.enq .req{color:var(--enq-accent,#2b7fff)}
html[lang="ar"] .enq label{letter-spacing:0;font-size:14px}
.enq input,.enq textarea{width:100%;background:var(--enq-bg,#fff);color:var(--enq-ink,#1b1b1b);border:1px solid var(--enq-line,#cfcfcf);border-radius:3px;padding:13px 14px;font-size:16px;line-height:1.5;transition:border-color .2s,box-shadow .2s}
.enq textarea{min-height:140px;resize:vertical}
.enq select{width:100%;background:var(--enq-bg,#fff);color:var(--enq-ink,#1b1b1b);border:1px solid var(--enq-line,#cfcfcf);border-radius:3px;padding:13px 14px;font-size:16px;line-height:1.5}
.enq select:focus{outline:none;border-color:var(--enq-accent,#2b7fff);box-shadow:0 0 0 3px var(--enq-ring,rgba(43,127,255,.25))}
.enq input:focus,.enq textarea:focus{outline:none;border-color:var(--enq-accent,#2b7fff);box-shadow:0 0 0 3px var(--enq-ring,rgba(43,127,255,.25))}
.enq [aria-invalid="true"]{border-color:var(--enq-error,#c0392b)}
.enq-error{margin:0;font-size:13px;color:var(--enq-error,#c0392b);font-weight:500}
.enq-error:empty{display:none}
.enq-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.enq-send{cursor:pointer;border:0;border-radius:3px;padding:16px 30px;font-size:15px;font-weight:600;letter-spacing:.04em;background:var(--enq-accent,#1b1b1b);color:var(--enq-btn-fg,#fff);transition:filter .2s,transform .2s}
.enq-send:hover{filter:brightness(1.08);transform:translateY(-1px)}
html[lang="ar"] .enq-send{letter-spacing:0}
.enq-note{margin:0;font-size:13px;opacity:.75;max-width:46ch}
.enq-status{margin:0;padding:14px 16px;border-inline-start:3px solid var(--enq-accent,#2b7fff);background:var(--enq-status-bg,rgba(127,127,127,.08));font-size:14px;line-height:1.6}
.enq-status:empty{display:none}
.enq-status:focus{outline:none}
.enq-status[data-kind="success"]{border-color:var(--enq-success,#2e7d4f);background:var(--enq-success-bg,rgba(46,125,79,.1))}
.enq-status[data-kind="error"]{border-color:var(--enq-error,#c0392b)}
.enq-send:disabled{opacity:.65;cursor:progress;transform:none;filter:none}
/* Spam trap: hidden in place (no off-screen offset, which would widen right-to-left pages) */
.enq-hp{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
.enq-status a{font-weight:600}
@media (max-width:620px){.enq-row{grid-template-columns:1fr}}


/* ---------- Gentle reveal on scroll (only when JavaScript runs and motion is allowed) ---------- */
.js-reveal [data-reveal]{opacity:0;transition:opacity .7s ease}
.js-reveal [data-reveal].is-visible{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js-reveal [data-reveal]{opacity:1;transform:none}
}

@media print{
  .site-header,.group-bar,.nav-toggle,.lang-switch,.enq{display:none!important}
  body{background:#fff!important;color:#000!important}
  .js-reveal [data-reveal]{opacity:1!important;transform:none!important}
}