:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#11283b;background:#f8fafb;font-size:17px;line-height:1.65;color-scheme:light}
*{box-sizing:border-box}
body{margin:0}
a{color:#065d78;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:3px solid #c24673;outline-offset:4px;border-radius:4px}
.skip{position:absolute;top:-90px;left:16px;background:#fff;padding:12px 18px;z-index:5}
.skip:focus{top:12px}
header{max-width:1120px;margin:auto;padding:24px 30px 0}
.top{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.brand{display:block;max-width:300px}
.brand img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.language{display:flex;gap:6px;background:#dff5fb;border-radius:30px;padding:5px}
.language button{font:inherit;font-size:.88rem;font-weight:650;min-height:44px;padding:8px 17px;border:0;border-radius:25px;background:transparent;color:#123b50;cursor:pointer}
.language button[aria-pressed=true]{background:#075d78;color:#fff}
nav{display:flex;gap:6px 18px;flex-wrap:wrap;margin-top:24px;padding:16px 0;border-bottom:1px solid #c7dce4}
nav a{padding:6px 0;min-height:44px;font-weight:600;font-size:.92rem;text-decoration:none}
nav a[aria-current=page]{border-bottom:3px solid #c24b72;color:#11283b}
main{max-width:1060px;margin:auto;padding:34px 30px 50px}
.hero{max-width:820px;padding:10px 0 22px}
.eyebrow{font-size:.75rem;letter-spacing:.14em;font-weight:750;color:#7c3954;margin:0 0 13px}
h1{font-size:clamp(2rem,5vw,3.45rem);font-weight:730;line-height:1.12;letter-spacing:-.035em;margin:0 0 20px}
h2{font-size:1.32rem;line-height:1.3;letter-spacing:-.015em;margin:0 0 12px}
p{margin:0 0 15px}
p:last-child{margin-bottom:0}
.lead{font-size:1.14rem;color:#415a6c;max-width:750px}
.notice{padding:20px 24px;background:#fff0db;border:1px solid #f1cc93;border-left:5px solid #b36d22;border-radius:12px;margin-bottom:32px}
.notice strong{display:block;margin-bottom:5px}
.notice p{font-size:.95rem}
section{margin:30px 0}
section>p{max-width:860px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cards section{padding:25px 23px;border:1px solid #c4e3ec;border-radius:18px;margin:0;background:#e8f8fc;display:flex;flex-direction:column}
.cards section:nth-child(2){background:#fff0e3;border-color:#f0d0b5}
.cards section:nth-child(3){background:#fceaf1;border-color:#ecc5d6}
.cards p{font-size:.95rem}
.text-link{font-weight:650;display:inline-block;margin-top:auto;padding:10px 0 0}
.contact{border-top:1px solid #c7dce4;padding-top:28px;margin-top:42px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0}
.actions a{background:#dff4fa;border:1px solid #8abfce;border-radius:12px;padding:12px 18px;font-weight:650;text-decoration:none;max-width:100%;overflow-wrap:anywhere}
.actions a:last-child{background:#fdebdc;border-color:#d7b294}
.small{font-size:.86rem;color:#405668}
.steps{padding-left:29px}
.steps li{padding:0 0 14px 10px;margin-bottom:15px}
.steps li::marker{font-weight:750;color:#076780}
.steps h2{font-size:1.15rem}
.example{background:#fff;border:2px solid #85c6d8;border-radius:18px;padding:26px}
.consent-example{display:flex;gap:16px;align-items:flex-start;margin:20px 0}
.empty-box{display:block;width:23px;height:23px;flex:0 0 23px;border:2px solid #3a7185;border-radius:4px;background:#fff;margin-top:4px}
.inline-links{display:flex;gap:20px;flex-wrap:wrap}
.inline-links a{min-height:44px;padding:7px 0}
footer{max-width:1060px;margin:auto;padding:25px 30px 45px;border-top:1px solid #c7dce4;font-size:.85rem;color:#415a6c}
.footer-links{display:flex;gap:8px 22px;flex-wrap:wrap;margin-top:14px}
.footer-links a{min-height:44px;padding:9px 0}
@media(max-width:800px){.cards{grid-template-columns:1fr}
.cards section{padding:24px}
.text-link{margin-top:3px}
}
@media(max-width:480px){header{padding:20px 20px 0}
.top{gap:17px}
.brand{max-width:265px}
.language button{padding:8px 16px}
nav{gap:5px 16px;margin-top:16px}
nav a{font-size:.88rem}
main{padding:24px 20px 35px}
.hero{padding:4px 0 20px}
.lead{font-size:1.04rem}
.notice{padding:18px}
.example{padding:20px 17px}
.consent-example{gap:12px}
.actions{flex-direction:column;align-items:flex-start}
footer{padding:24px 20px 35px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}
}
@media print{.language,.skip{display:none}
body{background:#fff}
header,main,footer{max-width:none}
.notice,.cards section,.example{break-inside:avoid}
a{color:inherit}
.brand{width:250px}
}
