@charset "UTF-8";
:root{font-family:Arial,Helvetica,sans-serif;color-scheme:dark;--panel:#252729;--ink:#f3f1ec;--muted:#b0b3b3;--line:rgba(255,255,255,.15);--glass:rgba(27,29,31,.86);--backdrop:rgba(19,21,23,.42);--accent:#c8ba9e;--bg:#181a1c}
:root[data-theme=light]{color-scheme:light;--panel:#f4f2ed;--ink:#242728;--muted:#676d70;--line:rgba(30,35,37,.15);--glass:rgba(250,249,245,.88);--backdrop:rgba(241,240,234,.38);--accent:#8b7654;--bg:#eeece7}
*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:5px}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.hidden,[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.portfolio{height:100svh;min-height:280px;overflow:hidden;background:#191c1e;color:#fff}.slides{position:absolute;inset:0;overflow:hidden;touch-action:pan-y pinch-zoom}.slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:translateX(100%);will-change:transform}.slide.current{transform:translateX(0)}.slide.moving{transition:transform 750ms cubic-bezier(.22,.68,.1,1)}#stage{position:absolute;inset:0;transition:filter .5s,transform .6s}.contact-open #stage{filter:blur(18px);transform:scale(1.045)}.empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#c9cccd;gap:18px}.empty .eyebrow{font-size:10px;letter-spacing:.35em}.empty p{font-family:Georgia,serif;font-size:clamp(25px,5vw,50px);margin:0;color:#e8e7e2}.top-controls{position:absolute;z-index:30;top:max(28px,env(safe-area-inset-top));left:max(30px,env(safe-area-inset-left));right:max(30px,env(safe-area-inset-right));display:flex;justify-content:space-between;pointer-events:none}.icon-button{color:#fff;background:rgba(20,23,25,.23);border:1px solid rgba(255,255,255,.17);width:49px;height:49px;border-radius:50%;display:grid;place-items:center;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .2s,border-color .2s;pointer-events:auto}.icon-button:hover{background:rgba(20,23,25,.55);border-color:rgba(255,255,255,.5)}.contact-open .top-controls .icon-button{color:var(--ink);background:var(--glass);border-color:var(--line)}.slide-arrow{position:absolute;z-index:5;top:calc(50% - 25px)}.previous{left:30px}.next{right:30px}.bottom-controls{position:absolute;z-index:6;bottom:max(26px,env(safe-area-inset-bottom));left:30px;right:30px;display:flex;align-items:center;justify-content:space-between;gap:16px;text-shadow:0 1px 5px #000}.playback{display:flex;gap:13px;align-items:center;background:rgba(20,23,25,.25);border-radius:30px;padding:0 13px 0 3px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.text-button{color:inherit;background:none;border:0;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.text-button svg{width:17px;height:17px}.counter{font-size:11px;letter-spacing:.16em;font-variant-numeric:tabular-nums}.shake{font-size:11px;letter-spacing:.05em;background:rgba(20,23,25,.3);border-radius:22px;padding:0 14px}.info-link{min-height:44px;display:flex;align-items:center;gap:18px;text-decoration:none;font-size:12px;letter-spacing:.08em;background:rgba(20,23,25,.25);padding:0 17px;border-radius:25px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.info-link span{font-size:17px}.progress-track{position:absolute;z-index:8;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.15)}.progress{width:100%;height:100%;background:rgba(255,255,255,.6);transform:scaleX(0);transform-origin:left center}.contact-layer{position:absolute;inset:0;z-index:20;background:var(--backdrop);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:85px 24px 30px;color:var(--ink)}.card-group{width:min(560px,100%);display:flex;flex-direction:column;align-items:center;gap:24px}.card-perspective{width:100%;perspective:1400px}.business-card{position:relative;width:100%;aspect-ratio:1.65;transform-style:preserve-3d;transition:transform .85s cubic-bezier(.2,.75,.2,1)}.business-card.flipped{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;border-radius:12px;background:var(--glass);border:1px solid var(--line);box-shadow:0 24px 85px rgba(0,0,0,.2);backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 38px;text-align:center}.card-front{justify-content:space-between;padding:30px 25px 26px}.card-mark{font-family:Georgia,serif;letter-spacing:-.12em;font-size:23px;line-height:1;margin-right:4px}.card-mark span{color:var(--accent);padding-left:5px}.card-front h1{font-weight:400;font-size:clamp(25px,4.8vw,36px);letter-spacing:-.035em;margin:0 0 13px}.card-front p{font-size:11px;letter-spacing:.13em;margin:0;color:var(--muted)}.card-footnote{font-size:8px;letter-spacing:.4em;color:var(--muted)}.card-back{transform:rotateY(180deg);gap:17px}.profile,.profile-initials{width:68px;height:68px;border-radius:50%;object-fit:cover;border:1px solid var(--line);flex-shrink:0}.profile-initials{display:grid;place-items:center;background:var(--panel);font:22px Georgia,serif;letter-spacing:-.1em;color:var(--accent)}.contact-details{display:flex;flex-direction:column;gap:8px}.contact-details a{text-decoration:none;font-size:15px}.contact-details a:hover{text-decoration:underline;text-underline-offset:4px}.quote{font-family:Georgia,serif;font-size:14px;line-height:1.65;margin:0;max-width:390px;color:var(--muted)}.flip-button{display:flex;align-items:center;gap:10px;border:0;color:var(--ink);background:none;min-height:44px;padding:0 18px;letter-spacing:.1em;font-size:11px}.flip-button svg{width:20px;height:20px}.contact-open .bottom-controls,.contact-open #slide-controls,.contact-open .progress-track{visibility:hidden}.noscript{position:absolute;inset:40%;z-index:40;background:var(--panel);padding:20px;min-width:240px}
.legal-page{min-height:100vh;background:var(--bg);color:var(--ink);padding:40px 25px 80px}.legal-shell{max-width:780px;margin:auto}.legal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:75px;gap:24px}.legal-nav a{text-decoration:none;font-size:12px;letter-spacing:.08em}.legal-nav .legal-links{display:flex;gap:24px}.legal-page h1{font:400 clamp(34px,6vw,55px) Georgia,serif;letter-spacing:-.03em;margin-bottom:50px}.legal-page h2{font-size:19px;font-weight:400;margin-top:44px}.legal-text{white-space:pre-wrap;line-height:1.85;font-size:15px;color:var(--muted);overflow-wrap:anywhere}.legal-section{scroll-margin-top:30px}.notice{border:1px solid var(--line);padding:18px;line-height:1.6;font-size:13px;color:var(--muted);margin-bottom:25px}.legal-page footer{margin-top:70px;border-top:1px solid var(--line);padding-top:25px}
@media(max-width:600px){.top-controls{top:max(18px,env(safe-area-inset-top));left:18px;right:18px}.icon-button{width:44px;height:44px}.slide-arrow{top:calc(50% - 22px)}.previous{left:14px}.next{right:14px}.bottom-controls{left:18px;right:18px;bottom:max(17px,env(safe-area-inset-bottom));gap:8px}.shake{font-size:10px;max-width:150px;padding:0 10px}.info-link{padding:0 13px;gap:10px}.card-face{padding:24px 23px}.card-front{padding:23px 18px}.card-back{gap:14px}.business-card{aspect-ratio:1.25}.profile,.profile-initials{width:60px;height:60px}.contact-details a{font-size:14px}.quote{font-size:13px;line-height:1.55}.card-front p{font-size:10px;letter-spacing:.08em}.card-group{gap:16px}.legal-nav{align-items:flex-start;margin-bottom:50px}.legal-nav .legal-links{flex-direction:column;gap:14px;text-align:right}}
@media(max-height:520px){.contact-layer{padding:65px 24px 10px}.card-group{width:390px;gap:2px}.business-card{aspect-ratio:1.9}.card-front{padding:16px}.card-front h1{font-size:25px}.card-back{padding:14px;gap:9px}.profile,.profile-initials{width:42px;height:42px}.contact-details{flex-direction:row;gap:14px}.contact-details a{font-size:12px}.quote{font-size:12px}.flip-button{min-height:36px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important}.business-card{transform:none!important}.card-face{backface-visibility:visible;transform:none}.business-card:not(.flipped) .card-back,.business-card.flipped .card-front{visibility:hidden}}
/* Both themes apply to the visible portfolio controls, including with the card closed. */
:root{--control-bg:rgba(23,26,28,.65);--control-hover:rgba(23,26,28,.88);--control-line:rgba(255,255,255,.2)}
:root[data-theme=light]{--control-bg:rgba(250,249,245,.83);--control-hover:rgba(250,249,245,.97);--control-line:rgba(30,35,37,.18)}
.portfolio{background:var(--bg);color:var(--ink)}
.portfolio .icon-button{color:var(--ink);background:var(--control-bg);border-color:var(--control-line)}
.portfolio .icon-button:hover{background:var(--control-hover);border-color:var(--muted)}
.portfolio .playback,.portfolio .shake,.portfolio .info-link{color:var(--ink);background:var(--control-bg);border:1px solid var(--control-line)}
.portfolio .bottom-controls{text-shadow:none}
.portfolio .empty{color:var(--muted)}
.portfolio .empty p{color:var(--ink)}
.portfolio .progress-track{background:var(--line)}
.portfolio .progress{background:var(--ink);opacity:.55}
.portfolio #theme-toggle{transition:color .2s,background .2s,border-color .2s}
/* Original project identity; PNG assets retain their transparency. */
:root{--accent:#a6c2b5}
:root[data-theme=light]{--accent:#285b49}
.card-logo{width:min(390px,88%);padding:0;background:transparent;border-radius:0;flex-shrink:0}
.card-logo img{display:block;width:100%;height:auto;filter:brightness(0) invert(1)}
:root[data-theme=light] .card-logo img{filter:none}
.card-front{padding:28px;justify-content:center;gap:0}
.card-identity{display:flex;align-items:center;justify-content:center;gap:16px;max-width:100%}
.card-identity h1{font-size:clamp(20px,4.2vw,27px);font-weight:400;letter-spacing:-.025em;margin:0;text-align:left;overflow-wrap:anywhere}
.legal-brand{display:flex;flex-direction:column;align-items:flex-start;gap:17px}
.legal-brand img{display:block;width:165px;height:auto;box-sizing:content-box;padding:9px 12px;background:#faf9f5;border-radius:5px}
@media(max-width:600px){.business-card{min-height:260px}.card-logo{width:min(300px,94%);padding:0}.card-front{padding:20px;gap:0}.card-back{padding:20px;gap:12px}.card-identity{gap:12px}.card-identity h1{font-size:23px}.legal-brand img{width:125px}}
@media(max-height:520px){.business-card{min-height:0}.card-front{padding:20px;gap:0}.card-logo{width:min(300px,90%);padding:0}.card-identity h1{font-size:21px}.card-back{gap:9px;padding:14px}}

/* Card: logo only on the front; centered contact information on the reverse. */
.card-back{padding:58px 38px 28px;gap:17px}
.card-contact-name{font-size:clamp(23px,4.2vw,29px);font-weight:400;letter-spacing:-.03em;line-height:1.2;margin:0;text-align:center;overflow-wrap:anywhere}
.card-corner-logo{position:absolute;top:17px;right:19px;width:40px;height:40px;object-fit:contain;filter:brightness(0) invert(1)}
:root[data-theme=light] .card-corner-logo{filter:none}
@media(max-width:600px){.card-back{padding:53px 22px 22px;gap:12px}.card-contact-name{font-size:25px}.card-corner-logo{top:13px;right:15px;width:32px;height:32px}}
@media(max-height:520px){.card-back{padding:37px 24px 17px;gap:9px}.card-contact-name{font-size:23px}.card-corner-logo{top:10px;right:14px;width:28px;height:28px}}

/* Portfolio 1.1.4: portrait left of the complete contact block. */
.card-contact-row{display:flex;align-items:center;justify-content:center;gap:24px;max-width:100%;width:100%}
.card-profile{width:96px;height:96px;flex:0 0 96px;object-fit:cover;border-radius:50%;border:1px solid var(--line);filter:none}
.card-contact-text{min-width:0;text-align:left}
.card-contact-text .card-contact-name{text-align:left;font-size:27px;margin:0 0 13px}
.card-contact-text .contact-details{align-items:flex-start;flex-direction:column;gap:8px}
.card-contact-text .contact-details a{font-size:14px}
.card-back .quote{text-align:center}
@media(max-width:600px){.card-contact-row{gap:15px}.card-profile{width:68px;height:68px;flex-basis:68px}.card-contact-text .card-contact-name{font-size:22px;margin-bottom:10px}.card-contact-text .contact-details a{font-size:12px}}
@media(max-width:350px){.card-contact-row{gap:12px}.card-profile{width:56px;height:56px;flex-basis:56px}.card-contact-text .card-contact-name{font-size:20px}.card-contact-text .contact-details a{font-size:11px}}
@media(max-height:520px){.card-contact-row{gap:18px}.card-profile{width:64px;height:64px;flex-basis:64px}.card-contact-text .card-contact-name{font-size:22px;margin-bottom:8px}.card-contact-text .contact-details{gap:6px}.card-contact-text .contact-details a{font-size:12px}}

/* Portfolio 1.1.5: head close-up gradually returns to the full portrait. */
.profile-focus{position:relative;display:block;width:96px;height:96px;flex:0 0 96px;padding:0;border:1px solid var(--line);border-radius:50%;overflow:hidden;background:transparent;cursor:pointer;touch-action:manipulation}
.profile-focus .card-profile{display:block;width:100%;height:100%;max-width:none;flex:none;border:0;border-radius:0;object-fit:cover;transform-origin:50% 50%;transform:translate(4%,41%) scale(1.95);will-change:transform}
.profile-focus.profile-zooming .card-profile{animation:profile-zoom-out 12s cubic-bezier(.3,.05,.3,1) .9s both}
.profile-focus.profile-animation-paused .card-profile{animation-play-state:paused}
@keyframes profile-zoom-out{from{transform:translate(4%,41%) scale(1.95)}to{transform:translate(0,0) scale(1)}}
@media(max-width:600px){.profile-focus{width:68px;height:68px;flex-basis:68px}}
@media(max-width:350px){.profile-focus{width:56px;height:56px;flex-basis:56px}}
@media(max-height:520px){.profile-focus{width:64px;height:64px;flex-basis:64px}}
@media(prefers-reduced-motion:reduce){.profile-focus .card-profile{animation:none!important;will-change:auto}}
