/*!
AVBB OWNERSHIP NOTICE
Copyright (c) 2026 A Visual By Benji Ltd. All rights reserved.
Third-party components retain their original ownership and licences.
*/
/* AVBB — portfolio overview. */
.portfolio-hero__lead{max-width:690px}
.portfolio-hero h1{font-size:clamp(58px,10.5vw,158px)}
.portfolio-hero__copy{width:100%}
.portfolio-chapters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:1020px;margin:28px auto 0;text-align:left}
.portfolio-chapters a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:68px;padding:16px 18px;border:1px solid #f4eee16b;background:#0e0b091a;font-size:13px;font-weight:700;transition:background .25s ease,color .25s ease}
.portfolio-chapters a:hover,.portfolio-chapters a:focus-visible{background:var(--avbb-cream);color:var(--avbb-ink)}
.portfolio-chapters span{color:inherit;font-size:18px}
.portfolio-chapters small{display:block;font-size:9px;font-weight:500;letter-spacing:.1em;margin-bottom:5px}
.portfolio-chapter{position:relative;padding:clamp(64px,8vw,110px) var(--avbb-rail);background:var(--avbb-ink);scroll-margin-top:88px}
.portfolio-chapter--paper{background:var(--avbb-cream);color:var(--avbb-ink)}
.portfolio-chapter--paper .eyebrow{color:var(--avbb-red)}
.portfolio-chapter__head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:34px}
.portfolio-chapter h2{margin:14px 0 0;font:clamp(38px,6.2vw,92px)/.98 'Archivo Black',Arial,sans-serif;letter-spacing:-.04em;text-transform:uppercase}
.portfolio-chapter__head>div{max-width:800px}
.portfolio-chapter__head p:not(.eyebrow){max-width:670px;margin:20px 0 0;font-size:15px;line-height:1.7;opacity:.8}
.portfolio-chapter__link{display:inline-flex;align-items:center;gap:12px;min-height:44px;padding:8px 0;border-bottom:1px solid currentColor;font-size:12px;font-weight:700;white-space:nowrap}
.portfolio-chapter__tools{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;font-size:12px;line-height:1.6}
.portfolio-chapter__tools p{margin:0;opacity:.75}
.portfolio-overview-motion{min-height:44px;padding:10px 16px;border:1px solid #f4eee180;border-radius:99px;background:transparent;color:inherit;font:600 12px 'Space Grotesk',sans-serif;cursor:pointer;flex-shrink:0}
.portfolio-overview-motion[hidden]{display:none}
.portfolio-samples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.6vw,40px)}
.portfolio-sample{min-width:0;margin:0}
.portfolio-sample__media{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:#201b18}
.portfolio-sample__media img,.portfolio-sample__media video{display:block;width:100%;height:100%;object-fit:cover}
.portfolio-sample__media video{position:absolute;inset:0;opacity:0;transition:opacity .3s ease}
.portfolio-sample__media.is-playing video{opacity:1}
.portfolio-sample__badge{position:absolute;left:14px;top:14px;padding:8px 11px;border:1px solid #f4eee166;background:#0e0b09d9;color:var(--avbb-cream);font-size:10px;letter-spacing:.07em;font-weight:700}
.portfolio-sample__play{position:absolute;inset:auto 14px 14px;padding:15px;background:var(--avbb-cream);color:var(--avbb-ink);font-size:12px;font-weight:700;display:flex;justify-content:space-between}
.portfolio-sample h3{margin:20px 0 7px;font:clamp(20px,2.3vw,33px)/1.1 'Archivo Black',Arial,sans-serif;text-transform:uppercase;letter-spacing:-.025em}
.portfolio-sample p{margin:8px 0;font-size:14px;line-height:1.65;opacity:.8}
.portfolio-sample small{font-size:10px;line-height:1.5;letter-spacing:.09em;text-transform:uppercase}
.portfolio-sample__results{display:flex;gap:8px;flex-wrap:wrap;list-style:none;margin:18px 0 7px;padding:0}
.portfolio-sample__results li{padding:8px 10px;border:1px solid #f4eee142;font-size:11px}
.portfolio-sample__results b{color:var(--avbb-peach)}
.portfolio-sample__source{font-size:10px!important}
.portfolio-chapter--paper .portfolio-sample__media{aspect-ratio:3/4}
.portfolio-sample>a:hover .portfolio-sample__play{background:var(--avbb-peach)}
.portfolio-weddings{scroll-margin-top:90px}
.portfolio-intro{scroll-margin-top:90px}
.portfolio-deck-links{display:flex;flex-wrap:wrap;gap:16px;margin-top:18px}
.portfolio-deck-links a{font-size:12px;font-weight:700;border-bottom:1px solid currentColor;padding:10px 0;min-height:44px}
@media(max-width:960px){.portfolio-chapters{max-width:700px;grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio-chapter__head{display:block}.portfolio-chapter__link{margin-top:18px}}
@media(max-width:680px){
 .portfolio-hero{min-height:100svh;padding:102px 18px 90px}.portfolio-hero h1{font-size:clamp(50px,14.5vw,84px);line-height:.9}.portfolio-hero__lead{font-size:14px;max-width:390px;margin-top:23px}
 .portfolio-chapters{gap:8px;margin-top:23px}.portfolio-chapters a{min-height:66px;padding:11px;font-size:12px}.portfolio-chapters small{font-size:8px}
 .portfolio-hero__frame{opacity:.3}.portfolio-hero__motion{margin-top:15px}
 .portfolio-chapter{padding:64px 18px;scroll-margin-top:74px}.portfolio-chapter h2{font-size:clamp(36px,11vw,62px)}
 .portfolio-samples{grid-template-columns:1fr;gap:38px}.portfolio-sample__media{aspect-ratio:4/5;max-height:72svh}.portfolio-chapter--paper .portfolio-sample__media{aspect-ratio:4/5}
 .portfolio-chapter__tools{align-items:start}.portfolio-chapter__tools p{max-width:210px}.portfolio-sample h3{font-size:27px}
}
@media(prefers-reduced-motion:reduce){.portfolio-chapters a,.portfolio-sample__media video{transition:none}}

/* AVBB / clean category links and matching film decks */
.portfolio-chapters{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 26px;max-width:850px}
.portfolio-chapters a{min-height:44px;padding:9px 0;border:0;border-bottom:1px solid #f4eee166;background:none;font-size:14px;gap:14px}
.portfolio-chapters a:hover,.portfolio-chapters a:focus-visible{background:none;color:var(--avbb-cream);border-color:currentColor}
.portfolio-chapters span{font-size:15px;transition:transform .25s ease}
.portfolio-chapters a:hover span{transform:translate(2px,-2px)}
.social-deck-intro{margin:0;font-size:13px;line-height:1.7;color:#f4eee1b3}
#social-content{padding-bottom:42px}
.social-deck{background:var(--avbb-ink);position:relative;border-top:1px solid #f4eee121}
.social-deck__stage{position:relative;padding:55px var(--avbb-rail) 90px;overflow:hidden}
.social-deck__cards{position:relative;display:grid;gap:30px;max-width:1120px;margin:auto}
.social-deck__card{display:grid;grid-template-columns:43% 1fr;position:relative;min-width:0;background:#100e0b;border:1px solid #f4eee138;box-shadow:0 35px 110px #0009;transform-origin:50% 92%;overflow:hidden}
.social-deck__card .portfolio-sample__media{aspect-ratio:auto;height:100%;min-height:460px;max-height:none}
.social-deck__card .portfolio-sample__media img,.social-deck__card .portfolio-sample__media video{object-fit:cover}
.social-deck__copy{align-self:center;padding:clamp(20px,3.5vw,54px);min-width:0}
.social-deck__copy h3{font-size:clamp(38px,5.4vw,78px);line-height:.85;margin:0 0 23px;letter-spacing:-.045em}
.social-deck__copy small{color:var(--avbb-peach);font-size:10px}
.social-deck__copy>p{font-size:14px;line-height:1.7;margin-top:18px}
.social-deck__copy .portfolio-sample__results{gap:10px;margin-top:26px}
.social-deck__copy .portfolio-sample__results li{padding:10px;font-size:12px}
.social-deck__copy .portfolio-sample__results b{display:block;font:clamp(23px,2.7vw,38px)/1.2 'Archivo Black',Arial,sans-serif}
.social-deck__status{position:relative;display:flex;justify-content:space-between;gap:12px;font-size:11px;font-weight:700;letter-spacing:.06em;margin:0 auto 22px;max-width:1120px}
.social-deck__status>span:first-child{font:28px/.9 'Archivo Black',Arial,sans-serif}
.social-deck__motion{position:relative;display:block;margin:0 auto 24px;z-index:32}
.social-deck.is-enhanced{height:300svh;min-height:300vh}
.social-deck.is-enhanced .social-deck__stage{position:sticky;top:0;height:100svh;display:grid;place-items:center;padding:100px max(var(--avbb-rail),7vw) 100px;perspective:1400px}
.social-deck.is-enhanced .social-deck__cards{display:block;width:min(76vw,1120px);aspect-ratio:16/9;max-height:calc(100svh - 220px)}
.social-deck.is-enhanced .social-deck__card{position:absolute;inset:0;will-change:transform,opacity}
.social-deck.is-enhanced .social-deck__card .portfolio-sample__media{min-height:0}
.social-deck.is-enhanced .social-deck__status{position:absolute;top:92px;left:var(--avbb-rail);right:var(--avbb-rail);z-index:32;max-width:none}
.social-deck.is-enhanced .social-deck__motion{position:absolute;top:82px;left:50%;transform:translateX(-50%);margin:0}
.social-deck__card[aria-hidden=true]{pointer-events:none}
.portfolio-deck-controls{position:absolute;z-index:40;bottom:24px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;background:#0e0b09d9;border:1px solid #f4eee138;border-radius:99px;padding:5px}
.portfolio-deck-controls[hidden]{display:none}
.portfolio-deck-controls button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #f4eee15e;border-radius:50%;background:none;color:var(--avbb-cream);cursor:pointer;transition:background .2s ease,color .2s ease}
.portfolio-deck-controls button:hover,.portfolio-deck-controls button:focus-visible{background:var(--avbb-cream);color:var(--avbb-ink)}
.portfolio-deck-controls button:disabled{opacity:.3;cursor:default}
.portfolio-deck-controls span{font-size:10px;letter-spacing:.06em;white-space:nowrap}
.portfolio-deck-controls button{flex-shrink:0}
#release-deck:has(.portfolio-deck-controls:not([hidden])) .release-deck__hint{display:none}
@media(max-width:960px){
 .social-deck.is-enhanced .social-deck__cards{width:86vw}
 .social-deck__copy{padding:24px}.social-deck__copy h3{font-size:42px}
}
@media(max-width:680px){
 .portfolio-chapters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 22px;max-width:360px}
 .portfolio-chapters a{min-height:44px;padding:8px 0;font-size:13px}
 .social-deck__stage{padding:28px 18px 70px}
 .social-deck__card{display:block;min-height:620px}
 .social-deck__card .portfolio-sample__media{position:absolute;inset:0;min-height:0;height:100%;width:100%}
 .social-deck__card .portfolio-sample__media::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0001 0%,#0002 30%,#080706de 60%,#080706 100%);pointer-events:none}
 .social-deck__card .portfolio-sample__play{z-index:3;bottom:16px;left:16px;right:16px;padding:13px}
 .social-deck__card .portfolio-sample__badge{z-index:3;font-size:9px;top:16px;left:16px}
 .social-deck__copy{position:absolute;z-index:2;bottom:76px;left:18px;right:18px;padding:0;pointer-events:none}
 .social-deck__copy h3{font-size:40px;line-height:.9;margin-bottom:12px}
 .social-deck__copy small{font-size:9px}
 .social-deck__copy>p{font-size:12px;line-height:1.5;margin-top:12px;opacity:1}
 .social-deck__copy .portfolio-sample__results{margin:12px 0 5px;gap:8px}
 .social-deck__copy .portfolio-sample__results li{padding:5px 8px;font-size:10px}
 .social-deck__copy .portfolio-sample__results b{font-size:22px}
 .social-deck__copy .portfolio-sample__source{font-size:9px!important;line-height:1.4;margin-top:8px}
 .social-deck.is-enhanced .social-deck__stage{padding:130px 16px 94px}
 .social-deck.is-enhanced .social-deck__cards{width:calc(100vw - 32px);height:calc(100svh - 240px);max-height:680px;aspect-ratio:auto}
 .social-deck.is-enhanced .social-deck__card{min-height:0}
 .social-deck.is-enhanced .social-deck__status{top:84px;left:18px;right:18px;align-items:center}
 .social-deck__status>span:first-child{font-size:23px}
 .social-deck__status>span:last-child{font-size:10px;max-width:100px;text-align:right}
 .social-deck.is-enhanced .social-deck__motion{top:73px;font-size:10px;padding:8px 12px}
 .portfolio-deck-controls{bottom:20px}
 #release-deck .release-deck__bar{display:none}
}
@media(max-width:680px) and (max-height:740px){
 .social-deck.is-enhanced .social-deck__cards{height:calc(100svh - 204px)}
 .social-deck.is-enhanced .social-deck__stage{padding-top:114px;padding-bottom:90px}
 .social-deck__copy h3{font-size:32px}.social-deck__copy>p{font-size:11px}
 .social-deck__copy .portfolio-sample__results b{font-size:19px}
}
@media(prefers-reduced-motion:reduce){.portfolio-chapters span,.portfolio-deck-controls button{transition:none}}
