/* Bayt Al Dalal brand guideline, pp. 12–29. Shared by every storefront / studio surface. */
:root {
  --brand-burgundy: #7a1129;
  --brand-light-pink: #f7aca4;
  --brand-dusty-coral: #d1766b;
  --brand-deep-wine: #4c0014;
  --brand-sable: #110c0d;
  --brand-cream: #fff7e2;
  --brand-rose-gold: linear-gradient(110deg,#d1766b,#e08077,#f7aca4,#e7877f,#d1766b,#ca6c62);
  --wine: var(--brand-burgundy);
  --wine-deep: var(--brand-deep-wine);
  --ink: var(--brand-sable);
  --paper: var(--brand-cream);
  --surface: #fce4d8;
  --muted: #685052;
  --line: #dcc1b4;
  --control-line: #a36d6b;
  --success: #416047;
  --warning: #7d4250;
  --danger: var(--brand-burgundy);
  --english-ui: 'DM Sans',Arial,sans-serif;
  --image-surface: var(--brand-cream);
  --gold: var(--brand-burgundy);
  --arabic-ui: 'IBM Plex Sans Arabic',Tahoma,Arial,sans-serif;
  --arabic-display: 'Bayt Panorama','Amiri','IBM Plex Sans Arabic',serif;
  --arabic-secondary: 'Bayt Uthman','Amiri',serif;
  --english-display: 'Bayt Minion','Cormorant Garamond',Georgia,serif;
}
::selection { color: var(--brand-cream); background: var(--brand-burgundy); }
.brand-logo { display: block; height: auto; max-width: 100%; object-fit: contain; }
.atelier-header .brand-logo { width: 190px; }
.atelier-header .logo-on-dark { display: none; }
.scene-outside .atelier-header .logo-on-light,
.scene-rooms .atelier-header .logo-on-light { display: none; }
.scene-outside .atelier-header .logo-on-dark,
.scene-rooms .atelier-header .logo-on-dark { display: block; }
.atelier-header .wordmark { min-width: 0; }
.tour-signature { width: 98px; flex-shrink: 0; }
.intro-signature { width: 110px; height: auto; margin: 0 auto 26px; }
.brand-intro { position: relative; }
.brand-intro::after { content: ''; display: block; width: 88px; height: 2px; margin: 36px auto 0; background: var(--brand-rose-gold); }
.home-editorial h2, .hero h1, .house-story h2, .guide-intro h2 { font-family: var(--english-display); font-style: italic; font-weight: 600; }
[dir=rtl] .home-editorial h2, [dir=rtl] .hero h1, [dir=rtl] .house-story h2, [dir=rtl] .guide-intro h2 { font-family: var(--arabic-display); font-style: normal; font-weight: 400; }
[dir=rtl] .brand-notes h3 { font-family: var(--arabic-secondary); font-weight: 700; }
.meaning-copy .editorial-kicker, .house-label .eyebrow, .guide-intro .eyebrow { color: var(--brand-light-pink); }
.house-seal.brand-logo { width: 160px; height: auto; border: 0; border-radius: 0; }
.footer-logo { width: 188px; }
footer { background: var(--brand-sable); }
.footer-bottom { position: relative; }
.footer-bottom::after { content: ''; display: block; width: 100%; height: 13px; margin-top: 24px; background: url('/brand/pattern.svg') repeat-x center / 22px auto; opacity: .5; pointer-events: none; }
.guide-brand.brand-logo { width: 150px; }
.checkout-brand, .wardrobe-brand { width: 116px; margin-bottom: 14px; }
.studio-brand .brand-logo { width: 176px; }
.studio-brand small { font-size: 10px; letter-spacing: 2px; margin-top: 3px; text-align: center; }
.studio-header .studio-brand { flex-shrink: 0; }
.studio-header { min-height: 113px; }
.access-intro { position: relative; }
.access-intro::after { content: ''; display: block; height: 20px; width: min(210px,100%); margin-top: 32px; background: url('/brand/pattern.svg') repeat-x center / 32px auto; opacity: .6; pointer-events: none; }
.primary { color: var(--brand-cream); }
.primary:hover { background: var(--brand-deep-wine); }
button, input, select, textarea { accent-color: var(--brand-burgundy); }
@media (max-width: 650px) {
  .atelier-header .brand-logo { width: 154px; }
  .atelier-header { gap: 4px; padding-inline: 12px; }
  .house-seal.brand-logo { width: 96px; }
  .footer-logo { width: 170px; }
  .guide-brand.brand-logo { width: 126px; }
  .studio-header .studio-brand .brand-logo { width: 122px; }
  .studio-header { min-height: 100px; }
  .studio-brand small { font-size: 9px; letter-spacing: 1px; }
  .access-header .studio-brand .brand-logo { width: 146px; }
  .checkout-brand, .wardrobe-brand { width: 106px; }
}
@media (max-width: 380px) {
  .atelier-header .brand-logo { width: clamp(104px,calc(100vw - 216px),138px); }
  .atelier-header { padding-inline: 10px; }
  .studio-header-actions { gap: 8px; font-size: 12px; }
  .studio-header-actions button { font-size: 12px; padding-inline: 8px; }
}

/* Shared detail rules for browsing, checkout, studio preview and error pages. */
:root { color-scheme: light; }
.detail-brand { width: 116px; margin-bottom: 16px; }
:where(button,a,input,select,textarea,summary):focus-visible { outline: 2px solid var(--wine); outline-offset: 4px; }
:where(input,textarea)::placeholder { color: var(--muted); opacity: 1; }
.text-button { color: var(--wine); }
.foyer-bottom .text-button { color: var(--brand-cream); }
.product-image, .feature-photo, .wardrobe-item-photo, .catalog-photo,
#productDetail > img, .preview-detail > img, .inventory-product-info img { background: var(--image-surface); }
[dir=ltr] :is(.collection h2,#productDetail h2,.wardrobe-header h2,.checkout-heading h2,.guide-links strong,.brand-error-page h1) { font-family: var(--english-display); font-style: italic; font-weight: 600; }
.brand-error-page { min-height: 100svh; padding: clamp(100px,15vh,160px) 24px 64px; background: var(--paper); color: var(--ink); text-align: center; font: 16px/1.9 var(--arabic-ui); position: relative; }
[dir=ltr] .brand-error-page { font-family: var(--english-ui); }
.brand-error-logo { display: block; width: min(228px,70vw); margin: 0 auto 32px; }
.brand-error-page h1 { font: 400 clamp(30px,5vw,46px)/1.6 var(--arabic-display); margin: 12px 0; color: var(--wine); }
.brand-error-page p { color: var(--muted); max-width: 48ch; margin: 0 auto; }
.brand-error-code { display: block; color: var(--wine); font: 500 13px/1.8 var(--english-ui); letter-spacing: .18em; }
.brand-error-return { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: 12px 28px; margin-top: 28px; background: var(--wine); color: var(--paper); border: 1px solid var(--wine); text-decoration: none; }
.brand-error-return:hover { background: var(--wine-deep); }
.brand-error-language { position: absolute; inset-inline-end: 24px; top: 24px; min-height: 44px; padding: 8px 12px; border: 0; background: transparent; color: var(--wine); font: 14px/1.7 var(--english-ui); cursor: pointer; }
@media (max-width: 550px) { .detail-brand { width: 106px; } }
@media (min-width: 1001px) {
  .studio-header { height: 128px; min-height: 128px; }
  .studio-navigation { top: 128px; }
}
@media (max-width: 1000px) { .studio-header { height: auto; } }
#orderTitle { font-family: var(--english-ui); font-size: 26px; letter-spacing: .03em; overflow-wrap: anywhere; }
