.portfolio-showcase{padding:92px 0;background:#080d18;color:#edf2fb;scroll-margin-top:var(--anchor-offset,110px);border-block:1px solid #263044}
.pf-card-live .pf-desktop>img{display:block;width:100%;height:auto}.pf-card-live .pf-phone>img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}.pf-live-view>img{display:block;width:100%;height:auto}.pf-live-view>.pf-shot-mobile{display:none}.pf-live-view.is-mobile>.pf-shot-desktop{display:none}.pf-live-view.is-mobile>.pf-shot-mobile{display:block}
.portfolio-showcase *{box-sizing:border-box}.pf-container{width:min(1240px,calc(100% - 40px));margin:auto}
.pf-intro{display:grid;grid-template-columns:1.1fr 1fr;align-items:end;gap:52px;margin-bottom:42px}.pf-eyebrow{font:700 11px/1.6 ui-monospace,monospace;letter-spacing:.13em;color:#99aaff!important;margin:0 0 14px}
.pf-intro h2{color:#f3f6ff;font-size:clamp(32px,4.5vw,58px);line-height:1.08;letter-spacing:-.045em;margin:0}.pf-intro h2 span{color:#a6b5ef}
.pf-intro p{color:#b8c4d9;font-size:16px;line-height:1.7}.pf-intro .pf-intro-note{color:#93a3bb;font-size:13px}
.pf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.pf-card{min-width:0;border:1px solid #2c364a;background:#111a2b;border-radius:24px;overflow:hidden}
.pf-card-security{grid-column:1/-1;display:grid;grid-template-columns:1.2fr 1fr}.pf-card-security .pf-stage{height:100%;min-height:340px}
.pf-stage{position:relative;height:320px;padding:30px 58px 44px 24px;overflow:hidden;background:radial-gradient(ellipse at 80% 5%,#455060,#18212d 62%)}
.pf-card-salon .pf-stage{background:radial-gradient(ellipse at top right,#b29b8f,#514046)}
.pf-card-arb .pf-stage{background:radial-gradient(ellipse at top right,#514783,#151b32);padding-right:24px}.pf-arb{--paper:#12192c;--ink:#f4f0ff;--muted:#bac2d9;--accent:#b6a5ff}.pf-arb .pf-site-art{background:linear-gradient(135deg,#564082,#202b49);display:grid;place-items:center}.pf-arb .pf-art-caption{position:static;transform:none;color:#ded5ff;font-weight:800;letter-spacing:.12em}
.pf-card-doctor .pf-stage{background:radial-gradient(ellipse at top right,#b5c8c2,#566e73)}
.pf-card-cats .pf-stage{background:radial-gradient(ellipse at top right,#aeb57d,#4f6348)}
.pf-card-security .pf-stage{background:radial-gradient(ellipse at top right,#665635,#16181b)}
.pf-desktop{position:relative;overflow:hidden;border:5px solid #20242b;border-radius:12px;box-shadow:0 22px 40px #0006;transform:perspective(1300px) rotateY(-5deg) rotateX(3deg);background:#111}
.pf-browser{height:18px;display:flex;align-items:center;gap:4px;padding:0 8px;background:#20242b;color:#adb7c5}.pf-browser i{width:4px;height:4px;border-radius:50%;background:#758090}.pf-browser span{margin-left:auto;font:6px monospace;letter-spacing:.12em}
.pf-phone{position:absolute;right:20px;bottom:33px;width:104px;height:204px;overflow:hidden;border:5px solid #171b22;border-radius:20px;box-shadow:-8px 12px 28px #0007;background:#171b22;transform:rotate(5deg)}
.pf-phone-speaker{position:absolute;top:4px;left:30%;width:40%;height:5px;background:#101217;border-radius:9px;z-index:1}
.pf-stage-label{position:absolute;bottom:13px;left:25px;font:9px monospace;letter-spacing:.16em;color:#ffffffb8}
.pf-card-info{padding:26px 28px 30px}.portfolio-showcase .pf-badge{display:inline-block;padding:5px 9px;margin:0 0 14px;border:1px solid #465373;border-radius:6px;color:#becdf7;font-size:11px;line-height:1.5}
.pf-card h3{color:#f2f6ff;font-size:24px;line-height:1.25;letter-spacing:-.025em;margin:0 0 12px}.pf-card-info>p:not(.pf-badge){color:#adbbd2;font-size:15px;line-height:1.65}
.pf-case summary{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:48px;margin-top:22px;padding:12px 16px;border:1px solid #8799d2;border-radius:9px;background:#aebdff;color:#131b36;font-weight:750;font-size:14px;cursor:pointer;list-style:none}.pf-case summary::-webkit-details-marker{display:none}
.pf-choose{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;color:#c0cdfd;text-decoration:underline;text-underline-offset:4px;font-size:14px}
.pf-case-body{padding-top:18px}.pf-disclosure{color:#b4c2d6!important;font-size:13px;line-height:1.65;margin:0 0 18px}.pf-features{list-style:none;padding:0;display:flex;gap:10px;flex-wrap:wrap}.pf-features li{padding:7px 11px;border:1px solid #3b4a66;border-radius:7px;color:#c4d1e9;font-size:12px}
.pf-site{--paper:#111512;--ink:#edf7eb;--muted:#b9c4b5;--accent:#c0fb73;container-type:inline-size;background:var(--paper);color:var(--ink);overflow:hidden}
.pf-salon{--paper:#f1e8de;--ink:#492735;--muted:#7e5c67;--accent:#79334b}.pf-doctor{--paper:#edf3ef;--ink:#294e49;--muted:#53756c;--accent:#396759}
.pf-cats{--paper:#f0f0dc;--ink:#3c4930;--muted:#687253;--accent:#586733}.pf-security{--paper:#111214;--ink:#f2e9d5;--muted:#c6bda9;--accent:#d6b05e}
.pf-site-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 5%;padding:3% 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 20%,transparent);font-size:clamp(6px,1.6cqw,14px);color:var(--ink)}
.pf-site-nav b{font-weight:800;letter-spacing:.05em}.pf-site-nav>span{font-size:.85em;color:var(--muted)}.pf-site-nav i{font-size:1.5em;font-style:normal}
.pf-site-hero{display:grid;grid-template-columns:1.1fr 1fr;min-height:180px;aspect-ratio:2.2/1}
.pf-site-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:8% 0 9% 10%;min-width:0;position:relative;z-index:1}
.pf-site-kicker{font-size:clamp(6px,1.5cqw,14px);color:var(--muted);margin-bottom:6%}
.pf-site-headline{display:block;color:var(--ink);font-size:clamp(16px,5.4cqw,54px);line-height:1.03;letter-spacing:-.055em;font-weight:750}
.pf-salon .pf-site-headline{font-family:Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.035em}
.pf-site-cta{display:inline-flex;margin-top:9%;padding:5% 7%;font-size:clamp(7px,1.5cqw,14px);background:var(--accent);color:var(--paper);border-radius:5px;font-weight:700}
.pf-site-art{min-width:0;position:relative;overflow:hidden}.pf-site-art>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;display:block}
.pf-doctor .pf-site-art{border-radius:42% 0 0 0;margin-top:6%}.pf-doctor .pf-site-art>img{object-position:50% 30%}
.pf-cats .pf-site-art{border-radius:50% 50% 5% 5%;margin:8% 7% 6% 0}.pf-cats .pf-site-art>img{object-position:50% 50%}
.pf-security .pf-site-art{margin:5%}.pf-security .pf-site-art>img{object-fit:contain}
.pf-site-bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:4%;padding:4% 5%;border-top:1px solid color-mix(in srgb,var(--ink) 20%,transparent)}
.pf-site-bottom span{color:var(--muted);font-size:clamp(6px,1.35cqw,13px)}.pf-site-bottom small{display:block;color:var(--accent);font:clamp(6px,1.1cqw,11px) monospace;margin-bottom:6px}
.pf-handset{display:block;position:absolute;width:46%;height:83%;top:9%;border:2px solid #798574;border-radius:14%;box-shadow:10px 20px 28px #0009}
.pf-handset-back{left:10%;transform:rotate(-16deg);background:linear-gradient(130deg,#aebaa6,#40543d 60%,#8a9a7e)}.pf-handset-back b{display:block;position:absolute;top:8%;left:9%;width:23%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#385146,#030807 45%,#1d2723 57%,#9dad9b 64%,#253427 76%)}.pf-handset-back b:nth-child(2){top:23%}.pf-handset-back b:nth-child(3){left:38%;top:15%}
.pf-handset-front{left:39%;top:16%;transform:rotate(12deg);border:3px solid #2c3732;background:radial-gradient(ellipse at 55% 25%,#dafc99,transparent 38%),radial-gradient(ellipse at 30% 85%,#0c200f,#5a7f45 55%,#abcb7d);display:grid;place-items:center}.pf-handset-front span{font:800 clamp(10px,3.5cqw,32px)/1.1 system-ui;color:#efffd2;letter-spacing:-.06em;text-align:center}
.pf-hair-sculpture{position:absolute;inset:6% 6% 0}.pf-hair-sculpture i{position:absolute;inset:0;border:clamp(3px,1.9cqw,19px) solid #833c50;border-left-color:#bc8b81;border-bottom-color:#b47770;border-radius:48% 48% 30% 50%;transform:rotate(calc(var(--strand)*12deg - 40deg)) scale(calc(1 - var(--strand)*.055));box-shadow:inset 0 1px 1px #f6dec6}
.pf-art-caption{position:absolute;inset:40% 0 auto;text-align:center;font:italic clamp(14px,4cqw,40px)/.95 Georgia,serif;color:#fff0df;letter-spacing:-.06em}
.pf-phone .pf-site{height:100%}.pf-phone .pf-site-nav{padding-top:13%;font-size:5px}.pf-phone .pf-site-nav>span,.pf-phone .pf-site-kicker,.pf-phone .pf-site-bottom,.pf-phone .pf-site-cta{display:none}.pf-phone .pf-site-hero{display:flex;flex-direction:column;aspect-ratio:auto;height:calc(100% - 25px);min-height:0}.pf-phone .pf-site-copy{padding:10% 10% 5%}.pf-phone .pf-site-headline{font-size:15px}.pf-phone .pf-site-art{flex:1;min-height:75px;margin-top:0}
.pf-dialog{width:min(1140px,calc(100% - 24px));max-height:92vh;max-height:92svh;padding:0;border:1px solid #526187;border-radius:18px;background:#0e1728;color:#eaf0ff;overflow:auto;overscroll-behavior:contain}
.pf-dialog::backdrop{background:#020611e8}.pf-dialog-toolbar{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;background:#111c30;border-bottom:1px solid #34405c}.pf-dialog-toolbar h3{margin:4px 0 0;color:#f1f5ff;font-size:21px}.pf-dialog-toolbar .pf-eyebrow{font-size:9px}
.pf-dialog button{min-height:44px;padding:10px 18px;border:1px solid #66779b;border-radius:8px;background:#172741;color:#dbe6ff;font:600 14px/1.4 system-ui;cursor:pointer}.pf-dialog .pf-close{min-width:44px;font-size:19px;padding:8px}
.pf-view-controls{display:flex;justify-content:center;gap:8px;padding:18px}.pf-view-controls button[aria-pressed=true]{background:#bfccff;color:#121b35;border-color:#bfccff}
.pf-project-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;padding:18px 24px 0}.pf-project-nav button:first-child{justify-self:start}.pf-project-nav button:last-child{justify-self:end}.pf-project-nav output{color:#b6c7eb;font:700 13px/1.4 ui-monospace,monospace;white-space:nowrap}
@media(max-width:420px){.pf-project-nav{padding:14px 12px 0;gap:8px}.pf-project-nav button{padding:10px;font-size:12px}}
#pf-dialog-content{padding:0 24px}.pf-view{width:100%;margin:0 auto;border:5px solid #28344c;border-radius:12px;overflow:hidden}.pf-view.is-mobile{width:min(390px,100%)}
.pf-view.is-mobile .pf-site-nav>span{display:none}.pf-view.is-mobile .pf-site-hero{grid-template-columns:1fr;aspect-ratio:auto}.pf-view.is-mobile .pf-site-copy{padding:9%}.pf-view.is-mobile .pf-site-art{height:290px;min-height:240px;margin:0 6% 6%}.pf-view.is-mobile .pf-site-headline{font-size:clamp(28px,10cqw,42px)}.pf-view.is-mobile .pf-site-kicker,.pf-view.is-mobile .pf-site-cta{font-size:12px}.pf-view.is-mobile .pf-site-bottom{grid-template-columns:1fr;gap:14px}.pf-view.is-mobile .pf-site-bottom span{font-size:12px}.pf-view.is-mobile .pf-site-bottom small{display:inline;margin-right:12px}
.pf-dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-top:1px solid #34405c}.pf-dialog-footer p{color:#adbed8;font-size:12px;margin:0}.pf-dialog-footer button{background:#bfccff;color:#121b35}
.portfolio-showcase :is(a,button,summary):focus-visible{outline:3px solid #92e3ff;outline-offset:4px}.pf-status{color:#adceff;line-height:1.6}.pf-status:empty{display:none}html.pf-gallery-open{overflow:hidden}
@media(prefers-reduced-motion:no-preference){.pf-desktop{transition:transform .3s ease}.pf-card:hover .pf-desktop{transform:perspective(1300px) rotateY(0deg) rotateX(0deg)}}
@media(max-width:950px){.pf-intro{grid-template-columns:1fr;gap:20px}.pf-stage{height:285px;padding-right:48px}.pf-phone{right:12px;width:92px;height:183px}.pf-card-info{padding:22px}.pf-card-security{display:block}.pf-card-security .pf-stage{height:320px;min-height:0}.pf-site-hero{min-height:140px}}
@media(max-width:650px){.portfolio-showcase{padding:54px 0}.pf-container{width:calc(100% - 28px)}.pf-grid{grid-template-columns:1fr;gap:22px}.pf-card-security{grid-column:auto}.pf-stage,.pf-card-security .pf-stage{height:286px;padding:28px 48px 42px 16px}.pf-phone{right:14px;width:100px;height:192px}.pf-intro{margin-bottom:28px}.pf-card h3{font-size:22px}.pf-dialog-toolbar{padding:14px}.pf-dialog-toolbar h3{font-size:17px}#pf-dialog-content{padding:0 12px}.pf-dialog-footer{align-items:stretch;flex-direction:column;padding:16px}.pf-view-controls{padding:14px}.pf-dialog .pf-site-hero{min-height:150px}}
.pf-orbit-v2{--paper:#080d17;--ink:#f4f6ff;--muted:#a3b0c8;--accent:#a1dfff;background:radial-gradient(ellipse at 80% 20%,#273653,#080d17 65%)}.pf-card-phones .pf-stage{background:radial-gradient(ellipse at 70% 0,#526783,#141c2d 70%)}.pf-orbit-v2 .pf-site-nav b{letter-spacing:.19em}.orbit-brand-dot{color:#9bddff;margin-left:5px;font-size:.65em}.pf-orbit-v2 .pf-site-headline{font-size:clamp(15px,4.7cqw,48px);line-height:1.07}.orbit-subtitle{font:clamp(6px,1.45cqw,14px)/1.5 system-ui;color:#a3b0c8;margin-top:6%}.pf-orbit-v2 .pf-site-cta{border-radius:30px;background:linear-gradient(120deg,#e9f7ff,#9bccff);box-shadow:0 5px 18px #64bbff22}.orbit-spec{font:clamp(5px,1.15cqw,11px)/1.6 system-ui;letter-spacing:.05em;color:#a3b0c8;margin-top:7%}.pf-orbit-v2 .pf-site-art{overflow:hidden}.orbit-halo{position:absolute;inset:15% 4%;border:1px solid #9ec9ff45;border-radius:50%;transform:rotate(-30deg);box-shadow:0 0 35px #65a2f822,inset 0 0 35px #65a2f811}
.pf-orbit-v2 .pf-handset-back{left:12%;top:9%;height:77%;border-color:#99a5b7;background:linear-gradient(115deg,#c7ccd3,#798593 23%,#abb3bf 48%,#4a586b 85%,#dae1eb);box-shadow:inset 1px 0 2px #fff9,9px 15px 25px #0009}.pf-orbit-v2 .pf-handset-back b{width:26%;border:1px solid #bec5d2;background:radial-gradient(circle at 40% 35%,#5076b8 0 5%,#080c15 16% 43%,#455164 48% 56%,#090b10 61% 76%,#8995a7 80%)}.pf-orbit-v2 .pf-handset-back b:nth-child(2){top:26%}.pf-orbit-v2 .pf-handset-back b:nth-child(3){left:42%;top:17%}.pf-handset-back em{position:absolute;left:42%;top:51%;font:700 18px system-ui;color:#ffffff4f}
.pf-orbit-v2 .pf-handset-front{left:44%;top:17%;height:78%;border:3px solid #141922;outline:1px solid #8b9eb2;background:radial-gradient(ellipse at 15% 85%,#e5b2f4,transparent 42%),radial-gradient(ellipse at 90% 40%,#bdd5ff,transparent 40%),linear-gradient(150deg,#14264e,#445c9b 50%,#141827);box-shadow:inset 0 0 0 1px #ffffff44,12px 18px 25px #0008}.pf-orbit-v2 .pf-handset-front::before{content:'';position:absolute;left:32%;top:4%;width:36%;height:5%;border-radius:20px;background:#080b12}.pf-orbit-v2 .pf-handset-front span{align-self:start;margin-top:31%;color:#f4f6ff;font-weight:400;font-size:clamp(15px,4cqw,40px);letter-spacing:-.04em}.pf-handset-front small{display:block;font:clamp(4px,1cqw,9px)/2 system-ui;letter-spacing:0}.orbit-finish{position:absolute;bottom:1%;left:10%;font:clamp(4px,.8cqw,8px)/1.5 system-ui;letter-spacing:.14em;color:#a3b0c8}
.orbit-shelf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2%;padding:0 5% 4%}.orbit-shelf>span{padding:7%;border:1px solid #2d3b51;border-radius:8px;background:#ffffff04;display:grid;gap:5px}.orbit-shelf b{font:600 clamp(5px,1.4cqw,13px)/1.4 system-ui}.orbit-shelf small{color:#9cb0cb;font:clamp(4px,1cqw,10px)/1.5 system-ui}.orbit-shelf i{height:4px;width:35%;border-radius:6px;background:linear-gradient(90deg,#a0dcff,#af9bfa)}.pf-view.is-mobile .pf-orbit-v2 .pf-site-headline{font-size:clamp(28px,10cqw,42px)}.pf-view.is-mobile .orbit-subtitle{font-size:14px}.pf-view.is-mobile .orbit-spec{font-size:11px}.pf-view.is-mobile .orbit-shelf b{font-size:11px}.pf-view.is-mobile .orbit-shelf small{font-size:9px}
