/* Sejo: styles for collection.html and visit.html plus shared page bits. Loads after site.css. */
.eyebrow{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:18px}
html[dir=rtl] .eyebrow{letter-spacing:0;font-size:.95rem}
.nav__links a[aria-current=page]{color:var(--ink);background:rgba(21,20,19,.07)}
.foot__links{display:flex;flex-wrap:wrap;gap:6px 22px}
.foot__links a{color:rgba(236,232,225,.75);transition:color .2s}
@media (hover:hover) and (pointer:fine){.foot__links a:hover{color:#fff}}
[data-parallax]{scale:1.2;will-change:transform}
.line{display:block;overflow:clip;padding-bottom:.14em;margin-bottom:-.14em}
.line .w{display:inline-block}
.js .chead__title .w,.js .vhero__title .w{transform:translateY(112%)}
.loaded .chead__title .w,.loaded .vhero__title .w{transform:none;transition:transform 1.1s var(--ease)}
.loaded .chead__title .line:nth-child(2) .w,.loaded .vhero__title .line:nth-child(2) .w{transition-delay:.14s}
.js .chead__sub,.js .vhero__sub,.js .vhero__cta,.js .chead .eyebrow,.js .vhero .eyebrow{opacity:0;transform:translateY(16px)}
.loaded .chead__sub,.loaded .vhero__sub,.loaded .vhero__cta,.loaded .chead .eyebrow,.loaded .vhero .eyebrow{opacity:1;transform:none;transition:opacity .9s var(--ease),transform .9s var(--ease)}
.loaded .chead__sub,.loaded .vhero__sub{transition-delay:.45s}.loaded .vhero__cta{transition-delay:.6s}

/* ========== COLLECTION ========== */
.chead{position:relative;min-height:84svh;display:grid;align-items:end;overflow:clip;padding:calc(var(--nav-h) + 90px) 0 clamp(40px,6vw,80px);isolation:isolate}
.chead__script{position:absolute;z-index:-1;inset-inline-start:-2vw;top:10%;font-family:var(--f-script);font-size:clamp(12rem,40vw,40rem);line-height:.8;color:rgba(21,20,19,.055);white-space:nowrap;pointer-events:none;will-change:transform}
.chead__title{font-size:clamp(2.6rem,8vw,7.4rem);font-weight:600;letter-spacing:-.045em;line-height:1;max-width:16ch}
html[dir=rtl] .chead__title{letter-spacing:0;line-height:1.2;font-size:clamp(2.4rem,7vw,6rem)}
.chead__sub{margin-top:24px;max-width:36ch;color:var(--muted);font-size:clamp(1rem,1.2vw + .5rem,1.25rem)}

.shelf{padding-bottom:clamp(60px,9vw,120px)}
.filters{position:sticky;top:calc(var(--nav-h) + 16px);z-index:20;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 12px;margin-bottom:clamp(22px,3vw,40px);border-radius:99px;background:rgba(246,243,238,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line)}
.filters__chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.filters__chips::-webkit-scrollbar{display:none}
.chip{border:1px solid transparent;background:transparent;border-radius:99px;padding:9px 18px;font-size:.92rem;font-weight:500;color:var(--muted);white-space:nowrap;min-height:40px;touch-action:manipulation;transition:background .25s var(--ease),color .25s var(--ease)}
.chip.is-on{background:var(--ink);color:var(--bg)}
@media (hover:hover) and (pointer:fine){.chip:not(.is-on):hover{color:var(--ink);background:rgba(21,20,19,.06)}}
.filters__count{font-size:.92rem;color:var(--muted);padding-inline:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.filters__count b{color:var(--ink);font-weight:600}

.cgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,28px)}
.pcard{position:relative;transition:opacity .28s var(--ease),transform .28s var(--ease)}
.pcard.is-out{opacity:0;transform:scale(.96)}
.cgrid .pcard:nth-child(3n+2){margin-top:clamp(0px,5vw,72px)}
.js .pcard[data-reveal]{transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
.js .pcard[data-reveal].in{transition:opacity .28s var(--ease),transform .28s var(--ease)}
.pcard__open{display:block;width:100%;padding:0;border:0;background:transparent;text-align:inherit;cursor:pointer;touch-action:manipulation}
.pcard figure{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/4;background:var(--surface);box-shadow:0 30px 44px -32px rgba(21,20,19,.5)}
.pcard figure img{width:100%;height:100%;object-fit:cover}
.pcard__info{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 4px 0}
.pcard__info h3{font-size:1.08rem;letter-spacing:-.015em;font-weight:600}
html[dir=rtl] .pcard__info h3{letter-spacing:0}
.pcard__info p{font-size:.88rem}
.save{position:absolute;inset-block-start:12px;inset-inline-end:12px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(246,243,238,.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;transition:transform .2s var(--ease),background .25s;touch-action:manipulation;z-index:2}
.save svg{width:20px;height:20px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linejoin:round;transition:fill .25s,stroke .25s}
.save.on{background:var(--accent)}
.save.on svg{fill:#fff;stroke:#fff}
.save:active{transform:scale(.92)}
.pcard figure img{transition:scale .7s var(--ease)}
@media (hover:hover) and (pointer:fine){.pcard__open:hover figure{box-shadow:0 36px 50px -30px rgba(21,20,19,.6)}.save:hover{transform:scale(1.06)}}
.pcard--cta{align-self:stretch}
.ctile{height:100%;min-height:320px;display:grid;align-content:center;justify-items:start;gap:16px;padding:clamp(22px,3vw,40px);border-radius:var(--r-lg);border:1px dashed rgba(21,20,19,.3)}
.ctile p{font-size:clamp(1.4rem,2.4vw,2.1rem);font-weight:600;letter-spacing:-.03em;line-height:1.1}
html[dir=rtl] .ctile p{letter-spacing:0;line-height:1.3}
.more{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:clamp(50px,7vw,100px);padding-top:clamp(28px,4vw,48px);border-top:1px solid var(--line)}
.more h2{font-size:clamp(1.7rem,3.4vw,2.8rem);max-width:18ch;margin-bottom:10px}
.band{background:var(--surface);border-block:1px solid var(--line);padding:clamp(40px,6vw,80px) 0}
.band__in{display:flex;align-items:center;gap:clamp(20px,5vw,70px);flex-wrap:wrap}
.band__num{font-size:clamp(5rem,13vw,11rem);font-weight:700;letter-spacing:-.06em;line-height:.85;color:var(--accent);display:flex;align-items:baseline;direction:ltr}
.band__num i{font-style:normal;font-size:.5em;margin-inline:.08em}
.band h2{font-size:clamp(1.5rem,3vw,2.4rem);max-width:20ch;margin-bottom:8px}
.band .btn{margin-inline-start:auto}
@media (max-width:760px){.band .btn{margin-inline-start:0}}

.saved{position:fixed;z-index:55;inset-inline:0;bottom:max(14px,env(safe-area-inset-bottom));margin-inline:auto;width:min(560px,100% - 24px);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 8px 8px 22px;border-radius:99px;background:rgba(246,243,238,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);box-shadow:0 20px 40px -18px rgba(21,20,19,.4);animation:sin .4s var(--ease)}
@keyframes sin{from{opacity:0;transform:translateY(18px)}}
html[dir=rtl] .saved{padding:8px 22px 8px 8px}
.saved[hidden]{display:none}
.saved p{font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.saved__acts{display:flex;gap:8px;align-items:center}
.saved .btn--ghost{padding:10px 16px;font-size:.9rem}
body.has-saved .shelf{padding-bottom:150px}

.viewer{border:0;padding:0;width:min(940px,100% - 24px);max-height:calc(100svh - 24px);border-radius:var(--r-lg);background:var(--surface);color:var(--ink);overflow:auto;box-shadow:0 50px 100px -30px rgba(21,20,19,.55)}
.viewer::backdrop{background:rgba(21,20,19,.45);backdrop-filter:blur(4px)}
.viewer[open]{animation:vin .35s var(--ease)}
@keyframes vin{from{opacity:0;transform:translateY(16px) scale(.97)}}
.viewer__x{position:absolute;z-index:3;inset-block-start:12px;inset-inline-end:12px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(246,243,238,.92);font-size:1.6rem;line-height:1;display:grid;place-items:center}
.viewer__body{display:grid;grid-template-columns:1fr 1fr}
.viewer__img{margin:0;background:var(--bg2);min-height:340px}
.viewer__img img{width:100%;height:100%;object-fit:cover;max-height:calc(100svh - 24px)}
.viewer__txt{padding:clamp(24px,4vw,48px);display:grid;align-content:center;gap:14px}
.viewer__txt h2{font-size:clamp(1.8rem,3.4vw,2.8rem)}
.viewer__acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.viewer__nav{display:flex;gap:8px;margin-top:6px}
.viewer__nav .btn{padding:10px 20px}
@media (max-width:760px){
  .cgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pcard--cta{grid-column:1/-1;margin-top:0!important}
  .cgrid .pcard:nth-child(3n+2){margin-top:0}
  .cgrid .pcard:nth-child(2n){margin-top:36px}
  .pcard__info{flex-direction:column;gap:2px}
  .viewer__body{grid-template-columns:1fr}
  .viewer__img{min-height:0;max-height:46svh}
  .filters{border-radius:20px}
  .filters__count{display:none}
}

/* ========== VISIT ========== */
.vhero{position:relative;height:210svh}
.vhero__pin{position:sticky;top:0;height:100svh;overflow:clip;isolation:isolate}
.vhero__script{position:absolute;z-index:-1;inset-inline-start:-2vw;bottom:-4vw;font-family:var(--f-script);font-size:clamp(14rem,46vw,46rem);line-height:.8;color:rgba(21,20,19,.055);white-space:nowrap;pointer-events:none;will-change:transform}
.vhero__ph{position:absolute;margin:0;inset-inline-end:var(--gut);top:calc(var(--nav-h) + 40px);height:calc(100svh - var(--nav-h) - 80px);aspect-ratio:9/16;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 50px 80px -40px rgba(21,20,19,.55);will-change:transform;z-index:0}
.vhero__ph img{width:100%;height:100%;object-fit:cover}
.vhero__copy{position:absolute;inset-inline-start:var(--gut);top:50%;translate:0 -50%;width:min(760px,58% - var(--gut));margin:0;will-change:transform,opacity}
.vhero__title{font-size:clamp(2.7rem,7vw,6.2rem);font-weight:600;letter-spacing:-.045em;line-height:1}
html[dir=rtl] .vhero__title{letter-spacing:0;line-height:1.2;font-size:clamp(2.4rem,6.2vw,5.4rem)}
.vhero__sub{margin-top:22px;max-width:32ch;color:var(--muted);font-size:clamp(1rem,1.2vw + .5rem,1.25rem)}
.vhero__cta{margin-top:30px;display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:820px){
  .vhero__ph{height:auto;width:46vw;top:calc(var(--nav-h) + 24px)}
  .vhero__copy{top:auto;bottom:6svh;translate:0 0;width:calc(100% - var(--gut)*2)}
}
.pillars{position:relative;height:380svh;background:var(--bg2)}
.pillars__pin{position:sticky;top:0;height:100svh;overflow:clip;display:grid;align-items:center;padding:0 var(--gut)}
.pillars__words{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.pw{grid-area:1/1;font-size:clamp(4rem,15.5vw,16rem);font-weight:700;letter-spacing:-.06em;line-height:.9;text-transform:uppercase;color:var(--ink);white-space:nowrap;will-change:transform,opacity}
html[dir=rtl] .pw{letter-spacing:0;text-transform:none;line-height:1.1}
.pillars__list{position:relative;display:grid;align-self:end;width:min(520px,100%);padding-bottom:9svh}
.pillars__list li{grid-area:1/1;opacity:0;transform:translateY(14px);transition:opacity .4s var(--ease),transform .5s var(--ease);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(18px,3vw,28px)}
.pillars__list li.on{opacity:1;transform:none}
.pillars__list h2{font-size:clamp(1.5rem,2.6vw,2.2rem);margin-bottom:8px}
.pillars__list p{color:var(--muted)}
.gal{padding:clamp(70px,10vw,150px) 0 clamp(40px,6vw,80px)}
.gal__row{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(12px,2vw,28px);align-items:start}
.gal figure{margin:0;border-radius:var(--r-lg);overflow:hidden;background:var(--surface);aspect-ratio:3/4;box-shadow:0 34px 50px -34px rgba(21,20,19,.5)}
.gal figure img{width:100%;height:100%;object-fit:cover}
.gal__a{grid-column:1/6}.gal__b{grid-column:6/10;margin-top:clamp(40px,9vw,140px)}.gal__c{grid-column:10/13;margin-top:clamp(10px,3vw,40px)}
.gal__cap{margin-top:clamp(24px,3vw,40px);max-width:44ch}
@media (max-width:760px){.gal__a{grid-column:1/8}.gal__b{grid-column:8/13;margin-top:50px}.gal__c{grid-column:3/10;margin-top:0}}
.note{margin-top:14px;font-size:.92rem}
.msg{padding:clamp(40px,6vw,90px) 0 clamp(80px,12vw,160px)}
.msg__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);align-items:start}
.msg h2{font-size:clamp(2rem,5vw,4rem);margin-bottom:16px}
.form{padding:clamp(20px,3vw,34px);display:grid;gap:8px}
.form label{font-size:.9rem;font-weight:500;margin-top:8px}
.form input,.form textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;transition:border-color .2s,box-shadow .2s}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(21,20,19,.08)}
.form textarea{resize:vertical;min-height:120px}
.form .btn{margin-top:14px;justify-self:start}
@media (max-width:820px){.msg__grid{grid-template-columns:1fr}}
.page-visit .visit{padding-top:clamp(70px,10vw,140px)}

/* reduced motion for new scenes */
.rm .vhero,.rm .pillars{height:auto}
.rm .vhero__pin,.rm .pillars__pin{position:relative;height:auto;min-height:100svh}
.rm .pillars__words{display:none}
.rm .pillars__list{gap:14px}
.rm .pillars__list li{grid-area:auto;opacity:1;transform:none}
.rm [data-parallax]{transform:none!important}

@media (max-width:760px){.foot__word{margin-bottom:16vw}}
.foot__row{padding-bottom:4px}

.chip--offer{color:var(--accent);border-color:rgba(210,56,43,.35)}
@media (hover:hover) and (pointer:fine){.chip--offer:hover{background:var(--accent);color:#fff;border-color:var(--accent)}}
.nav__links a{white-space:nowrap}
@media (max-width:640px){.nav__links a:nth-child(2){display:inline-block!important}.nav__links a{padding:8px 9px;font-size:.84rem}}
@media (max-width:430px){.nav__word{display:none}.nav{gap:6px;padding-inline:8px}}

/* three-link nav: short labels on narrow phones */
@media (max-width:640px){.nav__links a{padding:8px 11px}}
@media (max-width:480px){
  .nav__links a{font-size:0;padding:8px 10px}
  .nav__links a::after{content:attr(data-s-en);font-size:.86rem}
  html[lang=ar] .nav__links a::after{content:attr(data-s-ar)}
}
@media (max-width:640px){.nav__links a:nth-child(n){display:inline-block!important}}

/* ===== phone refinements (iPhone-size, short viewports) ===== */
@media (max-width:760px){
  .hero__copy{top:calc(var(--nav-h) + 36px);translate:0 0;width:calc(100% - var(--gut)*2)}
  .hero__title{font-size:clamp(2.6rem,12.4vw,3.6rem)}
  .hero__sub{margin-top:16px;font-size:1rem;max-width:28ch}
  .hero__cta{margin-top:22px}
  .hero__wash{background:linear-gradient(180deg,rgba(236,232,225,.97) 0%,rgba(236,232,225,.86) 38%,rgba(236,232,225,.28) 62%,rgba(236,232,225,0) 78%)}
  .hero__bg img{object-position:70% 62%}
  .hero__ph--a{inset-inline-end:calc(var(--gut) + 38vw);bottom:5svh;width:33vw}
  .hero__ph--b{inset-inline-end:var(--gut);bottom:3svh;width:39vw}
  .js .hero__ph{opacity:0}
  .loaded .hero__ph{opacity:1;transition:opacity 1.1s var(--ease) 1s}
  /* offer: poster tucks beside the number, body at the bottom */
  .offer__pin{padding-bottom:20px}
  .offer__ph{top:calc(var(--nav-h) + 34px);width:min(38vw,calc(30svh*.75));rotate:3deg}
  .offer__num{font-size:clamp(6.5rem,34vw,11rem)}
  .offer__body{padding:16px 18px;gap:12px}
  .offer__body h2{font-size:clamp(1.5rem,6.6vw,1.9rem)}
  .offer__sub{font-size:.95rem}
}

.hero__loc{display:none}
@media (max-width:760px){
  .hero__loc{display:inline-flex;align-items:center;gap:8px;position:absolute;inset-inline-start:var(--gut);bottom:4svh;padding:10px 16px;border-radius:99px;background:rgba(246,243,238,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);font-size:.9rem;font-weight:500;z-index:3}
  .hero__loc svg{width:16px;height:16px;fill:none;stroke:var(--accent);stroke-width:2}
  .js .hero__loc{opacity:0}.loaded .hero__loc{opacity:1;transition:opacity 1s var(--ease) 1.2s}
  .hero__ph--a{bottom:11svh;inset-inline-end:calc(var(--gut) + 36vw)}
}
@media (max-width:760px){.hero__ph--a{width:min(31vw,calc(30svh*.5625))}.hero__ph--b{width:min(37vw,calc(32svh*.75))}}
@media (max-width:760px){.pw{font-size:clamp(4rem,19.5vw,9rem)}.pillars__list{padding-bottom:6svh}.pillars__list li{padding:16px 18px}}
@media (max-width:760px){.viewer__img{max-height:34svh}.viewer__img img{max-height:34svh}.viewer__txt{padding:18px 20px 22px;gap:10px}.viewer__txt h2{font-size:1.6rem}.viewer__acts{margin-top:4px}}
@media (max-width:760px){.hero__ph--a{width:min(29vw,calc(26svh*.5625));bottom:10svh}.hero__ph--b{width:min(35vw,calc(28svh*.75));bottom:3svh}}
[data-parallax]{scale:1.12}
.slide--2 img{object-position:50% 30%}.slide--3 img{object-position:50% 12%}