*{box-sizing:border-box}
:root{
  --orange:#f28c00;
  --orange-light:#fff3df;
  --black:#111;
  --grey:#666;
  --line:#e7e7e7;
  --bg:#f5f5f5;
  --white:#fff;
  --red:#b42318;
}
html{font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--black)}
body{margin:0}
.container{max-width:720px;margin:0 auto;padding:22px 16px 38px}
.brand{text-align:center;background:var(--white);border:2px solid var(--black);border-radius:18px;padding:22px 18px;box-shadow:0 7px 22px rgba(0,0,0,.08)}
.brand img{display:block;max-width:330px;width:82%;height:auto;margin:0 auto 16px}
.eyebrow{margin:0;color:var(--orange);font-size:.88rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
h1{font-size:1.65rem;line-height:1.15;margin:8px 0}
.intro{margin:0;color:var(--grey);font-size:.98rem}
.language-block,.client-space{margin-top:18px;background:var(--white);border-radius:16px;padding:16px;box-shadow:0 5px 16px rgba(0,0,0,.06)}
.language-title{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.language-title h2{font-size:1.25rem;margin:0}
.flag{font-size:1.5rem}
.cards{display:grid;gap:11px}
.doc-card,.client-card,.secondary-link{
  text-decoration:none;color:var(--black)
}
.doc-card,.client-card{
  display:grid;grid-template-columns:46px 1fr 24px;align-items:center;gap:10px;
  border:2px solid var(--black);border-radius:13px;padding:14px;background:var(--orange-light);
  transition:transform .12s ease,box-shadow .12s ease
}
.doc-card:hover,.doc-card:focus,.client-card:hover,.client-card:focus{
  transform:translateY(-1px);box-shadow:0 5px 13px rgba(0,0,0,.11);outline:none
}
.doc-card.emergency{background:#fff1f0;border-color:var(--red)}
.icon{font-size:1.8rem;text-align:center}
.doc-card strong,.client-card strong{display:block;font-size:1.03rem;line-height:1.2}
.doc-card small,.client-card small{display:block;margin-top:4px;color:var(--grey);font-size:.86rem;line-height:1.25}
.arrow{font-size:2rem;line-height:1;text-align:right}
.upcoming p{margin:0 0 12px;color:var(--grey)}
.secondary-link{
  display:inline-block;padding:11px 13px;border:1px solid var(--black);border-radius:10px;font-weight:700;background:#fff
}
.client-card{background:#efefef}
footer{text-align:center;color:var(--grey);font-size:.82rem;margin-top:20px;line-height:1.4}
footer p{margin:5px 0}
.update{font-weight:700}
@media (max-width:420px){
  .container{padding:12px 10px 28px}
  .brand{padding:18px 12px}
  h1{font-size:1.42rem}
  .doc-card,.client-card{grid-template-columns:40px 1fr 18px;padding:12px 10px}
  .icon{font-size:1.55rem}
  .doc-card strong,.client-card strong{font-size:.96rem}
}