/* store / minimal-white — tokens from the site DNA (demo palette) */
:root {
  --bg: #ffffff; --surface: #f3f3f1; --fg: #111111; --muted: #636363; --line: #e6e6e6;
  --accent: #2f5d50; --accent-text: #2f5d50; --focus: #111111; --kicker: #636363;
  --ph-bg: #f3f3f1; --ph-line: rgb(17 17 17 / .035); --ph-fg: #3a3a3a; --ph-tag-bg: #ffffff; --ph-radius: 0;
  --field-line: #cfcfcf; --field-radius: 2px;
  --maxw: 1280px; --sp: clamp(56px, 7vw, 112px); --fs-body: .9375rem;
  --font-display: 'Outfit', system-ui, sans-serif; --font-body: 'Outfit', system-ui, sans-serif; --font-ui: 'Outfit', system-ui, sans-serif;
  --fw-display: 400; --lh-display: 1.1; --fs-h1: clamp(30px, 3.6vw, 48px); --fs-h2: clamp(22px, 2.2vw, 30px); --fw-card: 400;
}
:root:lang(ar) {
  --font-display: 'Alexandria', 'Outfit', sans-serif; --font-body: 'Alexandria', 'Outfit', sans-serif; --font-ui: 'Alexandria', 'Outfit', sans-serif;
  --fw-display: 500; --lh-display: 1.5; --fs-h1: clamp(28px, 3.2vw, 44px); --fs-h2: clamp(22px, 2vw, 28px); --fw-card: 400; --lh-body: 1.9; --fs-body: .9375rem;
}
body { font-weight: 300; }
.tone--alt { background: var(--surface); }
em { font-style: normal; color: var(--muted); }
.sh { max-inline-size: none; grid-template-columns: 1fr auto; align-items: end; margin-block-end: 28px; }
.sh__title { grid-column: 1; }
.sh__link { grid-column: 2; grid-row: 1 / span 2; align-self: end; font-weight: 400; }
.sh__lead { grid-column: 1; }
.sh__kicker { font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 400; }
:lang(ar) .sh__kicker { text-transform: none; font-size: .85rem; }
.btn { border-radius: 0; font-weight: 400; min-block-size: 44px; }
.btn--primary { background: var(--fg); color: #fff; }
.tlink { font-weight: 400; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.tlink .i { display: none; }
.card__title { font-size: .95rem; }
.card__text { font-size: .9rem; }
.price-slot { border-style: solid; border-color: var(--line); color: var(--muted); font-weight: 400; }

/* header */
.band { background: var(--surface); color: var(--fg); }
.band__in { font-size: .78rem; }
.hd { border-block-end: 1px solid var(--line); }
.hd__in { min-block-size: 64px; }
.hd__brand { font-weight: 500; font-size: 1.15rem; letter-spacing: .08em; text-transform: uppercase; }
:lang(ar) .hd__brand { text-transform: none; letter-spacing: 0; }
@media (min-width: 960px) { .hd__in { display: grid; grid-template-columns: 1fr auto 1fr; } .hd__actions { justify-self: end; } }
.nav-desktop { gap: 32px; font-size: .875rem; }
.nav-desktop li:first-child a { box-shadow: inset 0 -3px 0 var(--accent); padding-block: 22px; }

/* hero: image then caption */
.s--hero { padding-block: 24px clamp(48px, 6vw, 88px); }
.s--hero .hero__inner { grid-template-columns: 1fr; gap: 28px; }
.s--hero .hero__media { order: -1; }
@media (max-width: 599px) { .s--hero .hero__m1 { aspect-ratio: 4 / 5; } }
@media (min-width: 760px) {
  .s--hero .hero__copy { grid-template-columns: 1fr 1fr; column-gap: 40px; align-items: end; justify-items: stretch; }
  .s--hero .hero__title { grid-row: 1 / span 2; }
  .s--hero .hero__lead, .s--hero .hero__ctas { grid-column: 2; }
}
.hero__lead { font-size: 1rem; }
.s--hero .btn--primary { background: none; color: var(--fg); padding-inline: 0; border-width: 0 0 1px; border-color: var(--fg); min-block-size: 36px; }

/* products */
.s--products .cards { grid-template-columns: repeat(2, 1fr); gap: 32px 12px; }
@media (min-width: 760px) { .s--products .cards { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .s--products .cards { grid-template-columns: repeat(4, 1fr); gap: 40px 16px; } }
.s--products .card { gap: 12px; }
.s--products .card__body { grid-template-columns: 1fr auto; gap: 4px 12px; }
.s--products .card__sw { grid-column: 1; }
.s--products .card__price { grid-column: 2; grid-row: 1; font-weight: 400; }
.s--products .sw { inline-size: 12px; block-size: 12px; }

/* departments */
.s--collections { padding-block-start: 0; }
.s--collections .cards { grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 700px) { .s--collections .cards { grid-template-columns: 1fr 1fr; } }
.s--collections .card { position: relative; }
.s--collections .card__body { position: absolute; inset-block-end: 20px; inset-inline-start: 20px; background: #fff; padding: 14px 20px; grid-template-columns: auto auto; gap: 20px; align-items: baseline; }
.s--collections .card__title { font-size: 1.05rem; font-weight: 500; }
.s--collections .ph__tag { position: absolute; inset-block-start: 16px; inset-inline-end: 16px; }

/* service promises */
.s--shipping { padding-block: 48px; }
.s--shipping .sh { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; }
.s--shipping .cards { grid-template-columns: repeat(2, 1fr); gap: 28px 16px; }
@media (min-width: 760px) { .s--shipping .cards { grid-template-columns: repeat(4, 1fr); } }
.s--shipping .card__icon { inline-size: auto; block-size: auto; justify-content: start; }
.s--shipping .card__icon .i { stroke-width: 1.2; inline-size: 28px; block-size: 28px; }
.s--shipping .card__title { font-weight: 500; }

/* story small */
.v--statement-small .mt { grid-template-columns: 1fr; }
@media (min-width: 760px) { .v--statement-small .mt { grid-template-columns: 4fr 8fr; } }
@media (min-width: 1100px) { .v--statement-small .mt { grid-template-columns: 3fr 6fr 3fr; } }
.v--statement-small .mt__media { max-inline-size: 320px; }
.v--statement-small .sh { grid-template-columns: 1fr; }
.v--statement-small .sh__title { font-size: clamp(24px, 2.6vw, 36px); }

/* newsletter inline */
.s--newsletter { padding-block: 48px 72px; }
.nl { border-block-start: 1px solid var(--line); padding-block-start: 32px; }
@media (min-width: 760px) { .nl { grid-template-columns: 1fr 1fr; align-items: end; column-gap: 40px; } }
.nl .sh { margin: 0; grid-template-columns: 1fr; }
.nl__label { font-weight: 400; font-size: .85rem; color: var(--muted); }

/* footer */
.ft { border-block-start: 1px solid var(--line); }
.ft__name { font-weight: 500; font-size: 1.1rem; letter-spacing: .08em; text-transform: uppercase; }
:lang(ar) .ft__name { letter-spacing: 0; text-transform: none; }
.ft__h { font-weight: 500; }
.ft__col a { color: var(--muted); }