/* Shared typography and identity. Colours and families are supplied by theme.css. */
:root{--font:'Tajawal';--heading-font:'Cairo'}
body{line-height:1.9}h1,h2,h3,h4,.brand-name{font-family:var(--heading-font),sans-serif;font-weight:700}
:lang(ar) h1,:lang(ar) h2,:lang(ar) h3{letter-spacing:0}
button,input,select,textarea{font-family:var(--font),sans-serif}
.site-header{height:90px;background:linear-gradient(110deg,var(--brand),color-mix(in srgb,var(--brand) 77%,var(--navy)));color:#fff;border-block-start:3px solid var(--accent);border-bottom:1px solid #ffffff20;box-shadow:0 5px 28px color-mix(in srgb,var(--brand) 12%,transparent)}
.site-header .brand:has(.brand-full){background:#fff;border-radius:12px;padding:8px 15px;box-shadow:0 3px 12px #001a2520}
.site-header .brand-full{width:155px;height:40px}.site-header .brand-mark{background:#ffffff18}
.site-header .main-nav,.site-header .language-link{color:#fff}.site-header .main-nav>a{opacity:.87;white-space:nowrap}
.site-header .main-nav>a:hover,.site-header .main-nav>a.active,.site-header .main-nav summary:hover{color:var(--accent);opacity:1}
.site-header .main-nav>a.active::after{bottom:-12px;width:22px}.site-header .language-link{border-color:#ffffff30}
.site-header .header-actions>.btn{background:var(--accent);color:var(--navy);box-shadow:none;border-color:transparent}
.site-header .nav-dropdown{color:var(--ink);background:var(--paper);box-shadow:0 14px 35px #001c3530;z-index:5}
.site-header .menu-toggle{background:#ffffff14;border:1px solid #ffffff30;color:#fff}
.site-header :focus-visible{outline-color:var(--accent)}
.hero h1{font-size:clamp(40px,4.35vw,61px);line-height:1.55}.hero p{font-size:18px;line-height:2}
.hero-note strong{font-size:13px}.hero-note small{font-size:12px}.section-head h2{line-height:1.6}
.service-card,.product-card,.news-card{border:1px solid var(--line)}.service-card p{font-size:15px}
.news-body h3{line-height:1.9}.news-body p{font-size:14px}.product-body p{font-size:15px}
.form-field input,.form-field textarea,.form-field select{transition:border-color .2s,box-shadow .2s}
.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 10%,transparent)}
.site-footer .brand{width:fit-content}.footer-column a,.footer-column>span{font-size:13px}.footer-about>p{font-size:14px}
.admin-topbar{background:linear-gradient(110deg,var(--brand),color-mix(in srgb,var(--brand) 78%,var(--navy)));color:#fff;border-bottom:3px solid var(--accent);box-shadow:0 4px 20px #00354912}
.admin-topbar h1{font-size:18px}.admin-topbar p,.admin-topbar .admin-user small{color:#ffffffba}.admin-avatar{background:var(--accent);color:var(--navy)}
.admin-topbar .btn.ghost{background:#ffffff12;color:#fff;border-color:#ffffff30}.admin-topbar :focus-visible{outline-color:var(--accent)}
.admin-heading h2{line-height:1.7}.admin-heading p{font-size:14px}.admin-nav a{font-size:14px}
.admin-nav a.active{background:color-mix(in srgb,var(--brand) 9%,#fff);box-shadow:inset -3px 0 var(--brand)}
.admin-sidebar{background:linear-gradient(180deg,#fff,var(--soft));scrollbar-width:thin}.admin-sidebar .brand{padding:11px 6px;border-bottom:1px solid var(--line);margin-bottom:15px}
.admin-sidebar .brand-full{filter:none;opacity:1}.admin-sidebar .brand-name{color:var(--brand)}.admin-sidebar .nav-label{color:var(--muted)}
.admin-sidebar .admin-nav a{color:var(--muted)}.admin-sidebar .admin-nav a i{color:var(--brand)}
.admin-sidebar .admin-nav a:hover,.admin-sidebar .admin-nav a.active{color:var(--brand);background:color-mix(in srgb,var(--brand) 8%,#fff);border-color:var(--line)}
.admin-sidebar .admin-nav a.active i{color:var(--brand)}.admin-sidebar .sidebar-bottom{border-color:var(--line)}.admin-sidebar .sidebar-bottom a{color:var(--muted)}
.admin-body .panel,.admin-body .metric-card,.admin-body .form-card{border-radius:16px}.admin-body .btn{border-radius:10px}
.dashboard-welcome{background:linear-gradient(110deg,var(--brand),var(--navy));border-radius:18px}
@media(max-width:1120px){.header-inner{gap:18px}.site-header .main-nav{gap:17px;font-size:13px}.hero h1{font-size:48px}}
@media(max-width:850px){
 .site-header{height:78px}.site-header .main-nav{top:75px;color:var(--ink);padding:15px 22px;gap:3px;border-bottom:3px solid var(--accent)}
 .site-header .main-nav>a{opacity:1}.site-header .main-nav>a:hover,.site-header .main-nav>a.active,.site-header .main-nav summary:hover{color:var(--brand)}
 .site-header .brand:has(.brand-full){padding:5px 11px}.site-header .brand-full{width:142px;height:38px}
 .hero h1{font-size:clamp(38px,6vw,54px)}.hero p{font-size:17px}.hero .hero-copy{max-width:680px}
}
@media(max-width:540px){
 .site-header .header-inner{gap:12px}.site-header .header-actions{gap:12px}.site-header .brand-full{width:128px;height:35px}.site-header .brand:has(.brand-full){padding:5px 9px;border-radius:9px}
 .site-header .language-link{font-size:12px}.hero h1{font-size:38px;line-height:1.65}.hero h1 span::after{bottom:12px}
 .hero p{font-size:16px;line-height:2}.hero-actions .btn{font-size:12px;padding-inline:13px}.hero-note strong{font-size:12px}.hero-note small{font-size:11px}
 .section-head h2{font-size:28px}.service-card p{font-size:13px}.news-body h3{font-size:19px}.product-body p{font-size:14px}
 .admin-heading h2{font-size:23px}.admin-heading p{font-size:13px}.admin-topbar{padding-inline:18px}
}

.admin-topbar .admin-header-actions>a{color:#fff}.admin-topbar .admin-menu-toggle{background:#ffffff14;color:#fff;border-color:#ffffff30}
