@font-face {
  font-family: Tajawal;
  src: url("tajawal.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Tajawal;
  src: url("assets/family/tajawal-bold.ttf") format("truetype");
  font-weight: 650 900;
  font-display: swap;
}

:root {
  --paper: #f8f9fc;
  --ink: #142238;
  --muted: #4e5e75;
  --line: #d7dfea;
  --navy: #142741;
  --blue: #354f92;
  --white: #fff;
  --ui: Tajawal, "Segoe UI", Arial, sans-serif;
  --latin: "Segoe UI", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
body.family { margin: 0; overflow-x: clip; font: 17px/1.55 var(--ui); color: var(--ink); background: var(--paper); }
html[lang=en] body.family { font: 16px/1.55 var(--latin); }
body.family main { display: block; width: auto; max-width: none; padding: 0; margin: 0; }
body.family :is(h1,h2,h3,h4) { color: var(--ink); font-family: inherit; line-height: 1.19; margin: 0; }
body.family h2 { font-size: clamp(28px,3vw,42px); }
body.family p { margin: 0; }
body.family a { color: inherit; text-decoration: none; }
body.family button { font: inherit; color: inherit; cursor: pointer; }
body.family img { display: block; max-width: 100%; }
.family .wrap { width: min(1270px,calc(100% - 104px)); margin-inline: auto; }
.family [hidden] { display: none !important; }
.family :focus-visible { outline: 3px solid #e18038; outline-offset: 4px; }
.latin, .product-head h3, .hero-credit, .identity, .product-title h1 { font-family: var(--latin); }
.skip { position: absolute; top: -100px; inset-inline-start: 10px; z-index: 10; background: white; padding: 10px; }
.skip:focus { top: 4px; }
.ivf { --accent: #344e89; --pale: #eaf0fb; --edge: #b6caec; }
.andro { --accent: #664997; --pale: #f1edfa; --edge: #cdbce5; }
.cryo { --accent: #265e88; --pale: #e8f2fa; --edge: #a9cce6; }

.family .mast { position: relative; z-index: 3; color: var(--ink); background: #fff; border-bottom: 1px solid #e4e8ef; }
.mast-inner, .main-nav, .nav-actions, .mobile-nav, .identity, .hero-actions, .filters, .pdf-buttons { display: flex; align-items: center; }
.mast-inner { min-height: 79px; justify-content: space-between; gap: 24px; }
.wordmark { display: inline-flex; flex-shrink: 0; }
.identity { gap: 8px; line-height: 1; text-align: left; }
.identity img { width: 37px; height: 43px; object-fit: contain; }
.identity strong, .identity small { display: block; }
.identity strong { font-weight: 700; font-size: 24px; letter-spacing: -.055em; }
.identity small { font-weight: 650; font-size: 11px; margin-top: 3px; letter-spacing: .045em; }
.main-nav { gap: clamp(12px,2.5vw,39px); }
.main-nav a { padding: 5px 0; font-weight: 700; font-size: 16px; white-space: nowrap; }
.main-nav a[aria-current=page], .main-nav a:hover, .language:hover { color: var(--blue); box-shadow: 0 2px var(--blue); }
.nav-actions { gap: 22px; }
.language { font-size: 14px; font-weight: 700; }
.contact-btn, .inline-link, .btn-primary, .btn-line, .btn-stroke, .card-link, .back-link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-weight: 700; }
.family .contact-btn { color: white; background: var(--navy); padding: 9px 17px; font-size: 15px; border-radius: 7px; }
.arrow { display: inline-flex; }
.arrow svg { display: block; }
html[dir=rtl] .arrow svg { transform: scaleX(-1); }
.nav-toggle { display: none; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 6px; background: white; }
.mobile-nav { gap: 10px 20px; padding: 13px 5%; border-top: 1px solid var(--line); flex-wrap: wrap; }
.mobile-nav a { padding-block: 4px; }

.family .hero { color: white; background: radial-gradient(ellipse at 13% 8%,#273e63 0,transparent 49%), linear-gradient(120deg,#152946 0,#172a46 35%,#111e34 82%); }
html[lang=en] .family .hero { background: radial-gradient(ellipse at 90% 8%,#2a4068 0,transparent 49%),linear-gradient(120deg,#111e34,#182c49); }
.hero-shell { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: clamp(24px,4vw,70px); padding-block: clamp(40px,5vw,82px); }
.hero-credit { color: #c2d1ee; font-size: 13px; font-weight: 650; letter-spacing: .04em; width: fit-content; }
.hero-credit::before { content: ""; display: inline-block; width: 26px; height: 2px; background: #a6b9df; margin-right: 10px; vertical-align: middle; }
.family .hero h1 { font-size: clamp(40px,4.65vw,76px); line-height: 1.13; color: white; margin-block: 17px 14px; }
html[lang=en] .family .hero h1 { font-size: clamp(38px,4.0vw,68px); letter-spacing: -.045em; }
.family .hero h1 em { font-style: normal; color: #bccffc; }
.hero-description { color: #e0e7f6; font-size: clamp(16px,1.4vw,21px); line-height: 1.65; max-width: 520px; }
.hero-actions { flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.btn-primary, .btn-line, .btn-stroke { padding: 10px 18px; min-height: 44px; border-radius: 7px; font-size: 16px; transition: background .15s; }
.family .btn-primary { background: var(--navy); color: #fff; border: 1px solid var(--navy); }
.family .hero .btn-primary { color: #182847; background: #e2eaff; border-color: #e2eaff; }
.family .hero .btn-primary:hover { background: white; }
.family .btn-line { color: #f2f5ff; border: 1px solid #647792; }
.family .btn-line:hover { background: #263c5d; }
.family .btn-stroke { color: var(--ink); border: 1px solid #a2afc7; }
.stage { min-width: 0; padding: 10px; border: 1px solid #697e9a; background: linear-gradient(145deg,#405674,#253c59); border-radius: 15px; box-shadow: 0 20px 35px #080e192c; }
.stage-tabs { display: flex; gap: 4px; padding-bottom: 9px; }
.stage-tabs button { display: flex; flex: 1; justify-content: center; align-items: center; gap: 7px; padding: 7px 4px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #edf3ff; font-size: clamp(12px,1.12vw,16px); line-height: 1.2; }
.stage-tabs button[aria-selected=true] { background: #eef3ff; border-color: #fff; color: #162842; }
.stage-tabs button:hover:not([aria-selected=true]) { background: #536984; }
.stage-panel { overflow: hidden; border-radius: 6px; background: white; }
.stage-panel a { display: block; }
.stage-panel img { width: 100%; height: auto; aspect-ratio: 1.92; object-fit: contain; object-position: center; background: #f3f5fa; }
.stage-caption { padding: 11px 14px; display: flex; justify-content: space-between; align-items: center; gap: 10px; border-top: 1px solid var(--line); color: var(--ink); background: #fff; font-size: 14px; }
.stage-caption>span { color: var(--muted); font-size: 12px; }
.stage-caption b { margin-inline-start: 3px; font: 15px Arial; }

.band { padding-block: 58px; }
.compact { padding-top: 13px; }
.section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 24px; }
.eyeline { display: inline-block; font-size: 12px; font-weight: 700; color: var(--blue); margin-bottom: 8px; }
.inline-link, .card-link, .back-link { color: var(--blue) !important; font-size: 16px; }
.inline-link { flex-shrink: 0; }
.inline-link:hover, .card-link:hover, .back-link:hover, .foot-links a:hover, .foot-base a:hover { text-decoration: underline; text-underline-offset: 4px; }
.products, .catalog-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.product-card { position: relative; display: flex; flex-direction: column; min-width: 0; background: white; padding: 24px; border: 1px solid var(--line); border-radius: 12px; }
.product-card::before { content: ""; position: absolute; top: -1px; height: 3px; inset-inline: 22px; background: var(--accent); border-radius: 8px; }
.product-head, .product-title, .catalog-heading { display: flex; align-items: center; gap: 14px; }
.product-head h3 { font-size: clamp(22px,2.1vw,31px); letter-spacing: -.04em; }
.product-icon { border-radius: 18%; object-fit: contain; flex-shrink: 0; }
.family .product-card h4 { margin: 19px 0 6px; font-size: 19px; }
.product-card p, .catalog p, .shot p, .detail-grid p, .release-list p, .opening p, .product-intro p, .contact-panel p, .callout p, .guide-entry p { color: var(--muted); line-height: 1.64; }
.tags { display: flex; flex-wrap: wrap; gap: 5px; padding: 0; margin-block: 16px; list-style: none; }
.tags li { padding: 2px 8px; border-radius: 5px; background: var(--pale); color: var(--accent); font-size: 13px; font-weight: 700; }
.card-link { justify-content: space-between; border-top: 1px solid var(--line); margin-top: auto; padding-top: 13px; color: var(--accent) !important; }
.screen-zone { background: #edf1f8; }
.shot-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(276px,100%),1fr)); gap: 19px; }
.shot { min-width: 0; margin: 0; background: white; overflow: hidden; border: 1px solid #d6dfeb; border-radius: 10px; }
.shotimg { position: relative; display: block; padding: 14px; background: var(--pale); border-bottom: 1px solid var(--line); }
.shotimg img { display: block; width: 100%; aspect-ratio: 1.75; object-fit: contain; transition: transform .18s; }
.shotimg:hover img { transform: scale(1.025); }
.shotimg span { position: absolute; inset-inline-end: 8px; bottom: 8px; padding: 0 5px; border-radius: 3px; border: 1px solid #cad4e2; background: white; font: 18px Arial; }
.shot figcaption { padding: 15px 18px 19px; }
.shot small { color: var(--accent); font-weight: 700; }
.family .shot h3 { font-size: 22px; margin: 5px 0; }
.shot p { font-size: 15px; }
.release-strip { display: grid; grid-template-columns: 1fr 1.6fr; gap: clamp(30px,6vw,90px); }
.release-strip h2 { margin: 4px 0 17px; }
.release-list { border-top: 1px solid var(--line); }
.release-list article { display: grid; grid-template-columns: .85fr 1.3fr; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.release-list small { font: 650 12px var(--latin); color: var(--blue); display: inline-block; }
.family .release-list h3 { font-size: 22px; margin: 7px 0; }
.release-strip .release-list article { display: block; }
.callout { display: flex; justify-content: space-between; align-items: center; gap: 25px; border-radius: 12px; padding: 28px 32px; background: #e8eef9; margin-block-end: 50px; }
.family .callout h2 { font-size: 31px; margin-bottom: 3px; }
.opening { padding: 54px 0 30px; }
.family .opening h1, .family .product-title h1 { font-size: clamp(39px,4.6vw,66px); }
.opening p { font-size: 20px; max-width: 800px; margin-top: 10px !important; }
.filters { flex-wrap: wrap; gap: 9px; margin: 6px 0 22px; }
.filters button { border: 1px solid #bcc9db; border-radius: 6px; padding: 7px 15px; background: white; }
.filters button[aria-pressed=true] { background: var(--navy); color: white; }
.compact>.shot-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.table-scroll { width: 100%; overflow-x: auto; }
.matrix { width: 100%; min-width: 580px; border-collapse: collapse; background: white; text-align: center; }
.matrix :is(th,td) { padding: 13px; border-bottom: 1px solid var(--line); }
.matrix td { border-inline-start: 1px solid #e5e9f0; }
.matrix th div { display: flex; align-items: center; justify-content: center; gap: 8px; direction: ltr; }
.matrix thead { background: #e8eef8; }
.matrix tbody th, .matrix thead th:first-child { text-align: start; width: 36%; }
.legend { font-size: 14px; color: var(--muted); margin-top: 10px !important; }
.yes { color: var(--blue); font: bold 18px var(--latin); }
.no { color: #5e6f85; }
.product-intro { background: linear-gradient(118deg,var(--pale),#f8f9fd); border-bottom: 1px solid var(--line); }
.product-mast { display: grid; grid-template-columns: 1fr .5fr; align-items: center; gap: 32px; padding-block: 32px; }
.product-title { margin-top: 20px; }
.family .product-title h1 { letter-spacing: -.05em; }
.family .product-intro h2 { font-size: 27px; margin-block: 18px 6px; }
.product-intro p { max-width: 730px; font-size: 19px; }
.back-link { font-size: 14px; }
.product-mast-media { display: flex; justify-content: center; }
.product-mast-media img { width: auto; height: 215px; border-radius: 2px; box-shadow: 4px 8px 16px #17254122; }
.guide { display: grid; grid-template-columns: minmax(180px,24%) 1fr; align-items: start; gap: clamp(22px,5vw,76px); padding-block: 48px; }
.guide aside { position: sticky; top: 24px; }
.guide aside nav { padding: 18px 18px 12px; background: var(--pale); border: 1px solid var(--edge); border-radius: 8px; }
.family .guide aside h2 { font-size: 21px; margin-bottom: 10px; }
.guide aside a { display: block; color: var(--accent); padding-block: 6px; line-height: 1.4; font-size: 15px; }
.guide aside a:hover { text-decoration: underline; }
.guide-group { margin-block-end: 42px; scroll-margin-top: 12px; }
.guide-group:last-child { margin-bottom: 0; }
.family .guide-group h2 { color: var(--accent); border-bottom: 2px solid var(--edge); padding-bottom: 13px; font-size: clamp(24px,2.5vw,35px); }
.guide-entry { padding-block: 14px; border-bottom: 1px solid var(--line); }
.family .guide-entry h3 { font-size: 21px; margin-bottom: 5px; }
.guide-related { margin-top: 20px !important; }
.detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.detail-grid article { border: 1px solid var(--line); background: white; padding: 22px; border-radius: 9px; }
.detail-grid article :is(h2,h3) { font-size: 23px; margin-bottom: 8px; }
.catalog-grid { margin-bottom: 12px; }
.catalog { background: white; border: 1px solid var(--line); overflow: hidden; border-radius: 12px; display: flex; flex-direction: column; }
.cover-shelf { display: grid; place-items: center; padding: 25px 18px; background: var(--pale); border-bottom: 1px solid var(--edge); }
.cover-shelf img { height: clamp(185px,18vw,255px); width: auto; box-shadow: 2px 6px 14px #17254124; transition: transform .16s; }
.cover-shelf:hover img { transform: translateY(-3px); }
.catalog-copy { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.catalog-heading { gap: 10px; }
.family .catalog-heading h2 { font-size: clamp(21px,2vw,27px); }
.catalog-copy p { margin-block: 5px; }
.catalog-copy ul { padding-inline-start: 18px; margin: 4px 0 16px; color: var(--muted); font-size: 15px; }
.pdf-buttons { gap: 8px; flex-wrap: wrap; margin-top: auto; }
.pdf-buttons a { display: inline-flex; align-items: center; gap: 8px; color: var(--navy); border: 1px solid #aebcd0; padding: 7px 12px; border-radius: 5px; font-weight: 700; }
.pdf-buttons a:hover { background: #edf1f9; }
.pdf-buttons span { font: 650 10px var(--latin); }
.catalog .card-link { margin-top: 16px; font-size: 14px; }
.family .resource-section h2 { font-size: 25px; }
.resource-links { max-width: 760px; list-style: none; padding: 0; }
.resource-links a, .contact-rows>a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); color: var(--blue) !important; }
.resource-links a span { font: 12px var(--latin); }
.contact-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding-block: 26px 64px; }
.contact-panel p { margin-top: 7px !important; }
.family .foot { border-top: 1px solid var(--line); background: #eef1f7; padding: 33px 0 16px; }
.foot-grid, .foot-base { display: flex; justify-content: space-between; align-items: flex-start; gap: 23px; }
.foot-links { display: grid; grid-template-columns: repeat(3,auto); column-gap: 30px; row-gap: 6px; }
.foot-base { margin-top: 25px; padding-top: 15px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }
#shot-viewer { width: min(1190px,94vw); max-height: 94vh; overflow: auto; padding: 12px; background: #fff; color: var(--ink); border: 1px solid #b2bfd1; border-radius: 10px; }
#shot-viewer::backdrop { background: #101b31d9; }
#shot-viewer>div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 8px; font-weight: 700; }
#shot-viewer button { width: 38px; height: 38px; background: white; border: 1px solid var(--line); border-radius: 50%; font: 24px Arial; }
#shot-viewer>img { width: 100%; max-height: 79vh; object-fit: contain; }
.kept { width: min(1180px,calc(100% - 80px)); margin: auto; padding-block: 35px; }
.family .kept :is(h2,h3) { margin-block: 12px; }
.family .kept section { margin-block: 22px; }
.family .kept details { color: var(--ink); }

@media (max-width: 1000px) {
  .family .wrap { width: calc(100% - 50px); }
  .mast-inner { gap: 16px; }
  .nav-actions { gap: 12px; }
  .main-nav a { font-size: 14px; }
  .hero-shell { gap: 26px; }
  .products, .catalog-grid { gap: 12px; }
  .product-card { padding: 17px; }
  .product-head { gap: 9px; }
  .product-head img { width: 43px; height: 43px; }
  .stage-caption { padding: 8px 10px; }
}
@media (max-width: 760px) {
  .family .wrap, .kept { width: calc(100% - 32px); }
  .mast-inner { min-height: 64px; }
  .identity img { width: 30px; height: 35px; }
  .identity strong { font-size: 21px; }
  .identity small { font-size: 10px; }
  .main-nav, .contact-btn { display: none !important; }
  .nav-toggle { display: block; }
  .hero-shell { grid-template-columns: 1fr; gap: 22px; padding-block: 28px; }
  .family .hero h1 { font-size: clamp(41px,8vw,57px); margin-block: 12px 8px; }
  html[lang=en] .family .hero h1 { font-size: clamp(39px,7.7vw,55px); }
  .hero-credit { font-size: 12px; }
  .hero-description { font-size: 17px; }
  .hero-actions { margin-top: 16px; }
  .stage { padding: 6px; border-radius: 10px; }
  .stage-tabs { padding-bottom: 5px; }
  .stage-tabs button { font-size: 12px; }
  .stage-tabs img { width: 19px; height: 19px; }
  .stage-caption { font-size: 13px; }
  .band, .guide { padding-block: 34px; }
  .compact { padding-top: 12px; }
  .products, .catalog-grid, .release-strip, .contact-panel, .detail-grid, .compact>.shot-grid { grid-template-columns: 1fr; }
  .section-head { margin-bottom: 16px; align-items: start; flex-wrap: wrap; gap: 7px 16px; }
  .product-head h3 { font-size: 26px; }
  .product-card { padding: 21px; }
  .release-strip { gap: 18px; }
  .release-list article { display: block; }
  .callout { flex-direction: column; align-items: flex-start; gap: 16px; padding: 21px; margin-block-end: 32px; }
  .foot-grid { flex-direction: column; }
  .foot-links { grid-template-columns: repeat(2,1fr); width: 100%; }
  .foot-base { flex-wrap: wrap; }
  .opening { padding: 30px 0 18px; }
  .opening p, .product-intro p { font-size: 17px; }
  .product-mast { padding-block: 22px; gap: 8px; grid-template-columns: 1fr; }
  .product-mast-media { display: none; }
  .product-title { margin-top: 10px; }
  .product-title img { width: 54px; height: 54px; }
  .family .product-intro h2 { font-size: 24px; }
  .guide { grid-template-columns: 1fr; gap: 24px; }
  .guide aside { position: static; }
  .guide aside nav { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 16px; }
  .family .guide aside h2 { width: 100%; margin-bottom: 1px; }
  .guide aside a { padding-block: 2px; text-decoration: underline; text-underline-offset: 3px; }
  .guide-group { margin-block-end: 28px; }
  .cover-shelf img { height: 208px; }
  .contact-panel { gap: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .shotimg img, .cover-shelf img { transition: none; }
}
.guide-search { margin: 10px 0; }
.guide-search label { display: block; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.guide-search input { background: white; color: var(--ink); border: 1px solid #9dabc2; font: inherit; font-size: 14px; border-radius: 5px; width: 100%; padding: 8px; }
.no-matches { color: var(--muted); padding-block: 18px; }
@media (max-width: 760px) { .guide-search { flex: 0 0 100%; margin: 4px 0 7px; } }
.compare-links { display: flex; gap: 10px 24px; flex-wrap: wrap; margin-top: 24px; }
.catalog-meta { color: var(--muted); font-size: 13px; margin-bottom: 7px; }
.catalog-meta span { padding-inline: 3px; }

.chooser-shell { padding-block: clamp(24px,3.5vw,52px); }
.chooser-intro,.panel-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.family .chooser-intro h1,html[lang=en] .family .chooser-intro h1 { margin:0; font-size:clamp(29px,3.3vw,49px); color:white; }
.chooser-intro p { margin-top:6px!important; color:#dbe4f6; }
.chooser-intro .btn-line { flex-shrink:0; }
.chooser .stage-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:0; margin:22px 0 12px; }
.chooser .stage-tabs button { position:relative; display:flex; justify-content:center; gap:16px; min-height:108px; border:1px solid #647895; border-radius:12px; background:#263c59; color:#fff; font-size:clamp(16px,2vw,29px); font-weight:700; }
.chooser .stage-tabs button[aria-selected=true] { background:var(--pale); color:var(--ink); border-color:white; box-shadow:inset 0 -4px var(--accent); }
.chooser .stage-tabs img { width:clamp(52px,5.8vw,80px); height:auto; }
.feature-panel { padding:22px 28px; background:#fff; color:var(--ink); border-radius:12px; }
.family .panel-heading h2 { color:var(--accent); font-size:clamp(23px,2.1vw,32px); }
.feature-panel ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 32px; padding-inline-start:19px; margin:14px 0 0; font-size:17px; line-height:1.5; }
.feature-panel li::marker { color:var(--accent); }
@media(max-width:760px) {
 .chooser-intro { align-items:flex-start; flex-wrap:wrap; gap:6px 14px; }
 .chooser-intro .btn-line { font-size:14px; padding:0; min-height:auto; border:0; text-decoration:underline; }
 .chooser .stage-tabs { gap:7px; margin:14px 0 9px; }
 .chooser .stage-tabs button { min-height:90px; flex-direction:column; gap:4px; font-size:clamp(12px,3.3vw,17px); }
 .chooser .stage-tabs img { width:46px; height:46px; }
 .feature-panel { padding:15px; }
 .panel-heading { flex-wrap:wrap; gap:5px 12px; }
 .panel-heading .inline-link { font-size:14px; }
 .feature-panel ul { grid-template-columns:1fr; gap:7px; font-size:16px; }
}
.chooser-shell { padding-block:clamp(25px,3vw,48px); }
.chooser-intro { justify-content:center; text-align:center; }
.family .chooser-intro h1,html[lang=en] .family .chooser-intro h1 { font-size:clamp(23px,2.6vw,40px); line-height:1.4; text-wrap:balance; }
.chooser-intro h1 span { display:block; color:#c5d7ff; }
.chooser .stage-tabs { gap:clamp(8px,2vw,30px); margin:23px 0 17px; }
.chooser .stage-tabs button { flex-direction:column; gap:10px; min-height:clamp(140px,15vw,224px); }
.chooser .stage-tabs button img { width:clamp(80px,8.8vw,134px); height:auto; }
@media(max-width:760px) {
 .chooser .stage-tabs { gap:6px; margin:16px 0 12px; }
 .chooser .stage-tabs button { min-height:105px; gap:7px; }
 .chooser .stage-tabs button img { width:clamp(48px,15vw,75px); }
}
.brand-pair { display:flex; align-items:center; gap:14px; flex-shrink:0; }
.family-marks { display:grid; grid-template-columns:max-content; border-inline-start:1px solid var(--line); padding-inline-start:14px; text-align:center; }
.family-marks strong { display:block; color:var(--navy); font:700 24px/1.25 var(--latin); margin-bottom:4px; }
.family-marks>div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.32em; contain:inline-size; }
.family-marks a { display:inline-flex; border-radius:5px; }
.family-marks img { width:100%; height:auto; aspect-ratio:1; }
@media(max-width:850px) {
 .main-nav,.contact-btn { display:none!important; }
 .nav-toggle { display:block; }
}
@media(max-width:420px) {
 .brand-pair { gap:7px; }
 .family-marks { padding-inline-start:7px; }
 .family-marks>div { gap:3px; }
 .family-marks strong { font-size:19px; }
 .mast-inner,.nav-actions { gap:6px; }
}
.founder-profile { display:grid; grid-template-columns:minmax(130px,205px) 1fr; gap:30px; align-items:center; padding:25px; background:white; border:1px solid var(--line); border-radius:14px; }
.founder-profile>img { width:100%; border-radius:8px; }
.founder-profile p { margin:10px 0!important; max-width:750px; }
.profile-actions { display:flex; flex-wrap:wrap; align-items:center; gap:15px; margin-top:16px; }
.trial-options .product-card { gap:16px; }
.trial-options h2 { font-size:26px; }
.trial-email { padding-block:24px 64px; }
@media(min-width:851px) and (max-width:1090px) { .main-nav { gap:9px; } .mast-inner { gap:8px; } .main-nav a,.family .contact-btn {font-size:13px;} .family .contact-btn {padding:8px;} }
@media(max-width:650px){.founder-profile{grid-template-columns:1fr;gap:8px;padding:18px}.founder-profile>img{max-width:145px}}
.founder-credentials { display:grid; gap:3px; color:var(--navy); font-family:var(--latin); }
.founder-credentials strong { justify-self:start; font-size:16px; line-height:1.45; }
.filter-count { font:600 .82em var(--latin); opacity:.85; }
.panel-heading h2 { margin-inline-end:auto!important; }
#shot-viewer .shot-description { padding:8px 4px; font-size:16px; }
.shot-controls { display:flex; align-items:center; justify-content:center; gap:18px; border-top:1px solid var(--line); padding-top:8px; }
#shot-viewer .shot-controls button { width:auto; height:auto; border-radius:6px; padding:5px 12px; font:700 15px var(--ui); }
.shot-controls button:disabled { opacity:.38; cursor:default; }
.shot-index { direction:ltr; font:600 14px var(--latin); }
#shot-viewer>img { max-height:66vh; }
.screen-zone .shot-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media(max-width:1000px) { .screen-zone .shot-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { .screen-zone .shot-grid { grid-template-columns:1fr; } }

.chooser-intro h1 .family-tagline{margin-block-start:.22em;font-size:clamp(1rem,2vw,1.6rem);line-height:1.55}

.makeen-name { display:inline-flex; align-items:center; gap:.32em; white-space:nowrap; line-height:1.3; }
.makeen-name [lang=ar] { font-family:var(--ui); font-weight:700; font-size:1.12em; line-height:1.35; letter-spacing:normal; }
.makeen-name [lang=en] { font-family:var(--latin); font-size:.76em; letter-spacing:.01em; border-inline-end:1px solid currentColor; padding-inline-end:.42em; }
.chooser-intro .makeen-name [lang=en] { color:#c5d7ff; }
.family-marks .makeen-name [lang=en] { color:#455a78; }

.mast .identity {
  font-size:clamp(16px,1.8vw,24px);
  gap:.35em;
  line-height:1.07;
}
.mast .identity strong, .mast .identity small {
  font:inherit;
  font-weight:700;
  letter-spacing:-.035em;
  white-space:nowrap;
}
.mast .identity small { margin-top:.08em; }
.mast .identity img { width:auto; height:2.22em; flex:none; }
@media(max-width:420px) {
  .mast .identity { font-size:clamp(13px,3.9vw,16px); }
}
@media(max-width:370px) {
  .mast .wrap { width:calc(100% - 16px); }
  .mast-inner { flex-wrap:wrap; }
}
@media(min-width:851px) and (max-width:1120px) {
  .main-nav,.contact-btn { display:none!important; }
  .nav-toggle { display:block; }
}