:root { color-scheme: light; --navy:#102632; --navy2:#1a3846; --ink:#1b2a32; --slate:#53636b; --copper:#b86640; --copper-dark:#935135; --paper:#f7f7f3; --white:#fff; --line:#dce3e3; --pale:#edf2f0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.65 Inter, 'Segoe UI', Arial, sans-serif; }
button, select { font:inherit; }
a { color:inherit; }
a:focus-visible, select:focus-visible { outline:3px solid #d47b54; outline-offset:3px; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { line-height:1.14; letter-spacing:-.035em; }
h1 { font-size:clamp(2.7rem,5.2vw,5.6rem); max-width:900px; }
h2 { font-size:clamp(2.1rem,3.7vw,3.7rem); }
h3 { font-size:1.22rem; }
.shell { width:min(92vw,1240px); margin-inline:auto; }
.skip { position:absolute; inset-inline-start:1rem; top:-7rem; padding:.7rem 1rem; background:var(--white); color:var(--ink); z-index:30; }
.skip:focus { top:1rem; }
.review-banner { background:#fff0c7; color:#583f19; padding:.5rem 4vw; font-size:.78rem; font-weight:800; letter-spacing:.08em; text-align:center; }
.site-header { background:var(--white); border-bottom:1px solid var(--line); position:relative; z-index:10; }
.header-inner { min-height:84px; display:flex; align-items:center; gap:2rem; justify-content:space-between; }
.brand { display:inline-flex; align-items:center; gap:.8rem; flex-shrink:0; color:var(--navy); font-weight:850; letter-spacing:-.04em; text-decoration:none; line-height:1; font-size:1.18rem; }
.brand b { color:var(--copper); }
.brand small { display:block; color:var(--slate); font-size:.54rem; letter-spacing:.14em; margin-top:.4rem; }
.brand-mark { width:40px; height:40px; display:grid; place-items:center; border:2px solid var(--copper); border-radius:3px; font-size:1.35rem; font-weight:900; background:var(--navy); color:var(--white); }
.site-header nav { display:flex; align-items:center; gap:clamp(.65rem,2vw,2rem); font-size:.88rem; font-weight:700; }
.site-header nav a,.login { text-decoration:none; }
.site-header nav a:hover,.login:hover { color:var(--copper-dark); }
.header-tools { display:flex; align-items:center; gap:1rem; }
.selector { display:flex; flex-direction:column; gap:.12rem; font-size:.67rem; font-weight:800; color:var(--slate); text-transform:uppercase; letter-spacing:.05em; }
.selector select { max-width:220px; padding:.34rem 1.4rem .34rem .5rem; border:1px solid var(--line); border-radius:3px; background:var(--white); color:var(--ink); font-size:.78rem; font-weight:600; text-transform:none; letter-spacing:normal; cursor:pointer; }
.login { font-size:.82rem; white-space:nowrap; font-weight:800; }
.hero { background:radial-gradient(circle at 81% 19%,#2a5360 0,#193b49 28%,transparent 50%),linear-gradient(120deg,#102632,#0c202d 74%); color:var(--white); overflow:hidden; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.38fr) minmax(300px,.78fr); gap:clamp(2.5rem,5vw,6rem); align-items:center; padding-block:clamp(4rem,7vw,8rem); }
.hero h1 { margin-bottom:1.5rem; }
.hero-lead { max-width:800px; font-size:clamp(1.1rem,1.6vw,1.4rem); line-height:1.6; color:#d7e1e3; }
.eyebrow,.kicker { font-size:.75rem; text-transform:uppercase; font-weight:900; letter-spacing:.16em; }
.eyebrow { color:#e4a080; margin-bottom:1.2rem; }
.kicker { color:var(--copper-dark); margin-bottom:1.25rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2.3rem; }
.button { display:inline-flex; min-height:50px; align-items:center; justify-content:center; padding:.72rem 1.4rem; border-radius:3px; text-decoration:none; font-size:.91rem; font-weight:800; text-align:center; }
.button.primary { background:var(--copper); color:var(--white); }
.button.primary:hover { background:var(--copper-dark); }
.button.outline { border:1px solid #78909c; color:var(--white); }
.button.outline:hover { background:#264755; }
.system-card { position:relative; padding:1.6rem; background:rgba(5,22,31,.62); border:1px solid #41616d; box-shadow:0 20px 60px rgba(0,0,0,.12); transform:rotate(1deg); }
.system-card:before { content:''; position:absolute; inset:-16px 18px 16px -18px; border:1px solid rgba(224,153,117,.35); pointer-events:none; }
.system-label { color:#e2a381; font-size:.72rem; font-weight:800; letter-spacing:.12em; margin-bottom:1.5rem; }
.system-node { display:flex; gap:1rem; align-items:center; justify-content:space-between; min-height:68px; border-top:1px solid #3a5560; font-size:.9rem; font-weight:750; line-height:1.35; }
.system-node:last-of-type { border-bottom:1px solid #3a5560; }
.system-node>span:last-child { color:#e2a381; font-size:.77rem; }
.system-foot { color:#abc1c7; font-size:.77rem; margin:1.2rem 0 0; }
.section { padding-block:clamp(4rem,7vw,7rem); }
.section-intro { max-width:760px; color:var(--slate); font-size:1.08rem; }
.country-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin-top:2rem; }
.country-card { min-height:157px; padding:1.3rem; border:1px solid var(--line); background:var(--white); transition:border-color .15s,transform .15s; }
.country-card:hover { border-color:var(--copper); transform:translateY(-2px); }
.country-code { color:var(--copper-dark); font-size:.7rem; font-weight:900; letter-spacing:.16em; }
.country-card h3 { margin-bottom:.9rem; }
.country-languages { display:flex; flex-direction:column; gap:.35rem; }
.country-languages a { font-size:.85rem; font-weight:700; text-underline-offset:3px; }
.country-languages a:hover { color:var(--copper-dark); }
.preference { display:inline-flex; align-items:center; flex-wrap:wrap; gap:.4rem; background:#e5efeb; border-inline-start:3px solid var(--copper); padding:.65rem .9rem; margin:1rem 0 0; font-size:.9rem; }
.preference[hidden] { display:none; }
.section-ink { background:var(--navy); color:var(--white); }
.section-ink .kicker { color:#e5a27e; }
.section-ink p { max-width:870px; color:#d1dee1; font-size:1.06rem; }
.section-ink a { color:#f2bea0; }
.text-link { color:var(--copper-dark); font-weight:800; text-underline-offset:4px; }
.scope-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.scope-item { background:var(--white); min-height:165px; padding:1.4rem; }
.scope-item span { color:var(--copper-dark); font-size:.72rem; font-weight:900; letter-spacing:.12em; }
.scope-item p { font-weight:670; margin:.75rem 0 0; }
.section-pale { background:var(--pale); }
.split { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2rem,6vw,7rem); align-items:start; }
.split>div>p:not(.kicker) { max-width:500px; color:var(--slate); font-size:1.04rem; }
.note-card { padding:clamp(1.5rem,3vw,2.4rem); background:var(--white); border:1px solid var(--line); box-shadow:0 15px 40px rgba(16,38,50,.04); }
.note-card h3 { margin:0 0 .5rem; }
.note-card p { color:var(--slate); }
.note-card p+h3 { margin-top:2rem; }
.topic-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.topic-card { display:flex; gap:.8rem; align-items:flex-start; padding:1.1rem; text-decoration:none; border:1px solid var(--line); background:var(--white); min-height:86px; }
.topic-card:hover { border-color:var(--copper); }
.topic-card span:first-child { color:var(--copper-dark); font-size:.76rem; font-weight:900; }
.topic-card strong { flex:1; line-height:1.35; }
.topic-card span:last-child { color:var(--copper-dark); }
.feature-directory { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2rem,5vw,5rem); }
.feature-link-group { display:flex; flex-direction:column; gap:.45rem; }
.feature-link-group h3 { margin-bottom:1rem; }
.feature-link-group a { padding:.35rem 0; border-bottom:1px solid var(--line); font-size:.87rem; font-weight:650; text-decoration:none; }
.feature-link-group a:hover { color:var(--copper-dark); }
.faq-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; }
.faq-grid article { border-top:1px solid currentColor; padding-top:1.2rem; }
.faq-grid h3 { font-size:1.25rem; }
.footer { padding-block:3.4rem; background:#0a1b25; color:#b9cace; font-size:.87rem; }
.footer-grid { display:flex; justify-content:space-between; gap:3rem; }
.footer-brand { color:var(--white); font-size:1.25rem; font-weight:850; }
.footer-grid>div:last-child { display:flex; flex-direction:column; gap:.6rem; }
.footer a { color:#e9c0aa; }
.noscript-languages { display:flex; gap:.5rem; flex-wrap:wrap; padding:1rem 4vw; font-size:.77rem; }
.feature-hero { background:var(--navy); color:var(--white); padding-block:clamp(4rem,6vw,7rem); }
.feature-hero h1 { max-width:1000px; }
.feature-lead { max-width:850px; color:#d5e0e3; font-size:1.2rem; }
.feature-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr); gap:clamp(2rem,6vw,7rem); padding-block:5rem 7rem; }
.feature-main section { margin-bottom:4rem; }
.feature-main h2 { font-size:clamp(1.7rem,2.7vw,2.4rem); }
.feature-main li { padding:.35rem 0; }
.feature-main ol { padding-inline-start:1.5rem; }
.feature-main ul { padding-inline-start:1.2rem; }
.feature-main .limits { padding:1.8rem; background:#f5eadf; border-inline-start:4px solid var(--copper); }
.feature-aside .note-card { position:sticky; top:1.5rem; }
.feature-aside .note-card ul { padding-inline-start:1.2rem; }
.feature-aside .note-card li { margin-bottom:.45rem; }
.related { padding:2rem 0; display:flex; flex-direction:column; gap:.7rem; }
.related a { font-size:.88rem; color:var(--copper-dark); }
.faq-item { border-top:1px solid var(--line); padding-top:1.3rem; margin-top:1.3rem; }
.faq-item h3 { margin-bottom:.5rem; }
.faq-item p { color:var(--slate); }
[dir="rtl"] .system-card { transform:rotate(-1deg); }
[dir="rtl"] .system-card:before { inset:-16px -18px 16px 18px; }
@media(max-width:1130px) { .header-inner { flex-wrap:wrap; padding-block:1rem; } .site-header nav { order:3; width:100%; justify-content:flex-start; } .header-tools { margin-inline-start:auto; } .country-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:800px) { .hero-grid,.split,.feature-layout { grid-template-columns:1fr; } .system-card { max-width:550px; transform:none; } .system-card:before { display:none; } .country-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .scope-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .feature-aside .note-card { position:static; } }
@media(max-width:600px) { .shell { width:min(92vw,480px); } .header-inner { gap:1rem; } .header-tools { width:100%; justify-content:space-between; flex-wrap:wrap; gap:.45rem 1rem; } .selector select { max-width:min(190px,80vw); } .site-header nav { flex-wrap:wrap; font-size:.8rem; gap:.55rem 1rem; } .hero-grid { padding-block:3.4rem; } .hero h1 { font-size:clamp(2.4rem,9vw,3.3rem); } .country-grid,.scope-grid,.topic-grid,.faq-grid,.feature-directory { grid-template-columns:1fr; } .country-card { min-height:unset; } .hero-actions .button { width:100%; } .footer-grid { flex-direction:column; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }