@font-face{font-family:"Satisfy";src:url("fonts/Satisfy.ttf");font-display:swap}
@font-face{font-family:"Whisper";src:url("fonts/Whisper.ttf");font-display:swap}
@font-face{font-family:"Montserrat";src:url("fonts/Montserrat-Medium.ttf");font-weight:500;font-display:swap}
@font-face{font-family:"Cormorant";src:url("fonts/CormorantGaramond-Light.ttf");font-weight:300;font-display:swap}
:root{--primary:#0c5580;--box:#afc1d3;--boxText:#1a1a1a;--bg:#fcfcff;--nameColor:#a9bccb;--titleText:#111;--onPrimary:#fff;--ring:#222}
*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:rgba(0,0,0,.08)}
html{background:var(--bg)}body{background:var(--bg);font-family:"Montserrat",system-ui,sans-serif;font-weight:500;color:var(--boxText);min-height:100vh}
#card{max-width:480px;margin:0 auto;padding-bottom:48px;container-type:inline-size;overflow:hidden}
.hero{position:relative;height:72cqw;max-height:350px}
.hero::before{content:"";position:absolute;inset:0;background:var(--primary);clip-path:polygon(0 0,100% 0,100% 40%,0 82%)}
.photo{position:absolute;right:7cqw;top:7cqw;width:46cqw;aspect-ratio:1;border-radius:50%;border:1.6cqw solid var(--ring);background:#fff center/cover;display:flex;align-items:center;justify-content:center;font-size:14cqw;color:var(--titleText)}
.name{text-align:center;font-weight:400;padding:0 4cqw;line-height:1.05;margin-top:2cqw;color:var(--nameColor);text-wrap:balance}
.nm{font-family:"Satisfy","Brush Script MT",cursive;font-size:clamp(34px,13.5cqw,64px);text-shadow:0 2px 3px rgba(0,0,0,.18);overflow-wrap:anywhere}
.cred{font-family:"Cormorant",Georgia,serif;font-weight:300;font-size:clamp(22px,8cqw,38px);margin-left:.35em;white-space:nowrap}
.title{text-align:center;font-variant:small-caps;letter-spacing:.08em;font-size:clamp(15px,5.2cqw,24px);line-height:1.15;margin:3cqw 8cqw 8cqw;text-wrap:balance;color:var(--titleText)}
.boxes{padding:0 8cqw;display:grid;gap:5.4cqw}
.box{display:flex;align-items:center;gap:5cqw;background:var(--box);color:var(--boxText);text-decoration:none;padding:4cqw 4.5cqw;min-height:15.5cqw;font-size:clamp(14px,4.6cqw,22px);overflow-wrap:anywhere;line-height:1.2}
.box span{flex:1;min-width:0}
.box i{width:8cqw;height:8cqw;flex:none;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.box.noicon{padding-left:6cqw}
.add{display:flex;align-items:center;justify-content:center;gap:3cqw;margin:9cqw 8cqw 0;background:var(--primary);color:var(--onPrimary);text-decoration:none;padding:3.6cqw 2cqw;min-height:19cqw}
.add svg{width:9cqw;height:9cqw}.add svg path{fill:currentColor}
.add span{font-family:"Whisper","Satisfy",cursive;font-size:clamp(34px,13cqw,60px);line-height:1}

.credit{display:flex;align-items:center;justify-content:center;gap:2.6cqw;margin:12cqw 8cqw 0;color:var(--boxText);text-decoration:none}
.credit .cm{flex:none;display:flex;align-items:center;justify-content:center;width:clamp(30px,9cqw,44px);aspect-ratio:1;border:max(1.5px,.45cqw) solid currentColor;border-radius:50%;font-size:clamp(8px,2.5cqw,12px);font-weight:700;letter-spacing:0}
.credit .cs{font-size:clamp(10px,3cqw,14px);letter-spacing:.01em}
.title.has-co{margin-bottom:1.5cqw}
.company{text-align:center;margin:0 8cqw 8cqw;font-size:clamp(13px,4.2cqw,20px);letter-spacing:.04em;line-height:1.2;color:var(--titleText);opacity:.85;text-wrap:balance}
/* CWG-FONT-START */
@font-face{font-family:"Inter CWG";src:url("fonts/inter-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter CWG";src:url("fonts/inter-latin-ext-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
body,.nm,.cred,.add span{font-family:"Inter CWG",system-ui,-apple-system,"Segoe UI",sans-serif}
body{font-weight:500}
.nm{font-weight:700;letter-spacing:-.02em;font-size:clamp(26px,9.5cqw,46px);text-shadow:none;line-height:1.1}
.cred{font-weight:400;letter-spacing:0;font-size:clamp(15px,5.2cqw,26px)}
.title{font-variant:normal;text-transform:uppercase;letter-spacing:.1em;font-size:clamp(12px,4cqw,19px);font-weight:600}
.add span{font-weight:600;letter-spacing:0;font-size:clamp(18px,5.8cqw,28px)}
/* CWG-FONT-END */