:root{color:#102a43;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f4f7f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}.page{place-items:center;min-height:100svh;padding:clamp(12px,2.5vh,24px) clamp(12px,2vw,24px);display:grid}.business-card{background:#fff;border:1px solid #e1e8ed;border-radius:24px;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);width:min(100%,1120px);height:min(90svh,820px);min-height:560px;display:grid;overflow:hidden;box-shadow:0 20px 56px #102a431f}.portrait-wrap{background:#fff;min-width:0;min-height:0;position:relative;overflow:hidden}.portrait{object-fit:contain;object-position:center;width:100%;height:100%;display:block}.company-logo{object-fit:contain;object-position:left top;width:clamp(120px,23%,176px);max-height:20%;display:block;position:absolute;top:clamp(12px,2vh,22px);left:clamp(12px,2vw,22px)}.details{grid-template-rows:auto auto auto auto;place-content:center space-between;justify-items:start;gap:clamp(12px,2.4vh,24px);min-width:0;min-height:0;padding:clamp(24px,3.4vw,42px);display:grid}.identity{flex-direction:column;gap:8px;display:flex}.eyebrow{color:#14756c;letter-spacing:.1em;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:700}h1{letter-spacing:-.035em;margin:0;font-size:clamp(1.8rem,3.4vw,2.45rem);line-height:1.15}.title,.company{color:#506477;margin:0;font-size:1rem;line-height:1.5}.title{font-weight:700}.contact-actions{flex-direction:column;align-items:flex-start;gap:16px;display:flex}.add-contact{color:#fff;background:linear-gradient(135deg,#0878d1,#0e8476);border-radius:999px;justify-content:center;align-items:center;min-height:48px;padding:12px 24px;font-size:1rem;font-weight:700;text-decoration:none;display:inline-flex}.add-contact:hover{filter:brightness(.94)}.phone{color:#0878d1;text-underline-offset:4px;font-size:1rem;font-weight:700}.add-contact:focus-visible,.phone:focus-visible{outline-offset:3px;outline:3px solid #102a43}.qr-panel{text-align:center;border:1px solid #e1e8ed;border-radius:18px;align-self:center;justify-items:center;gap:12px;padding:14px;display:grid}#contact-qr{width:min(192px,22vh);height:min(192px,22vh);display:block}#qr-instruction,.qr-error{color:#506477;max-width:240px;margin:0;font-size:.875rem;line-height:1.5}.qr-error{color:#9f2d35}@media (width<=720px){.page{padding:10px}.business-card{border-radius:20px;grid-template-rows:minmax(0,.85fr) minmax(0,1.15fr);grid-template-columns:minmax(0,1fr);width:min(100%,560px);height:min(94svh,860px);min-height:500px}.company-logo{width:clamp(64px,20vw,88px);max-height:18%;top:10px;left:10px}.details{align-content:space-evenly;gap:clamp(8px,1.4vh,14px);padding:clamp(12px,3.6vw,18px)}.identity{gap:5px}.eyebrow{letter-spacing:.08em;font-size:.58rem}h1{letter-spacing:-.025em;overflow-wrap:anywhere;font-size:clamp(1rem,4.5vw,1.3rem);line-height:1.12}.title,.company{font-size:clamp(.76rem,3.3vw,.9rem);line-height:1.35}.contact-actions{gap:10px}.add-contact{min-height:42px;padding:10px 12px;font-size:.82rem}.phone{font-size:clamp(.77rem,3.4vw,.9rem)}.qr-panel{border-radius:14px;gap:8px;padding:9px}#contact-qr{width:clamp(100px,32vw,136px);height:clamp(100px,32vw,136px)}#qr-instruction,.qr-error{font-size:.68rem;line-height:1.35}}@media (height<=640px) and (width>=721px){.business-card{height:94svh;min-height:0}.details{gap:10px;padding:18px}.qr-panel{gap:8px;padding:10px}#contact-qr{width:min(156px,22vh);height:min(156px,22vh)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}}