/* Almutamakina's single typographic and color system across every page.
   Cairo: Arabic. DM Sans: English and concise numeric labels. */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');

:root {
  --blue: #16447c;
  --ink: #20354a;
  --muted: #75889b;
  --line: #e6ecf2;
  --paper: #ffffff;
  --font: 'Cairo', Tahoma, Arial, sans-serif;
}
html[lang="ar"] body {font-family: 'Cairo', Tahoma, Arial, sans-serif;}
html[lang="en"] body {font-family: 'DM Sans', Arial, sans-serif;}
button,input,select,textarea {font-family:inherit;}
h1,h2,h3 {font-family:inherit; letter-spacing:-.5px;}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3 {font-weight:600;}
.demo-notice {font-size:10px;letter-spacing:0;background:#133965;color:#e7f3fe;}
.header,.main-header {background:#fffffff0;border-bottom:1px solid var(--line);box-shadow:0 1px 0 #fff;}
.header,.header-wrap {height:78px;}
.main-header .header-row {height:78px;}
.nav-main a,.desktop-nav>a {color:#65788a;font-size:12px;font-weight:600;}
.nav-main a:hover,.nav-main a.active,.desktop-nav>a:hover,.desktop-nav>a.current {color:var(--blue);}
.identity img,.site-logo img,.footer-logo,.footer img {object-fit:contain;mix-blend-mode:normal;}
.identity img {width:142px;max-height:62px;}
.site-logo img {max-height:63px;}
.lang-link {color:var(--blue);background:#fff;}
.contact,.contact-action {background:var(--blue);color:#fff;border-color:var(--blue);}
.contact:hover,.contact-action:hover {background:#0d2e53;color:#fff;}
.eyebrow,.prod-brand,.spec-description .eyebrow {color:var(--blue);}
.intro-head h1,.section-head h2,.product-info h1,.spotlight-copy h2 {color:var(--ink);font-weight:600;}
.card-title,.footer-links,.filter,.primary-btn {font-weight:600;}
.footer {background:#f5f8fb;}
.footer-main p,.footer-links {color:#61788d;}

/* Homepage typography: the same calm weights and blue accents as the catalog. */
.hero h1 {font-size:clamp(33px,3.45vw,55px);font-weight:600;line-height:1.6;letter-spacing:-.7px;}
.hero h1 em {font-weight:400;color:#698ca9;}
.hero-copy>p:last-child {font-size:13px;font-weight:400;line-height:2;color:#7c90a3;}
.chapter-divider {height:128px;}
.chapter-divider p {font-weight:400;font-size:17px;}
.scene-copy .chapter {font-family:'DM Sans',Arial,sans-serif;font-size:10px;letter-spacing:1.15px;font-weight:600;color:#90a6b7;}
.scene-copy .type {font-family:inherit;font-size:13px;font-weight:600;color:#5280a3;margin-top:26px;}
.scene-copy h2 {font-size:clamp(36px,4.65vw,66px);font-weight:600;line-height:1.44;letter-spacing:-.6px;color:var(--ink);margin-top:10px;margin-bottom:12px;}
.scene-copy h2 em {font-weight:400;color:#7090aa;}
.scene-copy p {font-size:13px;font-weight:400;line-height:2.1;color:#72889b;max-width:420px;margin-bottom:24px;}
.category-link {
  display:inline-flex;justify-content:space-between;align-items:center;gap:29px;
  min-height:48px;padding:11px 19px;border-radius:11px;
  color:#fff!important;background:var(--blue);border:1px solid var(--blue)!important;
  font-family:inherit;font-size:12px;font-weight:700;line-height:1.7;
  box-shadow:0 9px 24px #16447c17;transition:background .22s,transform .22s,box-shadow .22s;
}
.category-link span {font:18px Arial,sans-serif;color:#fff;}
.category-link:hover,.category-link:focus-visible {gap:29px;background:#0c315d;transform:translateY(-2px);box-shadow:0 12px 26px #16447c24;}
html[lang="en"] .scene-copy h2 {line-height:1.18;letter-spacing:-1.55px;font-weight:600;}
html[lang="en"] .scene-copy h2 em {font-weight:400;}
html[lang="en"] .scene-copy .type {font-family:'DM Sans',Arial,sans-serif;font-size:10px;font-weight:700;letter-spacing:1.3px;}
html[lang="en"] .scene-copy p {line-height:1.85;font-size:14px;}

/* Visible category access immediately after the architectural landing scene. */
.category-shortcuts {width:min(1240px,calc(100% - 76px));margin:47px auto 24px;position:relative;z-index:1;}
.shortcuts-heading {display:flex;align-items:end;justify-content:space-between;gap:18px;padding:0 5px 21px;}
.shortcuts-heading>span {order:2;color:#7693aa;font-size:11px;font-weight:600;}
.shortcuts-heading h2 {margin:0;color:var(--ink);font-size:clamp(21px,2.3vw,29px);font-weight:600;line-height:1.6;}
.shortcuts-heading h2 em {font-style:normal;color:#7195b0;font-weight:400;}
.shortcut-grid {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;}
.shortcut-grid a {min-height:71px;padding:12px 13px 12px 17px;border-radius:12px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:7px;box-shadow:0 8px 24px #16447c14;transition:transform .2s,background .2s,box-shadow .2s;}
.shortcut-grid a:hover,.shortcut-grid a:focus-visible {background:#0e315b;transform:translateY(-3px);box-shadow:0 12px 28px #16447c24;}
.shortcut-grid a span {font-size:13px;font-family:inherit;font-weight:600;line-height:1.7;}
.shortcut-grid a b {flex:0 0 auto;font:16px Arial,sans-serif;opacity:.85;}
html[lang="en"] .shortcuts-heading h2 {letter-spacing:-.9px;}
html[lang="en"] .shortcut-grid a span {font-size:12px;font-weight:600;}

/* Keep the expanded collection area clean with a clear blue label. */
.category-grid .category-card {border:1px solid #e4ebf1;background:#f7f9fb;border-radius:17px;}
.category-grid .category-card h3 {display:inline-block;align-self:end;justify-self:start;padding:7px 13px;color:#fff;background:var(--blue);border-radius:9px;font-size:14px;line-height:1.65;font-weight:600;}
.category-grid .category-card>b {align-self:end;color:var(--blue);}
.categories-heading h2 {font-weight:600;color:var(--ink);}
.categories-heading h2 em {font-weight:400;color:#7195b0;}

@media(max-width:900px){
  .shortcut-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
  .category-shortcuts {width:calc(100% - 40px);margin-top:32px;}
}
@media(max-width:780px){
  .header,.header-wrap {height:68px;}
  .main-header .header-row {height:68px;}
  .identity img {width:113px;max-height:52px;}
  .hero h1 {font-size:clamp(27px,6.8vw,38px);line-height:1.45;}
  .hero-copy>p:last-child {font-size:11px;line-height:1.8;max-width:340px;margin:8px auto 0;}
  .category-shortcuts {width:calc(100% - 34px);margin:23px auto 10px;}
  .shortcuts-heading {display:block;padding:0 4px 14px;}
  .shortcuts-heading>span {display:block;font-size:9px;margin-bottom:5px;}
  .shortcuts-heading h2 {font-size:23px;line-height:1.5;}
  .shortcut-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .shortcut-grid a {min-height:56px;padding:10px 12px;border-radius:10px;}
  .shortcut-grid a span,html[lang="en"] .shortcut-grid a span {font-size:11px;}
  .chapter-divider {height:92px;gap:12px;}
  .chapter-divider p {font-size:12px;}
  .scene-copy h2 {font-size:clamp(29px,7.4vw,42px);line-height:1.45;letter-spacing:0;}
  .scene-copy h2 br {display:block!important;}
  html[lang="en"] .scene-copy h2 {line-height:1.16;letter-spacing:-.7px;}
  .scene-copy .type {font-size:11px;margin-top:8px;}
  .scene-copy p,html[lang="en"] .scene-copy p {font-size:11px;line-height:1.9;margin:7px 0 13px;}
  .category-link {min-height:42px;padding:9px 14px;gap:15px;font-size:11px;}
  .category-link:hover,.category-link:focus-visible {gap:15px;}
  .category-grid .category-card h3 {font-size:11px;padding:6px 9px;border-radius:7px;}
}
