/* ABC Translation Qatar – main stylesheet (LTR + RTL via logical properties) */
:root{
  --maroon:#8A1538;--maroon-d:#6E0E2B;--maroon-l:#F6E8EC;
  --gold:#C9A04A;--gold-l:#FBF4E3;
  --ink:#141826;--ink-2:#3B4152;--muted:#667085;
  --line:#E6E3DF;--bg:#FFFFFF;--bg-alt:#FAF7F4;
  --ok:#157F4B;--ok-l:#E7F6EE;--warn:#9A6400;--warn-l:#FFF5DF;--info:#2A5DB0;--info-l:#EAF1FC;
  --radius:14px;--shadow:0 1px 2px rgba(20,24,38,.06),0 8px 24px rgba(20,24,38,.06);
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --wrap:1180px;
}
.lang-ar{--font:"IBM Plex Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--font);font-size:17px;line-height:1.65;color:var(--ink);background:var(--bg);overflow-x:hidden}
.lang-ar body,.lang-ar{line-height:1.8}
img,svg{max-width:100%}
a{color:var(--maroon);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--maroon-d)}
h1,h2,h3{line-height:1.25;margin:0 0 .6em;letter-spacing:-.01em}
.lang-ar h1,.lang-ar h2,.lang-ar h3{letter-spacing:0;line-height:1.45}
h1{font-size:clamp(2rem,4.2vw,3.1rem);font-weight:800}
h2{font-size:clamp(1.45rem,2.6vw,1.95rem);font-weight:700}
h3{font-size:1.1rem;font-weight:700}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:20px}
.narrow{max-width:820px}
.muted{color:var(--muted)}.small{font-size:.9rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;inset-inline-start:0;top:0;background:var(--ink);color:#fff;padding:.6em 1em;z-index:100;transform:translateY(-120%)}
.skip:focus{transform:none}
.ico{flex:none;vertical-align:-4px}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5em;background:var(--maroon);color:#fff;border:2px solid var(--maroon);padding:.7em 1.3em;border-radius:999px;font-weight:600;text-decoration:none;cursor:pointer;font:inherit;font-weight:600;transition:background .15s,transform .15s}
.btn:hover{background:var(--maroon-d);border-color:var(--maroon-d);color:#fff}
.btn:active{transform:translateY(1px)}
.btn-ghost{background:transparent;color:var(--maroon)}
.btn-ghost:hover{background:var(--maroon-l);color:var(--maroon-d)}
.btn-sm{padding:.45em 1em;font-size:.92rem}
.btn-lg{padding:.85em 1.6em;font-size:1.02rem}
.btn-block{width:100%;justify-content:center}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.logo-mark{width:40px;height:40px}
.logo-text{display:flex;flex-direction:column;font-size:1.08rem;line-height:1.1}
.logo-text small{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--maroon);font-weight:700;margin-top:3px}
.lang-ar .logo-text small{letter-spacing:0}
.nav{display:flex;align-items:center;gap:22px}
.nav>ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav>ul>li{position:relative}
.nav>ul>li>a{display:block;padding:.55em .75em;color:var(--ink-2);text-decoration:none;font-weight:500;font-size:.96rem;border-radius:8px}
.nav>ul>li>a:hover{color:var(--maroon);background:var(--maroon-l)}
.nav .sub{position:absolute;top:100%;inset-inline-start:0;min-width:280px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);list-style:none;margin:6px 0 0;padding:8px;opacity:0;visibility:hidden;transform:translateY(4px);transition:.15s}
.nav .has-sub:hover .sub,.nav .has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.nav .sub a{display:block;padding:.5em .75em;border-radius:8px;color:var(--ink-2);text-decoration:none;font-size:.94rem}
.nav .sub a:hover{background:var(--bg-alt);color:var(--maroon)}
.nav-actions{display:flex;align-items:center;gap:12px}
.lang-switch{font-weight:600;text-decoration:none;border:1px solid var(--line);padding:.35em .8em;border-radius:999px;color:var(--ink)}
.lang-switch:hover{border-color:var(--maroon)}
.nav-toggle{display:none;background:none;border:0;padding:10px;cursor:pointer}
.nav-toggle span:not(.sr){display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:.2s}

/* Breadcrumbs */
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:.3em;list-style:none;margin:0;padding:14px 20px 0;font-size:.88rem;color:var(--muted)}
.breadcrumbs li:not(:last-child)::after{content:"/";margin-inline-start:.4em;color:#c3c7cf}
.breadcrumbs a{color:var(--muted);text-decoration:none}
.breadcrumbs a:hover{color:var(--maroon)}

/* Hero */
.hero{position:relative;overflow:hidden}
.hero-home{background:radial-gradient(1200px 500px at 90% -10%,var(--maroon-l),transparent 60%),radial-gradient(900px 400px at -10% 110%,var(--gold-l),transparent 60%);padding:64px 0 72px}
.lang-ar .hero-home{background:radial-gradient(1200px 500px at 10% -10%,var(--maroon-l),transparent 60%),radial-gradient(900px 400px at 110% 110%,var(--gold-l),transparent 60%)}
.hero-grid{display:grid;grid-template-columns:1.25fr .9fr;gap:56px;align-items:center}
.eyebrow{display:inline-block;font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon);background:var(--maroon-l);padding:.35em .9em;border-radius:999px;margin-bottom:1.1em}
.lang-ar .eyebrow{letter-spacing:0;font-size:.9rem}
.lead{font-size:1.18rem;color:var(--ink-2);max-width:62ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin:1.6em 0}
.hero-points{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:.5em 1.5em;color:var(--ink-2);font-weight:500}
.hero-points li{display:flex;gap:.5em;align-items:flex-start}
.hero-points .ico{color:var(--ok);margin-top:4px}
.hero-card{position:relative}
.doc{background:#fff;border-radius:18px;box-shadow:0 30px 60px -20px rgba(138,21,56,.35),var(--shadow);padding:28px;position:relative;transform:rotate(-2deg)}
.lang-ar .doc{transform:rotate(2deg)}
.doc-head{display:flex;gap:6px;margin-bottom:20px}.doc-head span{width:10px;height:10px;border-radius:50%;background:var(--line)}
.doc-lines i{display:block;height:10px;background:#EEEAE6;border-radius:6px;margin:14px 0}
.doc-lines i.s{width:62%}
.doc-stamp{position:absolute;inset-inline-end:22px;bottom:20px;display:flex;align-items:center;gap:6px;color:var(--maroon);border:2px solid var(--maroon);border-radius:10px;padding:.35em .7em;font-weight:800;font-size:.8rem;letter-spacing:.1em;transform:rotate(-8deg);background:rgba(255,255,255,.9)}
.hero-langs{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px;justify-content:center}
.hero-langs span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:.3em .85em;font-size:.9rem;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.hero-page{background:linear-gradient(180deg,var(--bg-alt),#fff);padding:34px 0 40px;border-bottom:1px solid var(--line)}
.hero-page h1{font-size:clamp(1.8rem,3.6vw,2.6rem);max-width:30ch}
.badges{display:flex;flex-wrap:wrap;gap:8px}

/* Badges */
.badge{display:inline-block;font-size:.78rem;font-weight:700;padding:.3em .75em;border-radius:999px;margin-top:.6em}
.badge-yes{background:var(--ok-l);color:var(--ok)}
.badge-recent{background:var(--warn-l);color:var(--warn)}
.badge-no{background:var(--maroon-l);color:var(--maroon)}
.badge-info{background:var(--info-l);color:var(--info)}

/* Sections */
.section{padding:72px 0}
.section-alt{background:var(--bg-alt);border-block:1px solid var(--line)}
.section-head{max-width:720px;margin-bottom:34px}
.section-head p{color:var(--muted);font-size:1.08rem}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.group{margin:40px 0}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.cards-sm{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;text-decoration:none;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .15s}
.card:hover{border-color:rgba(138,21,56,.35);box-shadow:var(--shadow);transform:translateY(-2px);color:var(--ink)}
.card h3{margin:.2em 0 .4em}
.card p{color:var(--muted);font-size:.95rem;margin:0 0 .6em}
.card .more{margin-top:auto;color:var(--maroon);font-weight:600;font-size:.92rem}
.card .badge{align-self:flex-start}
.card-icon{width:46px;height:46px;border-radius:12px;background:var(--maroon-l);color:var(--maroon);display:grid;place-items:center;margin-bottom:10px}
.card-icon .ico{width:24px;height:24px}

.features{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.feature{background:#fff;border-radius:var(--radius);padding:24px;border:1px solid var(--line);position:relative}
.feature::before{content:"";display:block;width:36px;height:4px;border-radius:2px;background:var(--gold);margin-bottom:14px}
.feature p{color:var(--muted);margin:0}

.process{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:s}
.process li{position:relative;padding:24px;border-radius:var(--radius);background:#fff;border:1px solid var(--line)}
.process .num{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--maroon);color:#fff;font-weight:800;margin-bottom:12px}
.process p{color:var(--muted);margin:0}

/* Chips */
.chips{list-style:none;padding:0;margin:.4em 0 1em;display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-block;padding:.35em .9em;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--ink-2);text-decoration:none;font-size:.93rem}
.chips a:hover{border-color:var(--maroon);color:var(--maroon)}
.chips-lg a{padding:.5em 1.05em;font-size:.98rem}

/* Article */
.article-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;padding-block:44px}
.prose section{margin-bottom:2.2em}
.prose h2{margin-top:.2em}
.prose p{color:var(--ink-2)}
.checks{list-style:none;padding:0;margin:0 0 1em;display:grid;gap:.55em}
.checks li{position:relative;padding-inline-start:30px}
.checks li::before{content:"";position:absolute;inset-inline-start:0;top:.35em;width:18px;height:18px;border-radius:50%;background:var(--ok-l) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23157F4B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.steps{list-style:none;counter-reset:st;padding:0;margin:0;display:grid;gap:12px}
.steps li{counter-increment:st;position:relative;padding:16px 18px;padding-inline-start:64px;border:1px solid var(--line);border-radius:12px;background:#fff;display:flex;flex-direction:column}
.steps li::before{content:counter(st);position:absolute;inset-inline-start:16px;top:16px;width:32px;height:32px;border-radius:50%;background:var(--maroon-l);color:var(--maroon);display:grid;place-items:center;font-weight:800}
.steps span{color:var(--muted)}
.side{position:relative}
.side-box{position:sticky;top:96px;background:var(--bg-alt);border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin-bottom:18px}
.side-box+.side-box{position:static}
.side-box h2{font-size:1.15rem}
.side-box p{color:var(--muted);font-size:.93rem}
.side-contact{display:flex;flex-direction:column;gap:.4em;margin:1em 0 0}
.side-contact a{display:flex;gap:.5em;align-items:center;text-decoration:none;font-weight:600;word-break:break-all}
.side-links ul{list-style:none;margin:0;padding:0;display:grid;gap:.25em}
.side-links a{text-decoration:none;color:var(--ink-2);font-size:.95rem}
.side-links a:hover{color:var(--maroon)}

/* FAQ */
.faq details{border:1px solid var(--line);border-radius:12px;background:#fff;margin-bottom:10px;padding:0 18px}
.faq summary{cursor:pointer;list-style:none;font-weight:600;padding:16px 0;position:relative;padding-inline-end:28px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;inset-inline-end:0;top:12px;font-size:1.4rem;color:var(--maroon);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--ink-2);margin:0 0 16px}

/* Quote form */
.quote{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;background:linear-gradient(135deg,var(--maroon) 0%,var(--maroon-d) 100%);color:#fff;border-radius:22px;padding:44px;margin:40px 0 72px;box-shadow:0 30px 60px -30px rgba(138,21,56,.6)}
.quote-head h2{color:#fff}
.quote-head p{color:rgba(255,255,255,.86)}
.quote-head .muted{color:rgba(255,255,255,.7)}
.quote-direct{display:flex;flex-direction:column;gap:.5em;margin:1.4em 0}
.quote-direct a{display:inline-flex;gap:.6em;align-items:center;color:#fff;font-weight:600;text-decoration:none;font-size:1.05rem;word-break:break-all}
.quote-direct a:hover{color:var(--gold-l)}
.quote-form{background:#fff;color:var(--ink);border-radius:16px;padding:26px;display:grid;gap:14px}
.quote-form .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.quote-form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:.9rem;color:var(--ink-2)}
.quote-form input[type=text],.quote-form input[type=email],.quote-form input[type=tel],.quote-form select,.quote-form textarea{font:inherit;font-weight:400;font-size:1rem;padding:.65em .8em;border:1px solid #D5D0CA;border-radius:10px;background:#fff;color:var(--ink);width:100%}
.quote-form input:focus,.quote-form select:focus,.quote-form textarea:focus{outline:2px solid rgba(138,21,56,.35);border-color:var(--maroon)}
.quote-form .file input{font-weight:400;font-size:.92rem}
.quote-form .check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400}
.quote-form .check input{margin-top:.35em;accent-color:var(--maroon)}
.quote-form .req{color:var(--maroon)}
.quote-form .invalid{border-color:#C62828!important;background:#FFF6F6!important}
.quote-form button[disabled]{opacity:.7;cursor:progress}
.hp{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap;opacity:0}
.form-status{margin:0;font-weight:600}
.form-status.ok{color:var(--ok);background:var(--ok-l);padding:.8em 1em;border-radius:10px}
.form-status.err{color:#B42318;background:#FEF3F2;padding:.8em 1em;border-radius:10px}

/* Footer */
.site-footer{background:#121521;color:#C9CCD6;padding:60px 0 0;margin-top:0}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}
.site-footer a{color:#E6E8EE;text-decoration:none}
.site-footer a:hover{color:var(--gold)}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.4em;font-size:.94rem}
.f-h{color:#fff;font-size:.95rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:1em}
.lang-ar .f-h{letter-spacing:0;font-size:1rem}
.f-about p{font-size:.93rem}
.logo-light{color:#fff;margin-bottom:1em}
.f-contact a{display:inline-flex;gap:.5em;align-items:center;margin:.2em 0;font-weight:600}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid #262A3A;margin-top:44px;padding:22px 20px;font-size:.87rem;color:#8D92A3}
.footer-bottom a{color:#B8BCC8}
.mobile-bar{display:none}

/* Simple pages */
.simple{padding-block:40px}

/* Responsive */
@media (max-width:1060px){
  .nav-toggle{display:block}
  .nav{position:fixed;inset:72px 0 auto 0;background:#fff;flex-direction:column;align-items:stretch;padding:12px 20px 24px;border-bottom:1px solid var(--line);box-shadow:var(--shadow);display:none;max-height:calc(100vh - 72px);overflow:auto}
  .nav.open{display:flex}
  .nav>ul{flex-direction:column}
  .nav .sub{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 12px;margin:0;min-width:0}
  .lang-ar .nav .sub{padding:0 12px 0 0}
  .nav-actions{justify-content:space-between;padding-top:12px;border-top:1px solid var(--line)}
  .hero-grid,.two-col,.article-grid{grid-template-columns:1fr}
  .hero-card{display:none}
  .features{grid-template-columns:1fr 1fr}
  .process{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .side-box{position:static}
  .quote{grid-template-columns:1fr;padding:32px}
}
@media (max-width:640px){
  body{font-size:16px;padding-bottom:64px}
  .wrap{padding-inline:16px}
  .breadcrumbs ol{padding-inline:16px}
  .hero-home{padding:40px 0 48px}
  .hero-points{grid-template-columns:1fr}
  .features,.process,.footer-grid,.quote-form .grid-2{grid-template-columns:1fr}
  .section{padding:52px 0}
  .quote{padding:22px 16px;border-radius:16px;margin:28px 0 48px}
  .quote-form{padding:18px}
  .hero-cta .btn{width:100%;justify-content:center}
  .mobile-bar{display:grid;grid-template-columns:1fr 1fr 1.6fr;position:fixed;bottom:0;left:0;right:0;z-index:60;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(0,0,0,.06)}
  .mobile-bar a{display:flex;align-items:center;justify-content:center;gap:6px;padding:14px 6px;text-decoration:none;color:var(--ink);font-weight:600;font-size:.9rem}
  .mobile-bar a.primary{background:var(--maroon);color:#fff}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.site-header,.mobile-bar,.quote,.side,.site-footer{display:none}}
[id]{scroll-margin-top:90px}