/* sections.css (Builder 2): texture bands, Nila, find your ritual, the ritual guide, good to know.
   Tokens only. The Nila blue (--nila) is used for the 10 px swatch and nothing else; it is never type. */

/* ---------- small shared pieces ---------- */
.arr{flex:none;transition:transform .25s var(--ease)}
.gd-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- texture bands ---------- */
.tb{position:relative;height:68vh;min-height:480px;max-height:860px;overflow:hidden;background:var(--umber-2);color:var(--off);isolation:isolate}
/* the photo sits in a wrapper 125 percent tall so it can travel; static page shows it centred */
.tb-media{position:absolute;left:0;right:0;top:0;height:125%;transform:translate3d(0,-10%,0)}
.tb-media picture{display:block;width:100%;height:100%}
.tb-media img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%}
/* a scrim only where the text sits */
.tb-scrim{position:absolute;left:0;top:0;bottom:0;width:min(66%,960px);background:linear-gradient(90deg,rgba(42,29,21,.62) 0%,rgba(42,29,21,.5) 45%,rgba(42,29,21,0) 100%);pointer-events:none}
/* a soft pool of the same umber right behind the words, so the 12 px label clears 4.5:1 even on the sunlit parts of his photographs */
.tb-scrim::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 62% 80% at 12% 50%,rgba(42,29,21,.32),rgba(42,29,21,0) 100%)}
.tb-copy{position:relative;z-index:2;height:100%;display:flex;align-items:center}
.tb-text{max-width:min(41vw,620px)}
.tb-text .label{color:var(--off);margin-bottom:16px}
.tb-line{font-size:clamp(32px,3.75vw,48px);line-height:1.08;letter-spacing:-.018em;color:var(--off);margin-bottom:24px}
.tb-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-weight:600;font-size:17px;color:var(--off)}
.tb-link span{border-bottom:1.5px solid var(--amber);padding-bottom:2px;transition:border-color .2s}
@media (hover:hover) and (pointer:fine){
  .tb-link:hover span{border-bottom-color:var(--off)}
  .tb-link:hover .arr,.fy-link:hover .arr{transform:translateX(5px)}
}
.tb-link:focus-visible,.fy-link:focus-visible{outline:none}
.tb-link:focus-visible span{outline:2px solid var(--amber);outline-offset:6px;border-radius:var(--r-sm)}
@media (max-width:760px){
  .tb{height:48vh;min-height:380px}
  .tb-media{height:100%;transform:none}
  .tb-scrim{width:100%;background:linear-gradient(180deg,rgba(42,29,21,.5),rgba(42,29,21,.68))}
  .tb-text{max-width:none}
  .tb-line{font-size:clamp(26px,7.4vw,32px)}
}

/* ---------- Nila ---------- */
/* plaster tooth: a faint noise tile (128 px png, no runtime filter) on the stage walls so they read as a surface, not a fill */
.fy-wall::after,.nl-niche::before{content:"";position:absolute;inset:0;background-image:url("data:image/png;base64,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");background-size:128px 128px;pointer-events:none}
.nl-niche::before{z-index:0}
.nl-disc{z-index:0}

.nl{background:var(--cream);overflow:clip}
.nl-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.nl-stagecol{container-type:inline-size;display:flex;justify-content:center;padding-inline:3%}
/* the stage: an arched niche (the photo's straight sides become its walls) standing on a stone ledge */
.nl-stage{--w:min(520px,calc(100vw - 2*var(--gutter) - 12px));position:relative;width:var(--w);height:calc(var(--w)*1.27 + 26px);flex:none}
@supports (width:1cqw){.nl-stage{--w:min(520px,92cqw)}}
.nl-niche{position:absolute;left:0;top:0;width:var(--w);height:calc(var(--w)*1.27);border-radius:calc(var(--w)/2) calc(var(--w)/2) 0 0;overflow:hidden;background:var(--umber);box-shadow:inset 0 22px 34px -18px rgba(42,29,21,.55)}
/* the plaster disc behind the stones, concentric with the arch */
.nl-disc{position:absolute;left:50%;top:calc(var(--w)*.1);width:calc(var(--w)*.8);height:calc(var(--w)*.8);margin-left:calc(var(--w)*-.4);border-radius:50%;background:var(--plaster-2);transform-origin:50% 50%}
.nl-float{position:absolute;left:0;right:0;bottom:0;width:100%}
.nl-tilt{will-change:auto}
.nl-stone{display:block;width:100%;height:auto}
/* a stone shelf: lit top face, darker front, soft shadow on the paper below */
.nl-ledge{position:absolute;left:-5%;right:-5%;bottom:0;height:32px;border-radius:var(--r-sm);background:linear-gradient(rgba(251,247,238,.16) 0 9px,rgba(251,247,238,0) 9px),linear-gradient(180deg,var(--umber),var(--umber-2));box-shadow:inset 0 1px 0 rgba(251,247,238,.36),0 20px 24px -14px rgba(42,29,21,.5);transform-origin:50% 50%}

.nl-copy{min-width:0}
.nl-label{display:flex;align-items:center;gap:10px}
.nl-swatch{display:inline-block;width:10px;height:10px;background:var(--nila);border-radius:var(--r-sm);flex:none}
.nl-copy h2{margin:14px 0 clamp(22px,2.6vw,34px);max-width:13ch}
.nl-paras{display:grid;gap:18px}
.nl-paras p{font-size:18px;line-height:1.62;max-width:52ch}
.nl-paras strong{font-weight:700}
.nl-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:clamp(28px,3vw,40px)}
.nl-tile{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;align-items:center;padding:14px;border-radius:var(--r-lg);background:var(--plaster)}
.nl-mini{position:relative;width:104px;height:116px;border-radius:var(--r);overflow:hidden;background:var(--plaster-2)}
.nl-mini::after{content:"";position:absolute;z-index:2;left:0;right:0;bottom:0;height:20px;background:linear-gradient(180deg,var(--umber),var(--umber-2));box-shadow:inset 0 1px 0 rgba(251,247,238,.34)}
.nl-mini img{position:absolute;left:50%;bottom:11px;width:88px;height:auto;z-index:1;transform:translateX(calc(-50% + var(--dx,0%)));filter:drop-shadow(0 6px 6px rgba(42,29,21,.3))}
.nl-tile-body{min-width:0}
.nl-tile-name{font-weight:600;font-size:17px;line-height:1.25}
.nl-tile-sub{font-size:15px;color:var(--ink-2);margin-top:2px}
.nl-tile-price{font-family:var(--font-display);font-size:24px;font-weight:360;line-height:1.1;margin:8px 0 10px;font-variation-settings:"opsz" 144,"SOFT" 40}
.nl-add{min-height:44px;min-width:84px;padding:0 20px;font-size:16px;justify-content:center}
.nl-grade{margin-top:14px;font-size:14px;color:var(--ink-2)}
@media (max-width:1280px){
  .nl-grid{align-items:start}
}
@media (max-width:1100px){
  .nl-tiles{grid-template-columns:1fr}
}
@media (max-width:860px){
  .nl-grid{grid-template-columns:1fr;gap:36px}
  .nl-copy h2{max-width:none}
}
@media (max-width:520px){
  .nl-tile{grid-template-columns:96px minmax(0,1fr)}
  .nl-mini{width:96px;height:112px}
  .nl-mini img{width:80px}
}

/* ---------- Our story ---------- */
/* the header link lands here; app.js already offsets by 70 px, this covers hash loads and focus */
#story{scroll-margin-top:80px}
.st{background:var(--plaster)}
.st-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(36px,5.6vw,88px);align-items:center}
.st-photo{margin:0;min-width:0}
/* a 3:2 photograph card, soft shadow, no frame */
.st-card{position:relative;aspect-ratio:3/2;border-radius:8px;overflow:hidden;background:var(--umber-2);box-shadow:0 36px 60px -28px rgba(42,29,21,.5),0 10px 24px -10px rgba(42,29,21,.22)}
.st-card picture{position:absolute;inset:0;display:block}
.st-card img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:42% 50%}
/* live, tablet and up: the picture is 12 percent taller than its card so it can drift inside it (sections.js); the card clips it */
@media (min-width:761px){html.lx-live .st-card picture{top:-6%;bottom:-6%}}
.st-cap{margin-top:16px;color:var(--ink-2);text-wrap:balance}
.st-copy{min-width:0}
.st-head h2{margin:14px 0 clamp(22px,2.6vw,34px)}
.st-paras{display:grid;gap:20px;justify-items:start}
.st-paras p{font-size:18px;line-height:1.62;max-width:56ch}
/* the first paragraph with the Arabic word as a pull-out beside it */
.st-name{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(20px,2.4vw,32px);align-items:start}
.st-ar{display:grid;justify-items:center;gap:10px;width:118px;padding:18px 10px 14px;border-radius:8px;background:var(--terracotta-2);color:var(--off)}
.st-ar-word{font-family:var(--font-arabic);font-size:28px;line-height:1.35;font-weight:400}
.st-ar-tr{font-size:12px;letter-spacing:.11em;text-transform:uppercase;font-weight:600}
/* the promise, boxed in sage like the note under the questions */
.st-paras .st-promise{max-width:calc(56ch + 52px);padding:22px 26px;border-radius:8px;background:var(--sage);color:var(--ink);font-weight:500}
.st-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:4px;font-weight:600;font-size:17px;color:var(--ink)}
.st-link span{border-bottom:1.5px solid var(--terracotta);padding-bottom:2px}
.st-link:focus-visible{outline:none}
.st-link:focus-visible span{outline:2px solid var(--terracotta);outline-offset:6px;border-radius:var(--r-sm)}
@media (hover:hover) and (pointer:fine){.st-link:hover .arr{transform:translateX(5px)}}
@media (max-width:1240px){
  /* the pull-out drops under the paragraph as a strip (beside it the paragraph would be narrower than 36 characters) */
  .st-name{grid-template-columns:1fr;gap:16px}
  .st-ar{grid-auto-flow:column;justify-self:start;justify-content:start;align-items:center;gap:16px;width:auto;padding:10px 20px}
}
@media (max-width:860px){
  .st-grid{grid-template-columns:1fr;gap:34px}
  .st-paras .st-promise{padding:20px 20px}
}

/* ---------- Find your ritual ---------- */
/* cream, so the page alternates cream (Nila), plaster (story), cream (find) instead of running two plaster sections together */
.fy{background:var(--cream)}
.fy-head{max-width:720px;margin-bottom:clamp(32px,4.5vw,64px)}
.fy-head h2{margin:12px 0 14px}
.fy-sub{font-size:19px;color:var(--ink-2);max-width:40ch}
.fy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,26px)}
.fy-tile{--wall:var(--terracotta);--pl-a:var(--umber);--pl-b:var(--umber-2);--ph:262px;--light:.3;position:relative;display:flex;flex-direction:column;height:clamp(580px,47vw,690px);border-radius:8px;overflow:hidden;color:var(--off);background:var(--wall);isolation:isolate}
.fy-soften{--wall:var(--sage);--light:.34}
.fy-hammam{--wall:var(--umber);--pl-a:var(--terracotta-2);--pl-b:var(--terracotta-2);--light:.18}
/* the wall: plaster tone, a soft light from the top left, a darker edge on the right */
.fy-wall{position:relative;flex:1 1 auto;background:radial-gradient(120% 88% at 18% 0%,rgba(251,247,238,var(--light)),rgba(251,247,238,0) 62%),linear-gradient(90deg,rgba(42,29,21,0) 58%,rgba(42,29,21,.16)),var(--wall)}
/* the product stands on the plinth's top face; its contact shadow is an ellipse */
.fy-prod{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:center;z-index:2}
/* --cut is the fraction of the photo's height where the plinth edge crosses the product (measured from the alpha), so the base always sits behind the edge */
.fy-prod img{position:relative;z-index:1;display:block;width:var(--iw,auto);height:var(--h);max-width:none;transform:translate(var(--dx,0%),calc((1 - var(--cut,.93)) * 100%));transition:translate .5s var(--ease)}
.fy-shadow{position:absolute;z-index:0;left:50%;bottom:-14px;width:var(--sw);margin-left:calc(var(--sw)/-2);height:28px;border-radius:50%;background:rgba(42,29,21,.55);filter:blur(10px);transition:transform .5s var(--ease)}
.fy-plinth{z-index:3;flex:0 0 var(--ph);display:flex;flex-direction:column;padding:34px clamp(20px,2vw,28px) 18px;background:linear-gradient(rgba(251,247,238,.08) 0 18px,rgba(251,247,238,0) 18px),linear-gradient(180deg,var(--pl-a),var(--pl-b));box-shadow:inset 0 1px 0 rgba(251,247,238,.32)}
.fy-title{font-size:clamp(32px,3vw,40px);line-height:1.02;margin-bottom:10px;color:var(--off)}
.fy-line{font-size:16px;line-height:1.5;color:rgba(251,247,238,.88)}
.fy-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.fy-price{font-family:var(--font-display);font-size:24px;font-weight:360;font-variation-settings:"opsz" 144,"SOFT" 40;color:var(--off)}
.fy-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;font-size:16px;color:var(--off)}
.fy-link span{border-bottom:1.5px solid var(--amber);padding-bottom:2px}
/* the whole tile is the link */
.fy-link::after{content:"";position:absolute;inset:0;z-index:5}
.fy-link:focus-visible::after{outline:3px solid var(--amber);outline-offset:-8px;border-radius:8px}
@media (hover:hover) and (pointer:fine){
  .fy-tile:hover .fy-prod img{translate:0 -6px}
  .fy-tile:hover .fy-shadow{transform:scale(1.16,1.3)}
}
@media (max-width:1240px){
  .fy-tile{height:640px}
  .fy-prod img{height:calc(var(--h)*.9)}
}
@media (max-width:1000px){
  .fy-grid{grid-template-columns:1fr}
  .fy-tile{height:600px;--ph:256px}
  .fy-prod img{height:calc(var(--h)*.92)}
}
/* phones: the two-jar photo is cut straight at both sides, so it runs 14 px past each tile edge (the tile clips it) and stays inside the viewport */
@media (max-width:760px){
  .fy-hammam .fy-prod img{--iw:calc(100% + 28px)}
}

/* ---------- Ask the ritual guide ---------- */
.gd{background:var(--plaster)}
.gd-panel{max-width:960px;margin-inline:auto;background:var(--umber);color:var(--off);border-radius:var(--r-lg);padding:clamp(26px,4.6vw,56px);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,52px);align-items:start}
.gd-intro{align-self:stretch;display:flex;flex-direction:column;align-items:flex-start}
.gd-label{color:rgba(251,247,238,.78)}
.gd-mark{margin-top:auto;padding-top:28px;width:112px;height:auto;box-sizing:content-box}
.gd-intro h2{margin:14px 0 16px;font-size:clamp(34px,3.7vw,50px);color:var(--off)}
.gd-sub{font-size:17px;line-height:1.55;color:rgba(251,247,238,.86);max-width:30ch}
.gd-chat{min-width:0}
.gd-eg{font-size:12px;letter-spacing:.11em;text-transform:uppercase;font-weight:600;color:rgba(251,247,238,.7);margin-bottom:14px}
.gd-thread{display:grid;gap:10px}
.gd-bub{max-width:90%;padding:13px 18px;font-size:17px;line-height:1.5;border-radius:var(--r-lg)}
.gd-bub.you{justify-self:end;background:var(--plaster);color:var(--ink);border-bottom-right-radius:var(--r-sm)}
.gd-bub.bot{justify-self:start;background:rgba(251,247,238,.1);color:var(--off);border-bottom-left-radius:var(--r-sm)}
.gd-form{display:flex;gap:10px;margin-top:22px}
.gd-form input{flex:1 1 auto;min-width:0;min-height:52px;padding:0 18px;border:0;border-radius:var(--r);background:var(--off);color:var(--ink);font:inherit;font-size:17px}
.gd-form input::placeholder{color:var(--ink-2);opacity:1}
.gd-form input:focus-visible,.gd-send:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
.gd-send{flex:none;width:52px;padding:0;justify-content:center}
.gd-sent{min-height:22px;margin-top:12px;font-size:15px;color:rgba(251,247,238,.9)}
.gd-wa{text-align:center;margin-top:20px;font-size:15px;color:var(--ink-2)}
@media (max-width:760px){
  .gd-panel{grid-template-columns:1fr;padding:24px 16px 22px}
  .gd-sub{max-width:none}
  .gd-bub{max-width:94%}
  .gd-mark{display:none}
  .gd-form input{padding:0 14px;font-size:16px}
  .gd-send{width:48px}
}

/* ---------- Good to know ---------- */
.fq{background:var(--plaster-2)}
.fq-head h2{margin-top:12px}
.fq-list{margin-top:clamp(28px,4vw,52px);border-top:1px solid rgba(42,29,21,.2)}
.fq-row{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(14px,4vw,72px);padding-block:clamp(22px,2.8vw,36px);border-bottom:1px solid rgba(42,29,21,.2)}
.fq-q{font-size:clamp(22px,2.1vw,26px);line-height:1.2;letter-spacing:-.01em;max-width:20ch}
.fq-a{font-size:17px;line-height:1.65;max-width:58ch}
.fq-foot{display:inline-block;margin-top:clamp(24px,3vw,36px);padding:16px 22px;border-radius:8px;background:var(--sage);color:var(--ink);font-weight:600;font-size:17px}
@media (max-width:760px){
  .fq-row{grid-template-columns:1fr;gap:8px}
  .fq-q{max-width:none}
}

/* ---------- motion states (live only; the static page needs none of this) ---------- */
html.lx-live .fq-row.reveal::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--ink-3);transform:scaleX(0);transform-origin:0 50%}
html.lx-live .fq-row.reveal.in::after{transform:scaleX(1);transition:transform .9s var(--ease) .1s}
@media (prefers-reduced-motion:reduce){html.lx-live .fq-row.reveal::after{display:none}}

/* 14 Oct: the Nila arch shows his Higgsfield photograph of the powder and the stone.
   V3: the photo overscans the arch by 8 percent on every side (idle float is 6 px, the tilt moves an edge under 5 px), so no width from 390 to 1920 can show the umber behind it. */
.nl-float{top:0;bottom:0;height:100%}
.nl-tilt{position:relative;height:100%}
.nl-photo{position:absolute;left:-8%;top:-8%;width:116%;height:116%;max-width:none;margin:0;object-fit:cover;object-position:52% 60%;display:block}
.nl-disc{opacity:0}
