/*
Theme Name: Adeeb Al-Ani
Theme URI: https://adeebalani.com
Author: Adeeb Al-Ani website team
Description: Portfolio theme for photographer Adeeb Shaban Al-Ani. Arabic and English (Polylang), photo series, lightbox gallery and bilingual captions.
Version: 0.1.8
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: adeeb
*/

:root{
  --ink:#060606; --ivory:#EFE7D6; --gold:#C9A24A;
  --paper:#EFE7D6; --paper-fg:#1B1814; --paper-muted:#5F584B; --paper-line:rgba(27,24,20,.22);
  --stone:#B9A690; --stone-fg:#1B1814;
  --display:"Amiri","Traditional Arabic",serif; --ds:1; --dw:700;
  --body:"IBM Plex Sans Arabic","Noto Sans Arabic",Tahoma,sans-serif;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){--paper:#15161A; --paper-fg:#EFE7D6; --paper-muted:#A9A597; --paper-line:rgba(239,231,214,.2); --stone:#26221E; --stone-fg:#EFE7D6;}
}
:root[data-theme="dark"]{--paper:#15161A; --paper-fg:#EFE7D6; --paper-muted:#A9A597; --paper-line:rgba(239,231,214,.2); --stone:#26221E; --stone-fg:#EFE7D6;}
html{background:var(--ink);scroll-padding-top:calc(4.5rem + env(safe-area-inset-top,0px));height:100%}
html[lang^="en"]{--display:"Instrument Serif",Georgia,serif;--ds:1;--dw:400}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--paper);color:var(--paper-fg);font-family:var(--body);font-weight:300;font-size:1.08rem;line-height:1.95;min-height:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.skip{position:absolute;inset-inline-start:8px;top:-60px;background:var(--ivory);color:var(--ink);padding:.4rem .9rem;z-index:80}
.skip:focus{top:8px}

/* header */
header.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--ink);color:var(--ivory);
  display:flex;align-items:center;gap:1.6rem;padding:.55rem clamp(1rem,4vw,3rem);border-bottom:1px solid rgba(239,231,214,.14)}
.brand{font-family:var(--display);font-weight:var(--dw);font-size:calc(1.35rem*var(--ds));line-height:1.5;text-decoration:none;white-space:nowrap}
nav.main{display:flex;gap:1.5rem;margin-inline-start:auto;font-weight:400;font-size:.98rem}
nav.main a{text-decoration:none;padding:.25rem 0;border-bottom:2px solid transparent}
nav.main a:hover{border-bottom-color:var(--gold)}
.pill{font:inherit;font-weight:400;font-size:.9rem;background:none;color:inherit;border:1px solid rgba(239,231,214,.4);padding:.15rem .9rem;border-radius:999px;cursor:pointer}
.pill:hover{border-color:var(--gold)}

/* hero: portrait on the left, name on the right, in front of his gaze */
.hero{position:relative;direction:ltr;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,38%);min-height:min(90svh,840px);background:var(--ink);color:var(--ivory);overflow:hidden}
.hero-lines{display:none}
.hero-lines path{fill:none;stroke:var(--gold);stroke-width:1;opacity:.13}
.hero-copy{position:relative;z-index:2;grid-column:2;grid-row:1;direction:rtl;align-self:center;padding:clamp(2rem,6vw,5rem) clamp(1.2rem,4vw,4rem)}
html[lang^="en"] .hero-copy{direction:ltr}
.hero h1{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(2rem,4.2vw,3.5rem)*var(--ds));line-height:1.4;margin:0}
html[lang^="en"] .hero h1{font-size:clamp(2.2rem,4.6vw,3.8rem);line-height:1.1}
.role{margin:.3rem 0 0;color:var(--gold);font-weight:400;font-size:1.1rem}
.tag{margin:1.4rem 0 1.8rem;max-width:26rem;font-size:1.15rem;color:#D8D0BE}
.cta{display:inline-block;font-weight:500;text-decoration:none;background:var(--gold);color:#14110A;padding:.6rem 1.7rem;border-radius:2px}
.cta:hover{background:#DDB55A}
.text-link{font-weight:500;text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:2px}
.hero .text-link{margin-inline-start:1.4rem}
.hero-photo{position:absolute;inset:0;z-index:0}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 50%;display:block}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(to left,rgba(6,6,6,.92) 0,rgba(6,6,6,.82) 24%,rgba(6,6,6,.5) 40%,rgba(6,6,6,.12) 56%,rgba(6,6,6,0) 66%)}

/* sections */
section{padding:clamp(3rem,8vw,6.5rem) clamp(1rem,6vw,5rem)}
h2{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(1.8rem,3.8vw,3rem)*var(--ds));line-height:1.45;margin:0 0 .5rem}
.lead{color:var(--paper-muted);max-width:34rem;margin:0 0 3rem}

.work{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:center;margin-bottom:clamp(2.5rem,6vw,5rem)}
.work:last-child{margin-bottom:0}
.work:nth-of-type(even) .art{order:2}
.art{position:relative;aspect-ratio:16/10;overflow:hidden;display:block;border-radius:2px}
.art svg{position:absolute;inset:0;width:100%;height:100%;transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
.art:hover svg,.art:focus-visible svg{transform:scale(1.05)}
.work h3{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(1.8rem,3.4vw,2.6rem)*var(--ds));line-height:1.4;margin:0}
.work .light{color:var(--paper-muted);margin:.1rem 0 .8rem;font-weight:400}
.work p{margin:0 0 1rem;max-width:26rem}
.ripple path{fill:none;stroke:#6E4526;stroke-width:1.1;opacity:.55}

.union{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr);gap:clamp(1.5rem,6vw,6rem);align-items:center;background:var(--stone);color:var(--stone-fg)}
.union .portrait{aspect-ratio:4/5;overflow:hidden;border-radius:2px;max-width:26rem;width:100%}
.union .portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.union p{max-width:30rem}
.union .text-link{border-bottom-color:currentColor}

.rows{border-top:1px solid var(--paper-line);max-width:62rem}
.row{display:grid;grid-template-columns:8rem 1fr auto;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--paper-line);align-items:baseline}
.row b{font-family:var(--display);font-weight:var(--dw);font-size:calc(1.4rem*var(--ds))}
.row span:last-child{color:var(--paper-muted)}

.duo{display:grid;grid-template-columns:1fr 1fr;padding:0;border-top:1px solid var(--paper-line)}
.duo>div{padding:clamp(2.5rem,6vw,4.5rem) clamp(1rem,6vw,5rem)}
.duo>div+div{border-inline-start:1px solid var(--paper-line)}
.duo h2{font-size:calc(clamp(1.7rem,3.4vw,2.4rem)*var(--ds))}
.duo .text-link{color:inherit}

footer{background:var(--ink);color:var(--ivory);padding:clamp(2.5rem,6vw,4.5rem) clamp(1rem,6vw,5rem) calc(5.5rem + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:1fr 1fr;gap:2rem}
footer h2{font-size:calc(clamp(1.6rem,3vw,2.2rem)*var(--ds))}
footer p{margin:.2rem 0;color:#BDB6A5}
.sub{display:flex;gap:.5rem;flex-wrap:wrap}
.sub input{flex:1 1 12rem;font:inherit;padding:.6rem 1rem;border:1px solid #4A463C;background:transparent;color:var(--ivory);border-radius:2px}
.sub button{font:inherit;font-weight:500;background:var(--gold);color:#14110A;border:0;padding:.6rem 1.5rem;border-radius:2px;cursor:pointer}
.note{grid-column:1/-1;font-size:.95rem;color:#8C8677;border-top:1px solid #26231D;padding-top:1rem;margin-top:.5rem}

/* font picker */

@media (max-width:900px){
  header.bar{flex-wrap:wrap;gap:.3rem 1rem}
  nav.main{order:3;width:100%;margin:0;overflow-x:auto;white-space:nowrap;gap:1.3rem;padding-bottom:.2rem}
  .brand{margin-inline-end:auto}
  .hero{grid-template-columns:1fr;min-height:0}
  .hero-photo{position:relative;inset:auto;grid-row:1;height:62svh;min-height:380px}
  .hero-photo::after{background:linear-gradient(to top,var(--ink) 0,transparent 38%)}
  .hero-copy{grid-column:1;grid-row:2}
  .hero-photo img{object-position:31% 50%}
  .hero-copy{margin-top:-4rem}
  .work{grid-template-columns:1fr}
  .work:nth-of-type(even) .art{order:0}
  .union,.duo,footer{grid-template-columns:1fr}
  .duo>div+div{border-inline-start:0;border-top:1px solid var(--paper-line)}
  .row{grid-template-columns:1fr;gap:.1rem}
}

/* life in the desert */
.life{background:var(--ink);color:var(--ivory)}
.life .lead{color:#BDB6A5}
.life h2{display:inline-block;border-bottom:2px solid var(--gold);padding-bottom:.1rem}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.8rem,2vw,1.6rem);align-items:start}
.tile{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;color:#F6EEDD;text-decoration:none;border-radius:2px}
.tile:nth-child(2){margin-top:clamp(0rem,4vw,3.2rem)}
.tile svg{position:absolute;inset:0;width:100%;height:100%;transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
.tile:hover svg,.tile:focus-visible svg{transform:scale(1.05)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,6,6,.72),transparent 55%)}
.tile .cap{position:absolute;z-index:2;inset-inline:0;bottom:0;padding:1.3rem 1.4rem}
.tile h3{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(1.7rem,3vw,2.4rem)*var(--ds));line-height:1.35;margin:0}
.tile p{margin:0;font-size:1rem;line-height:1.7;color:#EADFC9}
/* film */
.reel{position:relative;display:block;aspect-ratio:16/9;max-width:62rem;overflow:hidden;border-radius:2px;color:#F6EEDD;text-decoration:none;background:linear-gradient(180deg,#1F2455 0%,#4A2F63 45%,#B8687A 80%,#F0B27A 100%)}
.reel .play{position:absolute;top:50%;left:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;border:2px solid #F6EEDD;transition:background .3s}
.reel .play::after{content:"";position:absolute;top:50%;left:50%;margin:-14px 0 0 -9px;border-style:solid;border-width:14px 0 14px 24px;border-color:transparent transparent transparent #F6EEDD}
.reel:hover .play{background:rgba(246,238,221,.18)}
.reel .vcap{position:absolute;inset-inline:0;bottom:0;padding:1.2rem 1.5rem;background:linear-gradient(to top,rgba(6,6,6,.6),transparent);font-family:var(--display);font-weight:var(--dw);font-size:calc(1.6rem*var(--ds))}
.duo{grid-template-columns:1fr}
nav.main{gap:1.25rem;font-size:.95rem}
@media (max-width:900px){
  .tiles{grid-template-columns:1fr}
  .tile,.tile:nth-child(2){aspect-ratio:4/5;margin-top:0}
}

/* photo collage and series */
.series-head{display:flex;align-items:baseline;gap:1rem;margin:0 0 1rem}
.series-head h3{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(1.6rem,3vw,2.2rem)*var(--ds));line-height:1.4;margin:0}
.series-head span{color:var(--paper-muted)}
.collage{display:grid;grid-template-columns:1.1fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:clamp(.5rem,1.2vw,1rem);height:clamp(420px,62vw,720px)}
.ph{position:relative;display:block;padding:0;border:0;overflow:hidden;border-radius:2px;cursor:zoom-in;background:#2a2622;min-width:0;min-height:0}
.ph img,.tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.ph:hover img,.ph:focus-visible img,.tile:hover img,.tile:focus-visible img{transform:scale(1.045)}
.c1{grid-column:1;grid-row:1/3}.c2{grid-column:2/4;grid-row:1}.c3{grid-column:2;grid-row:2}.c4{grid-column:3;grid-row:2}
.c1 img{object-position:50% 50%}.c2 img{object-position:50% 62%}.c3 img{object-position:40% 55%}.c4 img{object-position:40% 45%}
button.tile{border:0;padding:0;font:inherit;text-align:start;cursor:pointer;width:100%;background:#2a2622;display:block}
.tile img{position:absolute;inset:0}
.tile .cap{position:absolute;z-index:2;inset-inline:0;bottom:0;padding:1.3rem 1.4rem;display:block}
.tile .tn{display:block;font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(1.7rem,3vw,2.4rem)*var(--ds));line-height:1.35}
.tile .tc{display:block;font-size:1rem;line-height:1.7;color:#EADFC9}
.reel .rimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s}
.reel:hover .rimg{transform:scale(1.03)}
.reel::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(6,6,6,.32)}
.reel .play,.reel .vcap{z-index:2}

/* lightbox */
.lb{position:fixed;inset:0;z-index:70;background:rgba(6,6,6,.99);color:#EFE7D6;display:flex;align-items:center;justify-content:center;padding:calc(3.5rem + env(safe-area-inset-top,0px)) 4.5rem calc(2rem + env(safe-area-inset-bottom,0px))}
.lb[hidden]{display:none}
.lb figure{margin:0;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:center;gap:.7rem}
.lb img{max-width:100%;max-height:calc(100svh - 9rem);object-fit:contain;display:block}
.lb figcaption{font-weight:400;font-size:.98rem;color:#C9C3B2}
.lb-x{position:absolute;top:calc(.8rem + env(safe-area-inset-top,0px));inset-inline-end:1rem;font:inherit;font-weight:400;font-size:.95rem;background:none;color:inherit;border:1px solid rgba(239,231,214,.45);border-radius:999px;padding:.2rem 1rem;cursor:pointer}
.lb-nav{position:absolute;top:50%;margin-top:-1.6rem;width:3.2rem;height:3.2rem;border-radius:50%;border:1px solid rgba(239,231,214,.4);background:rgba(6,6,6,.5);color:inherit;font-size:1.8rem;line-height:1;cursor:pointer}
.lb-nav:hover{border-color:var(--gold)}
.lb-nav.prev{inset-inline-start:.8rem}.lb-nav.next{inset-inline-end:.8rem}
html[dir="rtl"] .lb-nav.prev::before{content:"\203A"}
html[dir="rtl"] .lb-nav.next::before{content:"\2039"}
html[dir="ltr"] .lb-nav.prev::before{content:"\2039"}
html[dir="ltr"] .lb-nav.next::before{content:"\203A"}
.lb.single .lb-nav{display:none}
@media (max-width:900px){
  .collage{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:auto}
  .c1{grid-column:1/3;grid-row:auto;aspect-ratio:4/5}
  .c2{grid-column:1/3;grid-row:auto;aspect-ratio:2/1}
  .c3,.c4{grid-column:auto;grid-row:auto;aspect-ratio:1/1}
  .lb{padding-inline:.8rem}
  .lb-nav{top:auto;bottom:calc(.8rem + env(safe-area-inset-bottom,0px));margin-top:0}
}

/* lightbox with caption area */
.lb{align-items:stretch;overflow-y:auto;overscroll-behavior:contain}
.lb figure{margin:auto;width:min(100%,60rem)}
.lb img{max-height:62svh}
.lb-x,.lb-nav{position:fixed}
.lb-edit{inset-inline-end:auto;inset-inline-start:1rem}
.lb-cap{width:min(100%,46rem);text-align:start}
.lb-count{font-size:.9rem;color:#9E9886;margin-bottom:.3rem}
.lb-title{font-family:var(--display);font-weight:var(--dw);font-size:calc(1.7rem*var(--ds));line-height:1.45;margin:0 0 .4rem;color:#F6EEDD}
.lb-story{margin:0 0 1rem;font-size:1.08rem;line-height:1.95;color:#D8D0BE;white-space:pre-wrap}
.lb-meta{display:flex;flex-wrap:wrap;gap:.4rem 2.2rem;margin:0;padding-top:.8rem;border-top:1px solid rgba(239,231,214,.2)}
.lb-meta div{display:flex;gap:.6rem;align-items:baseline}
.lb-meta dt{color:var(--gold);font-weight:500;font-size:.95rem}
.lb-meta dd{margin:0;color:#EFE7D6}
.lb.editing [contenteditable="true"]{outline:1px dashed var(--gold);outline-offset:5px;border-radius:2px;min-width:6rem;min-height:1.4em}
.lb [contenteditable="true"]:empty::before{content:attr(data-ph);color:#8C8677}
.lb.editing .lb-edit{background:var(--gold);color:#14110A;border-color:var(--gold)}
@media (max-width:900px){
  .lb{padding-bottom:calc(5.5rem + env(safe-area-inset-bottom,0px))}
}

/* featured photograph */
.featured{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:center;background:var(--stone);color:var(--stone-fg)}
.feat-img{aspect-ratio:3/2;width:100%}
.feat-img img{object-position:35% 50%}
.feat-txt p{max-width:26rem;margin:0 0 1.2rem}
button.text-link{background:none;border:0;border-bottom:2px solid currentColor;padding:0 0 2px;font:inherit;font-weight:500;color:inherit;cursor:pointer}
@media (max-width:900px){.featured{grid-template-columns:1fr}}

/* social links */
.social{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}
.social .slabel{font-weight:400;margin-inline-end:.4rem;opacity:.85}
.social a{display:inline-flex;align-items:center;justify-content:center;width:2.7rem;height:2.7rem;border:1px solid currentColor;border-radius:50%;color:inherit;transition:background .25s,color .25s,border-color .25s}
.social a:hover,.social a:focus-visible{background:var(--gold);border-color:var(--gold);color:#14110A}
.social svg{width:1.2rem;height:1.2rem}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* series pages */
.sh-link{margin-inline-start:auto;font-size:1rem}
.s-hero{position:relative;min-height:min(54svh,540px);display:flex;align-items:flex-end;color:#F6EEDD;background:var(--ink);overflow:hidden}
.s-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,6,6,.88) 0,rgba(6,6,6,.4) 55%,rgba(6,6,6,.12) 100%)}
.s-hero .in{position:relative;z-index:2;padding:clamp(2rem,5vw,4rem) clamp(1rem,6vw,5rem)}
.s-hero .back{display:inline-block;margin-bottom:1rem;color:#E8DFCB;text-decoration:none;border-bottom:1px solid rgba(232,223,203,.5);font-weight:400}
.s-hero .back:hover{border-bottom-color:var(--gold)}
.s-hero h1{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(2.4rem,6vw,4.6rem)*var(--ds));line-height:1.3;margin:0}
html[lang^="en"] .s-hero h1{line-height:1.1}
.s-hero p{max-width:36rem;margin:.6rem 0 0;color:#E4DBC8}
.s-hero p.cnt{color:var(--gold);font-weight:500}
.s-gal{padding:clamp(2.5rem,6vw,4.5rem) clamp(1rem,6vw,5rem)}
.s-grid{columns:3 17rem;column-gap:clamp(.6rem,1.4vw,1.1rem)}
.s-grid .ph{display:block;width:100%;margin:0 0 clamp(.6rem,1.4vw,1.1rem);break-inside:avoid}
.s-grid .ph img{height:auto}
.s-other{padding:0 clamp(1rem,6vw,5rem) clamp(3rem,8vw,6rem)}
.s-other h2{font-size:calc(clamp(1.5rem,3vw,2.2rem)*var(--ds));margin-bottom:1rem}
.s-orow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.6rem,1.4vw,1.1rem)}
.oc{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:2px;color:#F6EEDD;text-decoration:none;background:#2a2622}
.oc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.oc:hover img,.oc:focus-visible img{transform:scale(1.05)}
.oc::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,6,6,.72),transparent 60%)}
.oc span{position:absolute;z-index:2;inset-inline:0;bottom:0;padding:1rem 1.2rem;font-family:var(--display);font-weight:var(--dw);font-size:calc(1.5rem*var(--ds))}
@media (max-width:900px){.s-orow{grid-template-columns:1fr}.s-grid{columns:2 10rem}}
/* copyright */
.lb-copy{margin-top:.7rem;font-size:.85rem;color:#8C8677}
html[dir="rtl"] .lb-copy{text-align:right}html[dir="ltr"] .lb-copy{text-align:left}
.copy{grid-column:1/-1;margin:0;font-size:.9rem;color:#8C8677;direction:ltr}
html[dir="rtl"] .copy{text-align:right}html[dir="ltr"] .copy{text-align:left}

/* mobile slide-in menu */
.menu-btn,.nav-x{display:none}
@media (max-width:900px){
  header.bar{flex-wrap:nowrap;gap:.6rem}
  .brand{margin-inline-end:auto}
  .menu-btn{display:inline-block}
  nav.main{order:0;position:fixed;top:0;bottom:0;inset-inline-start:0;width:min(86vw,22rem);margin:0;flex-direction:column;gap:0;overflow-y:auto;white-space:normal;
    background:var(--ink);color:var(--ivory);padding:calc(4.2rem + env(safe-area-inset-top,0px)) 1.4rem calc(2rem + env(safe-area-inset-bottom,0px));
    transform:translateX(105%);visibility:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),visibility 0s .35s;z-index:2;border-inline-end:1px solid rgba(239,231,214,.14)}
  html[dir="ltr"] nav.main{transform:translateX(-105%)}
  nav.main.open{transform:none;visibility:visible;transition:transform .35s cubic-bezier(.2,.7,.2,1),visibility 0s}
  nav.main a{font-family:var(--display);font-weight:var(--dw);font-size:calc(1.7rem*var(--ds));line-height:1.5;padding:.55rem 0;border-bottom:1px solid rgba(239,231,214,.14)}
  nav.main a:hover,nav.main a:focus-visible{color:var(--gold);border-bottom-color:rgba(239,231,214,.14)}
  .nav-x{display:inline-block;position:absolute;top:calc(.7rem + env(safe-area-inset-top,0px));inset-inline-end:1rem;font:inherit;font-weight:400;font-size:.9rem;background:none;color:inherit;border:1px solid rgba(239,231,214,.4);border-radius:999px;padding:.15rem .9rem;cursor:pointer}
  .scrim{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:1}
  .scrim[hidden]{display:none}
  body.menu-open{overflow:hidden}
  body.menu-open .fontbar{display:none}
}
@media (prefers-reduced-motion:reduce){nav.main,nav.main.open{transition:none}}

/* inner pages */
section.pg{padding:0}
.pg-hero{background:var(--ink);color:var(--ivory);padding:clamp(3rem,8vw,6rem) clamp(1rem,6vw,5rem) clamp(2.5rem,6vw,4rem)}
.pg-hero .back{display:inline-block;margin-bottom:1rem;color:#E8DFCB;text-decoration:none;border-bottom:1px solid rgba(232,223,203,.5);font-weight:400}
.pg-hero .back:hover{border-bottom-color:var(--gold)}
.pg-hero h1{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(2.4rem,6vw,4.4rem)*var(--ds));line-height:1.3;margin:0}
html[lang^="en"] .pg-hero h1{line-height:1.1}
.pg-hero p{max-width:38rem;margin:.6rem 0 0;color:#D8D0BE}
.pg-body{padding:clamp(2.5rem,6vw,4.5rem) clamp(1rem,6vw,5rem)}
.pg-body h2{font-size:calc(clamp(1.5rem,3vw,2.1rem)*var(--ds));margin:2.6rem 0 1rem}
.pg-body h2:first-child{margin-top:0}
.contact-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.cform{display:grid;gap:1.1rem;max-width:40rem}
.cform label{display:grid;gap:.3rem;font-weight:400}
.cform input,.cform select,.cform textarea{font:inherit;color:inherit;background:transparent;border:1px solid var(--paper-line);border-radius:2px;padding:.7rem 1rem;width:100%}
.cform select option{color:#1B1814}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
.send{justify-self:start;font:inherit;font-weight:500;background:var(--gold);color:#14110A;border:0;padding:.7rem 2rem;border-radius:2px;cursor:pointer}
.send:hover{background:#DDB55A}
.fok{margin:0;padding:.8rem 1rem;border:1px solid var(--gold);border-radius:2px}
.fok[hidden]{display:none}
.cinfo dl{margin:0}
.cinfo dl div{display:flex;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--paper-line)}
.cinfo dt{min-width:5rem;color:var(--paper-muted)}
.cinfo dd{margin:0}
.cinfo h2{margin-top:0}
.wrows .row{grid-template-columns:8rem 1fr 1fr auto}
.wcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,3vw,2.5rem)}
.wcards>div{border-top:2px solid var(--gold);padding-top:1rem}
.wcards h3{font-family:var(--display);font-weight:var(--dw);font-size:calc(1.5rem*var(--ds));line-height:1.4;margin:0 0 .3rem}
.wcards p{margin:0;color:var(--paper-muted)}
.reel.big{max-width:none;cursor:default}
.vgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.8rem,2vw,1.6rem);margin-top:clamp(1.2rem,3vw,2rem)}
.vcard{display:grid;gap:.2rem}
.vp{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:2px;background:#2a2622}
.vp img{width:100%;height:100%;object-fit:cover;display:block}
.vp::after{content:"";position:absolute;inset:0;background:rgba(6,6,6,.3)}
.play.sm{width:52px;height:52px;margin:-26px 0 0 -26px;z-index:2}
.play.sm::after{margin:-9px 0 0 -6px;border-width:9px 0 9px 15px}
.vcard b{font-family:var(--display);font-weight:var(--dw);font-size:calc(1.2rem*var(--ds));line-height:1.5;margin-top:.5rem}
.vcard>span{color:var(--paper-muted);font-size:.95rem}
@media (max-width:900px){
  .contact-grid,.wcards,.vgrid{grid-template-columns:1fr}
  .wrows .row{grid-template-columns:1fr}
}

/* very small phones */
@media (max-width:380px){
  header.bar{padding-inline:.7rem;gap:.35rem}
  .brand{font-size:calc(1.05rem*var(--ds));min-width:0;overflow:hidden;text-overflow:ellipsis}
  .pill{padding:.15rem .6rem;font-size:.85rem}
  section,.pg-hero,.pg-body,.s-gal,.s-other{padding-inline:1rem}
}

/* series heading row on phones */
@media (max-width:640px){
  .series-head{flex-wrap:wrap;row-gap:.2rem}
  .series-head h3{flex:1 1 auto;white-space:nowrap}
  .series-head span{white-space:nowrap}
  .sh-link{margin-inline-start:0;flex-basis:100%;text-align:start;white-space:nowrap;width:max-content}
}

/* four life tiles and flexible other-series row */
.tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
.tile:nth-child(2){margin-top:0}
.tile:nth-child(even){margin-top:clamp(0rem,3.5vw,3rem)}
.tile .tn{font-size:calc(clamp(1.4rem,2.2vw,2rem)*var(--ds))}
.s-orow{grid-template-columns:repeat(auto-fit,minmax(14rem,1fr))}
@media (max-width:900px){
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tile,.tile:nth-child(2),.tile:nth-child(even){aspect-ratio:3/4;margin-top:0}
  .tile .tn{font-size:calc(1.3rem*var(--ds))}
  .tile .cap{padding:1rem}
}

/* photo titles on series pages */
.s-grid .ph{text-align:start}
.ptitle{position:absolute;inset-inline:0;bottom:0;padding:1.6rem 1rem .8rem;background:linear-gradient(to top,rgba(6,6,6,.75),transparent);color:#F6EEDD;font-family:var(--display);font-weight:var(--dw);font-size:calc(1.15rem*var(--ds));line-height:1.5;opacity:0;transition:opacity .3s;pointer-events:none}
.ph:hover .ptitle,.ph:focus-visible .ptitle{opacity:1}
@media (hover:none){.ptitle{opacity:1}}

/* longer literary intros */
.lead{max-width:42rem}
.feat-txt p{max-width:30rem}

.s-hero p{max-width:46rem}

/* email link and small notes */
.mail{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;unicode-bidi:isolate}
.mail:hover,.mail:focus-visible{color:var(--gold)}
.glead{margin:-.5rem 0 1rem;color:var(--paper-muted)}
.gnote{margin:1.2rem 0 0;color:var(--paper-muted);font-size:.95rem}

/* ================= WordPress additions ================= */
a.ph,a.tile,a.oc{color:inherit;text-decoration:none}
a.pill{text-decoration:none;display:inline-block}
.lb [hidden]{display:none !important}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fok.err{border-color:#B3472D}
.reel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s}
.reel:hover img{transform:scale(1.03)}
footer{padding-bottom:calc(2.5rem + env(safe-area-inset-bottom,0px))}
.feat-img img{width:100%;height:100%;object-fit:cover;display:block}

/* page content written in the editor */
.entry-content{max-width:46rem}
.entry-content>*:first-child{margin-top:0}
.entry-content h2{font-family:var(--display);font-weight:var(--dw);font-size:calc(clamp(1.5rem,3vw,2.1rem)*var(--ds));line-height:1.45;margin:2.4rem 0 .6rem}
.entry-content h3{font-family:var(--display);font-weight:var(--dw);font-size:calc(1.35rem*var(--ds));line-height:1.45;margin:1.8rem 0 .4rem}
.entry-content p{margin:0 0 1rem}
.entry-content ul{list-style:none;margin:0 0 1.4rem;padding:0;border-top:1px solid var(--paper-line)}
.entry-content ul li{padding:.9rem 0;border-bottom:1px solid var(--paper-line)}
.entry-content a{border-bottom:1px solid var(--gold)}
.entry-content figure,.entry-content img{max-width:100%;height:auto}
.entry-content iframe,.entry-content video,.entry-content .wp-block-embed__wrapper iframe{width:100%;max-width:100%;aspect-ratio:16/9;height:auto;border:0}

.about-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr);gap:clamp(1.5rem,6vw,6rem);align-items:start}
.about-grid .portrait{aspect-ratio:4/5;overflow:hidden;border-radius:2px;max-width:26rem;width:100%}
.about-grid .portrait img{width:100%;height:100%;object-fit:cover;display:block}

.photo-single .ps-fig{margin:0 0 1.6rem}
.photo-single .ps-fig img{display:block;width:100%;max-width:70rem;height:auto;border-radius:2px}
.ps-cap{max-width:46rem}
.ps-cap .lb-story{color:var(--paper-fg)}
.ps-cap .lb-meta{border-top-color:var(--paper-line)}
.ps-cap .lb-meta dd{color:var(--paper-fg)}
.ps-cap .lb-meta dt{color:var(--paper-muted)}
.ps-cap .lb-copy{color:var(--paper-muted)}
.ps-nav{display:flex;gap:1.6rem;margin-top:1.4rem}
@media (max-width:900px){.about-grid{grid-template-columns:1fr}}