/* XXploration · section 1, laid out like a magazine spread (after the Pharrell "Black Yacht Rock" page): a pink sheet, a heavy grotesque
   headline running across the top and wrapping down the left of a portrait, a small italic caption, and a justified italic column on the right. */
.xi{position:relative;min-height:100vh;min-height:100svh;box-sizing:border-box;background:#ee8ae3;color:#2a1f2a;overflow:hidden;
  padding:calc(var(--hh,53px) + clamp(12px,2.2vh,24px)) clamp(16px,2.2vw,32px) clamp(18px,3vh,30px);display:flex;flex-direction:column}
.xi::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.08;background-image:var(--grain);background-size:180px}
.xi-hd,.xi-l{margin:0;font:700 clamp(26px,3.25vw,54px)/.96 'Arimo','Helvetica Neue',Helvetica,Arial,sans-serif;letter-spacing:-.035em;text-transform:none;color:#2a1f2a}
.xi-hd{text-align:center;text-wrap:balance}
.xi-grid{flex:1;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(14px,2vw,32px);margin-top:clamp(4px,.6vw,10px);min-height:0}
.xi-l{display:block}
.xi-col{display:flex;flex-direction:column;min-height:0}
.xi-ph{margin:0;align-self:stretch;position:relative;min-height:0}
.xi-ph img{display:block;width:100%;height:100%;max-height:calc(100svh - var(--hh,53px) - 190px);object-fit:cover;object-position:50% 20%}
.xi-it{font:italic 400 clamp(11px,.92vw,14px)/1.22 Georgia,'Times New Roman',Times,serif;letter-spacing:0;color:#2a1f2a}
.xi-cap{margin:auto auto 0 0;max-width:15em;text-align:left;padding-bottom:clamp(30px,8vh,90px)}
.xi-cap p{margin:0 0 2.2em}
.xi-r{justify-content:space-between;padding-top:clamp(20px,9vh,120px);max-width:30em;justify-self:end}
.xi-r p{margin:0}
.xi-r .xi-lab{margin-bottom:1.8em}
.xi-r .xi-body{text-align:justify;hyphens:auto;-webkit-hyphens:auto}
.xi a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.xi a:hover{border-bottom-color:currentColor}
.xi>*,.xi-grid>*{opacity:0;transform:translateY(10px);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
.xi.in>*,.xi.in .xi-grid>*{opacity:1;transform:none}
.xi.in .xi-ph{transition-delay:.12s}.xi.in .xi-l{transition-delay:.18s}.xi.in .xi-r{transition-delay:.26s}
@media (max-width:760px){
  .xi-hd{text-align:left}
  .xi-grid{grid-template-columns:1fr 1fr;grid-template-areas:"l l" "cap r"}
  .xi-col.xi-left{display:contents}
  .xi-l{grid-area:l}.xi-ph{grid-area:ph}.xi-cap{grid-area:cap;margin:0;text-align:left;padding:0}.xi-r{grid-area:r;padding-top:0}
  .xi-ph img{max-height:none;aspect-ratio:4/5}
}
@media (prefers-reduced-motion:reduce){.xi>*,.xi-grid>*{transition:none;opacity:1;transform:none}}
.xi-mk{display:block;width:clamp(56px,6vw,84px);height:auto;margin-top:1.6em;opacity:.92}
