/* Final punch list (Oct 11, 2026): the phone's first screen, seven occasion cards, chapters without
   photographs, the founder, places and artists in the proof band, the portfolio's readability. */

/* every occasion card is in the page; until the tab script runs, only the first shows. A card that is
   not chosen leaves the layout entirely, so its photograph waits for its tab instead of competing
   with the first screen (it was stacked invisibly before, and its lazy image still loaded). */
.occasion-panels:not(.tabs-ready) .occasion-panel+.occasion-panel{display:none}
.occasion-panels.tabs-ready>.occasion-panel[hidden]{display:none!important}

/* hero: request and WhatsApp side by side */
.hero-actions{display:flex;align-items:center;gap:12px 22px;flex-wrap:wrap}
.hero-whatsapp{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 22px;border:1px solid currentColor;border-radius:var(--radius,4px);font-size:14px;font-weight:600}
.hero-whatsapp:hover{background:#ffffff14}

/* proof band: places in small caps, artists beside the brands, the founder's line */
.proof-places{margin:0;padding:22px 0;border-bottom:1px solid #ffffff2e;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--stage-muted,#d1d0c6)}
.proof-names{display:grid;gap:6px}
.proof-names p{margin:0;font-size:14px;line-height:1.6;color:var(--stage-muted,#d1d0c6)}
.proof-founder{display:flex;align-items:center;gap:18px 26px;flex-wrap:wrap;padding-top:24px;margin-top:4px;border-top:1px solid #ffffff2e}
.proof-founder img{width:64px;height:64px;object-fit:cover;border-radius:50%}
.proof-founder p{margin:0;font-size:16px;line-height:1.5;color:var(--white);max-width:60ch}
.proof-founder .text-link{color:var(--white)}

/* chapters without their photographs yet: the title on a dark card, never a borrowed picture */
.work-image--text{display:flex;flex-direction:column;justify-content:flex-end;gap:16px;aspect-ratio:590/820;padding:32px;background:var(--studio,#171b19);color:var(--white);border-radius:var(--photo-radius,14px);text-align:left}
.work-image--text .eyebrow{color:var(--accent);margin:0}
.work-text-title{font:700 clamp(40px,4vw,64px)/.9 var(--display);text-transform:uppercase;letter-spacing:-.02em;margin:0}
.work-image--text p:last-child{margin:0;font-size:15px;line-height:1.6;color:var(--stage-muted,#d1d0c6);max-width:40ch}
.archive-photo--text{display:flex;align-items:flex-end;min-height:clamp(320px,36vw,560px);padding:32px;background:var(--studio,#171b19);color:var(--white);cursor:default}
.archive-photo--text span{font:700 clamp(48px,6vw,96px)/.88 var(--display);text-transform:uppercase;letter-spacing:-.02em}
.archive-role{margin:14px 0 0;font-size:14px;line-height:1.6;color:var(--ink)}
.archive-role b{font-weight:600}

/* the founder, right after the hero of Our story */
.founder{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:6%;padding-block:8px 72px;align-items:center}
.founder:not(.has-photo){grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}
.founder:not(.has-photo) .founder-copy{grid-column:2}
.founder-photo{margin:0}
.founder-photo img{width:100%;height:auto;border-radius:var(--photo-radius,14px)}
.founder-copy{display:grid;gap:18px;border-top:1px solid var(--line);padding-top:28px}
.founder-copy .eyebrow{margin:0}
.founder-copy h2{font-size:clamp(48px,5.6vw,88px);line-height:.9;margin:0}
.founder-copy p:not(.eyebrow){margin:0;font-size:18px;line-height:1.7;color:var(--muted);max-width:62ch}

/* the portfolio reads well on a phone: left-aligned, 16px and up, strong contrast */
@media(max-width:700px){
 .archive-project-copy,.archive-project-copy *{text-align:left}
 .archive-project-copy .archive-description{font-size:16px;line-height:1.65;color:var(--ink)}
 .archive-project-copy .eyebrow,.archive-location{font-size:12px}
 .archive-role{font-size:15px}
 .work-intro-bottom>p{font-size:16px}
 .founder,.founder:not(.has-photo){grid-template-columns:1fr;gap:24px;padding-block:0 48px}
 .founder:not(.has-photo) .founder-copy{grid-column:1}
 .founder-copy p:not(.eyebrow){font-size:16px}
 .archive-photo--text{min-height:240px;padding:22px}
 .work-image--text{padding:24px}

 /* the first screen on a phone: the whole picture, the headline, the line and both buttons, no scrolling */
 .home-page .hero-editorial{display:flex;flex-direction:column;height:calc(100svh - 72px - 70px);min-height:600px;max-height:none}
 .home-page .hero-editorial .hero-copy{flex:none;gap:12px;padding:16px var(--space) 12px}
 .home-page .hero-editorial .hero-title{font-size:clamp(54px,16.5vw,92px);padding:2px 0 0;line-height:.86}
 .home-page .hero-editorial .hero-line{padding-bottom:6px}
 .home-page .hero-editorial .hero-note{gap:8px}
 .home-page .hero-editorial .hero-service{font-size:18px;line-height:1.3}
 .home-page .hero-editorial .hero-local{font-size:13px;line-height:1.5;max-width:none}
 /* on a phone the bar below carries both buttons; the first screen gives the photograph the room */
 .home-page .hero-actions{display:none}
 .home-page .hero-editorial .hero-slider{flex:1;min-height:0;display:flex;flex-direction:column;gap:8px;padding:0 var(--space) 10px}
 .home-page .hero-editorial .hero-slider-stage{flex:1;min-height:150px;height:auto;aspect-ratio:auto;max-height:none}
 .home-page .hero-slide img{object-position:50% 42%}
 .home-page .hero-gallery-select{display:none}
 .home-page .hero-gallery-caption{min-height:0}
}

/* a chapter video (Our story): portrait, muted, in the photograph's place */
.story-video{margin:0;align-self:start}
.story-video video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;background:#171815;border-radius:var(--photo-radius,8px)}
.story-video figcaption{font-size:11px;line-height:1.5;color:var(--muted);padding-top:8px}
@media(max-width:900px){.story-video{max-width:320px}}