@font-face{font-family:Inter;src:url('assets/inter.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{font-family:Inter,Arial,sans-serif;color:#333;background:#f3f3f3;font-synthesis:none;font-weight:400;letter-spacing:-.06em;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #f33919;outline-offset:6px}
.hero{position:relative;isolation:isolate;height:100svh;min-height:480px;overflow:hidden;--u:min(1vw,1.7595svh)}
/* A full-bleed color field stays opaque at the viewport edge.
   Only the inset paper layer is blurred, keeping the top free of white gaps. */
.edge-glow{position:absolute;z-index:-1;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse farthest-corner at 0% 0%,#de0700 0%,#ff5938 48%,#f1afbd 100%);mask-image:linear-gradient(#000 0%,#000 53%,transparent 79%)}
.edge-glow:before{content:"";position:absolute;inset:calc(.95 * var(--u)) calc(.95 * var(--u)) calc(-5 * var(--u));border-radius:calc(2.8 * var(--u));background:#f3f3f3;filter:blur(calc(.57 * var(--u)))}
.header{position:absolute;inset:4.55% 2.35% auto 2.55%;display:flex;align-items:center;justify-content:space-between}
.logo{position:relative;display:block;width:calc(1.85 * var(--u));height:calc(2.1 * var(--u))}.logo img{width:100%;height:100%;display:block}.glitch-part{position:absolute;inset:0;opacity:0;pointer-events:none}
.menu{width:calc(3.35 * var(--u));height:calc(3.35 * var(--u));border:0;border-radius:50%;background:#dfdfde;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:calc(.24 * var(--u));transition:background .2s}
.menu-icon{display:block;flex:none;width:24px;height:14px;color:#494949}.menu:hover{background:#d6d6d5}
.profile{position:absolute;top:22.85%;left:50%;transform:translateX(-50%);height:calc(4 * var(--u));padding:calc(.43 * var(--u));padding-right:calc(1.15 * var(--u));display:flex;align-items:center;gap:calc(.43 * var(--u));border-radius:999px;border:1px solid #ffffffb5;background:linear-gradient(115deg,#ededed,#dcdcdc);box-shadow:inset 1px 2px 3px #fff;white-space:nowrap}
.avatar{position:relative;flex:none;width:calc(3 * var(--u));height:calc(3 * var(--u))}.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.status{position:absolute;right:3%;bottom:5%;width:20%;aspect-ratio:1;border:2px solid white;border-radius:50%;background:#86b66b}
.name{font-size:calc(1.025 * var(--u));letter-spacing:-.06em;line-height:1.15}.role{font-size:calc(.76 * var(--u));letter-spacing:-.06em;line-height:1.3;color:#777}
.headline{display:flex;flex-direction:column;align-items:center;width:max-content;position:absolute;top:34.9%;left:50%;transform:translateX(-50%);margin:0;font-weight:400;font-size:calc(5.38 * var(--u));line-height:.79;letter-spacing:-.06em;text-align:center;white-space:nowrap}
.line{display:block;flex:none;padding:.2em .06em;margin:-.2em -.06em;color:transparent;background-clip:text;-webkit-background-clip:text;background-image:linear-gradient(100deg,#999 0%,#333 29%,#333 70%,#aaa 100%)}
.first{background-image:linear-gradient(100deg,#606060,#333 50%);line-height:.99}.second{background-image:linear-gradient(100deg,#929292,#333 23%,#333 77%,#a6a6a6)}.third{background-image:linear-gradient(100deg,#aaa,#333 34%,#333 71%,#aaa)}.fourth{background-image:linear-gradient(100deg,#999,#555 43%,#999)}
.selected{position:relative;display:inline-block;color:#ee3c1c;line-height:.92;padding:0 .075em .025em .025em;letter-spacing:inherit;animation:accent-color 1.1s .45s ease-in-out both}
.selected:before{content:"";position:absolute;inset:-.02em 0 -.08em;border:1px dashed #ee3c1c;background:rgb(238 60 28 / 5%);pointer-events:none;animation:accent-reveal 1.1s .45s ease-in-out both}
@keyframes accent-color{from{color:#333}to{color:#ee3c1c}}
@keyframes accent-reveal{from{clip-path:inset(0 100% 0 0);opacity:0}to{clip-path:inset(0 0 0 0);opacity:1}}

.cta{position:absolute;left:50%;bottom:4.65%;transform:translateX(-50%);width:calc(16.65 * var(--u));height:calc(4.65 * var(--u));border:calc(.16 * var(--u)) solid #ffffff80;border-radius:999px;color:white;font-size:calc(1.35 * var(--u));letter-spacing:-.06em;background:radial-gradient(ellipse at 50% 0%,#f34220 8%,#f96651 46%,#f5b1b8 83%,#e9cfe7 100%);box-shadow:inset 0 2px 10px #ffffff60;transition:scale .25s,box-shadow .25s}.cta:hover{scale:1.025;box-shadow:inset 0 2px 10px #ffffff60,0 5px 24px #f966512d}
.entrance{animation:appear .7s ease-out both}.profile{animation-delay:.08s}.headline{animation-delay:.15s}.cta{animation-delay:.23s}@keyframes appear{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
.logo.glitch{animation:jitter .22s steps(1) both}.glitch .glitch-a{animation:split-a .22s steps(1) both}.glitch .glitch-b{animation:split-b .22s steps(1) both}@keyframes jitter{0%,100%{translate:0}20%{translate:2px}40%{translate:-2px}65%{translate:1px}85%{translate:0}}@keyframes split-a{0%,100%{opacity:0}15%,60%{opacity:.45;clip-path:inset(23% 0 48%);translate:-3px;filter:drop-shadow(1px 0 #ed482f)}35%,80%{opacity:.3;clip-path:inset(66% 0 12%);translate:2px}}@keyframes split-b{0%,100%{opacity:0}25%,70%{opacity:.25;clip-path:inset(48% 0 31%);translate:3px;filter:drop-shadow(-1px 0 #60a8b8)}}
.menu-panel{position:absolute;right:2.35%;top:12%;padding:16px;background:#f5f5f5;border:1px solid #fff;border-radius:18px;box-shadow:0 10px 35px #0001}.menu-contact{border:0;background:none;color:#333;padding:8px}.menu-contact span{margin-left:24px}.contact-dialog{width:min(85vw,410px);padding:36px;border:1px solid white;border-radius:24px;background:#f3f3f3;color:#333}.contact-dialog::backdrop{background:#3334;backdrop-filter:blur(6px)}.contact-dialog p{font-size:26px;letter-spacing:-.05em;margin-top:8px}.contact-dialog div{font-size:15px;line-height:1.5;color:#777}.close{position:absolute;right:12px;top:8px;border:0;background:none;font-size:28px;color:#777}
@media(max-width:700px){
 :root{background:#f3f3f3}.hero{--u:1vw;min-height:600px}
 .edge-glow{mask-image:linear-gradient(#000 0%,#000 50%,transparent 66%)}.edge-glow:before{inset:2.8vw 2.8vw -12vw;border-radius:10vw;filter:blur(1.25vw)}
 .header{inset:3.9% 8.7% auto 9.65%}.logo{width:6.55vw;height:7.5vw}.menu{width:12.5vw;height:12.5vw;gap:1vw;background:linear-gradient(100deg,#e4e4e4,#d3d3d3)}.menu-icon{width:24px;height:14px}
 .profile{top:32.65%;height:15vw;padding:1.6vw;gap:1.55vw;padding-right:3.3vw;border:1px solid #fff9;box-shadow:inset 1px 2px 3px #fff}.avatar{width:11.3vw;height:11.3vw}.status{border-width:1.5px}.name{font-size:3.88vw}.role{font-size:2.96vw}
 .headline{top:42.45%;font-size:9.69vw;letter-spacing:-.06em}
 .cta{bottom:8.65%;width:62.5vw;height:17.4vw;font-size:5vw;border-width:.5vw;box-shadow:inset 0 2px 10px #fff6}.menu-panel{right:8.7%;top:11%}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.glitch-part{display:none}}