:root{--rr-blue:#0072b9;--ink:#172e43;--muted:#607384;--line:#e2ebf2;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}a{color:inherit}svg{width:23px;height:23px;flex-shrink:0}a:focus-visible{outline:3px solid #e89335;outline-offset:4px}a{-webkit-tap-highlight-color:transparent}img{display:block}h1,h2,h3,p{margin:0}
.single-page{min-height:100svh;display:grid;place-items:center;padding:30px 16px;background:#edf4f9}.single-wrap{width:100%;max-width:430px}.business-card{position:relative;overflow:hidden;width:100%;max-width:430px;background:white;border-radius:26px;border:1px solid #dce8f0;box-shadow:0 18px 60px #183a5810}.card-header{position:relative}.brand{position:relative;width:210px;aspect-ratio:487/105;overflow:hidden;background:var(--rr-blue);margin-inline:auto;border-radius:5px}.brand img{position:absolute;top:-1.5px;right:-1.5px;height:calc(100% + 3px);width:auto;max-width:none}.profile{position:relative}.portrait-frame{overflow:hidden;flex-shrink:0}.portrait{width:100%;height:100%;object-fit:cover;object-position:center 23%}.identity h1,.identity h3{font-size:30px;line-height:1.14;font-weight:750;letter-spacing:-1px}.job{font-size:14px;line-height:1.5;margin-top:8px}.card-body{padding:0 25px 24px}.contacts{display:flex;flex-direction:column;gap:10px;margin-bottom:22px}.contact-row{display:flex;align-items:center;gap:12px;min-height:72px;padding:11px 12px;border-radius:14px;text-decoration:none;transition:background .15s}.contact-icon{display:grid;place-items:center;width:43px;height:43px;flex-shrink:0;border-radius:12px}.office .contact-icon{color:#0072b9;background:#e2f1fc}.mobile .contact-icon{color:#087d81;background:#e0f4f0}.email .contact-icon{color:#ab5c16;background:#fff0dd}.contact-text{min-width:0;flex:1}.contact-label{display:block;font-size:11px;line-height:1.4;letter-spacing:.02em;margin-bottom:4px;color:var(--muted)}.contact-value{display:block;font-size:15px;line-height:1.4;font-weight:550;overflow-wrap:anywhere}.row-arrow{display:grid;place-items:center;color:#8298a7}.row-arrow svg{width:15px;height:15px}.save{display:flex;align-items:center;justify-content:center;gap:10px;min-height:53px;padding:14px 12px;border-radius:13px;text-decoration:none;font-size:15px;font-weight:650;background:var(--rr-blue);color:white;box-shadow:0 7px 20px #0072b91a}.save:hover{background:#005f9b}.save svg{width:21px;height:21px}.save-hint{font-size:11px;line-height:1.55;color:var(--muted);text-align:center;margin:13px auto 0;max-width:280px}.compare-link{display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px;text-decoration:none;margin:22px auto 0;color:#4f6b7d;min-height:32px}.compare-link svg{width:16px;height:16px}
/* 01: bright, open and calm */
.design-1 .card-header{padding:24px 24px 23px;text-align:center;background:linear-gradient(160deg,#eaf5ff 0%,#f7fcff 45%,white 78%)}.design-1 .card-header:before{content:"";position:absolute;top:-95px;right:-82px;width:260px;height:260px;border:35px solid #cde8fa66;border-radius:50%;pointer-events:none}.design-1 .profile{margin-top:24px}.design-1 .portrait-frame{width:136px;height:136px;margin:0 auto 18px;border:5px solid white;border-radius:50%;box-shadow:0 6px 26px #3c7aa323}.design-1 .job{color:#637989}.design-1 .contact-row{background:#f5f8fc;border:1px solid #edf2f7}.design-1 .contact-row:hover{background:#eaf3fa}
/* 02: structured blue with an offset portrait */
.theme-2{background:#e8f2fa}.design-2{border-color:#caddf0}.design-2 .card-header{padding:22px 25px 28px;background:linear-gradient(125deg,#0072b9,#00548b);color:white;overflow:hidden}.design-2 .card-header:before{content:"";position:absolute;top:65px;right:-96px;width:220px;height:220px;border:1px solid #ffffff20;transform:rotate(35deg);pointer-events:none}.design-2 .card-header:after{content:"";position:absolute;bottom:0;left:0;width:70%;height:4px;background:#37d2ca;pointer-events:none}.design-2 .brand{margin-bottom:27px}.design-2 .profile{display:flex;align-items:center;gap:18px}.design-2 .portrait-frame{width:112px;height:140px;border-radius:17px;border:3px solid #ffffffc4;box-shadow:0 8px 26px #00365333}.design-2 .identity{flex:1;min-width:0}.design-2 .identity h1,.design-2 .identity h3{font-size:30px;max-width:170px}.design-2 .job{font-size:12px;color:#e3f2fb;max-width:160px}.design-2 .card-body{padding-top:20px}.design-2 .contacts{gap:0;margin-bottom:21px}.design-2 .contact-row{padding:12px 0;border-radius:0;border-bottom:1px solid #e3edf5}.design-2 .contact-row:hover{background:#f3f8fc}.design-2 .contact-icon{border-radius:50%}.design-2 .save{border-radius:10px}.design-2 .contact-value{font-size:15px}
/* 03: navy, cyan and restrained warm accents */
.theme-3{background:#e4ebf2}.design-3{color:#f6fbff;background:#10283f;border-color:#24445d;box-shadow:0 18px 60px #0a23372a}.design-3 .card-header{padding:24px 25px 24px;text-align:center;background:radial-gradient(ellipse at 90% 0%,#0072b944,transparent 65%)}.design-3 .profile{margin-top:24px}.design-3 .portrait-frame{width:136px;height:136px;margin:0 auto 18px;border-radius:23px;border:3px solid #6bc8e8;box-shadow:8px 8px 0 #0072b92e}.design-3 .job{color:#aec3d5}.design-3 .contacts{gap:9px}.design-3 .contact-row{background:#19344d;border:1px solid #2a465e}.design-3 .contact-row:hover{background:#24435d}.design-3 .contact-label{color:#b0c4d6}.design-3 .contact-icon{background:#244d6c;color:#8ed1ff}.design-3 .mobile .contact-icon{background:#17494d;color:#7ee5d6}.design-3 .email .contact-icon{background:#493c34;color:#ffd29b}.design-3 .row-arrow{color:#9bbacf}.design-3 .save{background:#0072b9;border:1px solid #3397ce}.design-3 .save:hover{background:#1688cb}.design-3 .save-hint{color:#abc1d3}
/* Side-by-side review of the three working cards */
.gallery-page{min-height:100svh;background:#edf3f8}.gallery-wrap{max-width:1360px;margin:0 auto;padding:48px 32px 54px}.gallery-header{margin-bottom:30px}.eyebrow{font-size:11px;line-height:1.5;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#0072b9;margin-bottom:11px}.gallery-header h1{font-size:clamp(28px,4vw,42px);line-height:1.15;letter-spacing:-1.4px}.gallery-header>p:not(.eyebrow){color:#607384;font-size:15px;line-height:1.6;margin-top:12px}.variant-nav{display:flex;gap:8px;margin-top:20px;flex-wrap:wrap}.variant-nav a{font-size:12px;padding:8px 14px;background:white;border:1px solid #dce6ef;border-radius:30px;text-decoration:none;color:#34546c}.variant-nav a:hover{background:#e4f2fc}.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;align-items:start}.variant{min-width:0;scroll-margin-top:24px}.variant-heading{display:flex;gap:12px;align-items:flex-start;min-height:84px;padding:0 4px}.variant-number{display:grid;place-items:center;flex-shrink:0;width:33px;height:33px;background:#dcecf8;color:#0072b9;border-radius:10px;font-size:13px;font-weight:700}.variant-heading h2{font-size:18px;line-height:1.25;letter-spacing:-.4px;margin-bottom:6px}.variant-heading p{font-size:12px;color:#607384;line-height:1.5;max-width:265px}.gallery .business-card{max-width:none}.open-variant{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-top:14px;color:#0065a4;font-size:13px;font-weight:650;text-decoration:none}.open-variant:hover{text-decoration:underline}.open-variant svg{width:16px;height:16px}
@media(min-width:1000px){.gallery .design-2 .card-header{padding-bottom:50px}.gallery .design-2 .card-body{padding-top:24px}.gallery .design-2 .contacts{margin-top:21px}.gallery .design-2 .contact-row{min-height:81px}}
@media(max-width:1080px) and (min-width:851px){.gallery{gap:15px}.gallery-wrap{padding-inline:20px}.gallery .card-body{padding-inline:16px}.gallery .design-2 .card-header{padding-inline:17px}.gallery .design-2 .profile{gap:11px}.gallery .design-2 .portrait-frame{width:88px;height:116px}.gallery .identity h3{font-size:26px}.gallery .contact-row{padding-inline:9px;gap:9px}.gallery .contact-icon{width:36px;height:36px}.gallery .contact-value{font-size:13px}.gallery .brand{width:190px}}
@media(max-width:850px){.gallery{grid-template-columns:1fr;max-width:430px;margin-inline:auto;gap:34px}.gallery-header{max-width:600px;margin-inline:auto}.gallery-wrap{padding:32px 18px 40px}.variant-heading{min-height:75px}.gallery .business-card{max-width:430px}.gallery-header h1{letter-spacing:-.8px}}
@media(max-width:365px){.single-page{padding:16px 10px}.card-body{padding-left:18px;padding-right:18px}.design-2 .card-header{padding-inline:18px}.design-2 .profile{gap:12px}.design-2 .portrait-frame{width:96px;height:124px}.design-2 .identity h1{font-size:27px}.contact-row{gap:9px;padding-inline:9px}.contact-icon{width:38px;height:38px}.contact-value{font-size:14px}.row-arrow{display:none}}
/* Selected light design: stronger portrait and optically centered original logo. */
.design-1 .brand img{height:100%;top:-20%;right:3.4%;clip-path:inset(3px)}
.design-1 .profile{margin-top:20px}
.design-1 .portrait-frame{width:200px;height:200px;margin-bottom:16px}
.design-1 .identity h1,.design-1 .identity h3{font-size:26px;font-weight:650;letter-spacing:-.6px}
.design-1 .website .contact-icon{background:#eeebfc;color:#6852a3}
.design-1 .email .contact-value{font-size:clamp(12px,3.35vw,14px)}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
