/* mein-ImpfGuide: common layout for landing page, local app and server portal. */
:root{--primary:#e95016;--brand-orange:#e95016;--ink:#242424;--muted:#66615d;--line:#dedbd7;--paper:#fff;--surface:#f3f2f0}
body{font-family:'Avenir Next',Avenir,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);background:#faf9f7;line-height:1.6}h1,h2,h3{text-wrap:balance}h1{font-size:clamp(32px,3.6vw,52px);letter-spacing:-1.8px;line-height:1.15}h2{letter-spacing:-.6px}p{line-height:1.7}button,input,select,textarea{font:inherit}button,.button{min-height:44px}.button{border:1px solid #d6d2cd;border-left:4px solid var(--primary);border-radius:6px;background:#eeece9;color:var(--ink);font-size:14px;font-weight:650;box-shadow:none;padding:12px 18px;transition:background .15s,border-color .15s}.button:hover{background:#e6e2de;border-color:#c6bcb3;border-left-color:var(--primary)}.button.primary{background:#eee9e3;color:#242424}.button:disabled{opacity:.5;cursor:not-allowed}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid #a9370b;outline-offset:3px}
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{background:#f0eeeb;border:1px solid #d8d3cd;border-left:3px solid var(--primary);border-radius:5px;min-height:46px;padding:11px 13px;color:#242424;max-width:100%}input::placeholder,textarea::placeholder{color:#77716c}input[type=checkbox],input[type=radio]{accent-color:#b33c0e}label{line-height:1.5}.confirm-check{background:#f0eeeb;border-radius:5px;padding:16px;gap:12px}.panel,.service-card,.import-box{border:1px solid var(--line);border-radius:10px;box-shadow:none;background:#fff;padding:24px}.service-grid,.portal-grid,.account-summary-grid{gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}.service-card,.panel{min-width:0;overflow-wrap:anywhere}.service-form{display:grid;gap:16px}.service-form>p{margin:0}.service-form h2{margin:0 0 8px}.service-form label{margin:0}.account-summary-grid>.service-card{background:#f3f2f0;border-radius:8px;padding:24px}.account-summary-grid>.service-card>h2{font-size:24px}.account-summary-grid>.service-card>.button{margin-top:auto}.account-identity{padding:20px 0;margin:22px 0;border-block:1px solid var(--line);overflow-wrap:anywhere}.account-identity small{display:block;color:var(--muted);margin-top:5px}
.sidebar{width:256px;padding:28px 18px;background:#fff;overflow-y:auto}.sidebar .brand{display:flex;align-items:center;min-height:48px}.sidebar nav{display:grid;gap:3px}.nav-button{border-radius:6px;min-height:46px;padding:10px 12px;margin:0;font-size:13px}.nav-button.active{background:#eeece9;color:#242424;border-left:3px solid var(--primary);box-shadow:none}.nav-button:not(.active):hover{background:#f5f3f0}.side-note{padding:24px 10px}.sidebar+main{margin-left:256px}.topbar{min-height:72px;height:auto;padding:16px 32px;gap:16px;flex-wrap:wrap;background:#fff}.content{max-width:1320px;padding:28px 32px}.page-heading{margin:30px 0;align-items:center}.page-heading p{font-size:15px;max-width:640px}.eyebrow{font-size:11px;letter-spacing:1.7px;color:#71665e}.stats{border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}.stats>div{padding:22px}.demo-banner,.prototype-notice{background:#f0eeeb;border-color:var(--line);color:#625b55;border-radius:6px}.content>footer{padding:24px 0;margin-top:30px;gap:16px;flex-wrap:wrap}.storage-hint,.prototype-notice{font-size:12px;line-height:1.7}.table-wrap{overflow:auto}dialog{border:1px solid var(--line);border-radius:12px;box-shadow:0 24px 90px #25201a26;max-width:calc(100vw - 24px)}dialog::backdrop{background:#26211c66}#portal{max-width:1240px;padding:30px;margin:auto}#portal>header{padding:0 0 24px;border-bottom:1px solid var(--line);margin-bottom:28px;flex-wrap:wrap}#portal h1{font-size:clamp(30px,4vw,44px)}#portal .panel{margin-bottom:20px}#portal-message{background:#fff3ec;color:#8f310b;border-radius:6px}
/* Public overview */
body:has(.site-header){background:#fff}.site-header{max-width:1240px;min-height:100px;padding:24px 32px;margin:auto;border-bottom:1px solid var(--line)}.site-header nav{gap:26px}.site-header nav a{color:#37332f;font-size:14px}.nav-login{border:1px solid var(--line);border-left:3px solid var(--primary);border-radius:5px;padding:10px 18px;background:#f3f2f0}.hero{max-width:1240px;padding:72px 32px 84px;gap:60px;grid-template-columns:1.12fr 1fr}.hero h1{font-size:clamp(42px,4.6vw,64px);line-height:1.08;margin:24px 0}.hero .lead{font-size:18px;line-height:1.75;color:#625b55}.hero .eyebrow{font-size:10px;letter-spacing:1.6px}.hero-actions .button{min-width:180px}.hero-visual{padding:24px 0}.visual-orbit{background:#f3f1ed;border-radius:28px;inset:0 -18px}.passport{transform:none;border-radius:14px;padding:28px;box-shadow:0 16px 40px #33271b0d;background:white;border:1px solid #dedbd7}.passport h2{font-size:28px}.passport-top{align-items:center}.example{color:#655f57;background:#f2f0ec;letter-spacing:.8px}.person,.vaccine-row{border-color:var(--line)}.person .avatar{background:#eeeae4;color:#55473c}.person small,.vaccine-row small{color:#69645f}.visual-note{background:#f4f2ef;border-radius:6px}.floating-label{position:relative;right:auto;bottom:auto;margin:16px 0 0;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:none;color:#51483f;padding:12px 18px}.floating-label span{color:var(--primary)}.principle,.audiences,.clarity{padding:64px max(32px,calc((100vw - 1176px)/2))}.principle{background:#f3f2f0;border-block:1px solid var(--line)}.steps{gap:32px}.steps article{border-top:1px solid #d4cec7;padding-top:20px}.steps h3{font-size:20px}.steps p,.audience p,.clarity>p:not(.eyebrow){color:#625b55}.number{color:#a8370c;font-size:13px;font-weight:650}.section-heading h2,.clarity h2{font-size:clamp(28px,3.2vw,42px);font-weight:450;line-height:1.2}.audience-grid>.audience{border-radius:10px;border-top:3px solid var(--primary);padding:30px;gap:18px;background:#f3f2f0}.audience-grid>.audience>h3{font-size:29px}.audience-grid>.audience>.button{background:#fff}.clarity{border-top:1px solid var(--line);background:#faf9f7}.clarity details{max-width:none;border-color:var(--line)}.clarity details p{color:#625b55}.clarity summary{font-size:16px}.site-header~footer{padding:30px max(32px,calc((100vw - 1176px)/2));border-top:1px solid var(--line);background:#fff}.site-header~footer a{color:#4c443d}
@media(max-width:1000px){.hero{gap:32px}.page-heading{align-items:flex-start;flex-direction:column}.heading-actions{justify-content:flex-start}.sidebar{width:226px}.sidebar+main{margin-left:226px}.sidebar .impfguide-logo{font-size:20px}.content{padding:24px}.topbar{padding:16px 24px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.sidebar{position:relative;width:auto;inset:auto;padding:16px;border-right:0;border-bottom:1px solid var(--line)}.sidebar+main{margin-left:0}.sidebar nav{display:flex;overflow-x:auto;gap:6px;padding:6px 0}.sidebar .nav-button{width:auto;flex:0 0 auto;white-space:nowrap}.sidebar .side-note,.sidebar-bottom{display:none}.sidebar .workspace,.account-identity{margin:10px 0;padding:10px 0}.sidebar .nav-label{margin:10px 0 4px}.content{padding:20px 16px}.topbar{padding:12px 16px;font-size:12px;gap:10px}.page-heading{margin:24px 0}.page-heading h1{font-size:34px}.service-grid,.portal-grid,.account-summary-grid{grid-template-columns:1fr}.panel,.service-card{padding:20px}.stats>div{padding:16px}.heading-actions{width:100%}.heading-actions .button{flex:1}.site-header{min-height:80px;padding:18px 16px;gap:12px}.site-header nav>a:not(.nav-login){display:none}.site-header nav{gap:0}.nav-login{padding:9px 12px}.hero{padding:36px 20px 48px;grid-template-columns:1fr;gap:24px}.hero h1{font-size:44px}.hero-visual{max-width:480px;width:100%;margin:auto}.visual-orbit{inset:0}.hero .lead{font-size:17px}.hero-actions{gap:10px}.hero-actions .button{min-width:0;flex:1;font-size:13px;padding:12px}.principle,.audiences,.clarity{padding:44px 20px}.steps,.audience-grid{grid-template-columns:1fr}.audience-grid>.audience{padding:24px;grid-template-rows:auto;grid-row:auto}.site-header~footer{padding:24px 20px}.passport{padding:22px}.passport h2{font-size:26px}#portal{padding:20px 16px}#portal>header{gap:16px}.account-summary-grid>.service-card>h2{font-size:22px}dialog{padding:18px}.confirm-check{padding:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
