/* Locale-specific visual systems. Content and navigation remain shared. */
.language-page{
  --locale-primary:#174c5e;
  --locale-accent:#b4232b;
  --locale-surface:#f7fbfd;
  --locale-tint:#e9f6fc;
  --locale-line:#d5e3e9;
  --locale-radius:12px;
  --locale-shadow:0 8px 24px rgb(23 76 94 / 10%);
  --locale-button-radius:10px;
}
.language-page .masthead,.language-page .bottom{background:var(--locale-primary)}
.language-page .language-switch{border-color:var(--locale-line)}
.language-page .language-switch a{border-color:var(--locale-line)}
.language-page .language-switch a[aria-current="page"]{background:var(--locale-primary);border-color:var(--locale-primary)}
.language-page .hero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(270px,.92fr);padding:0;background:var(--locale-tint);border-color:var(--locale-line);overflow:hidden}
.language-page .hero-copy{padding:34px 26px 32px;align-self:center;position:relative;z-index:1}
.language-page .hero-media{display:block;min-height:300px;background:var(--locale-surface);overflow:hidden}
.language-page .hero-media img{display:block;width:100%;height:100%;min-height:300px;object-fit:cover;object-position:68% center}
.language-page .eyebrow{background:var(--locale-primary)}
.language-page h1,.language-page h2,.language-page h3{color:var(--locale-primary)}
.language-page .card,.language-page .choice-grid article,.language-page .provider,.language-page .animal-links a{border-color:var(--locale-line);border-radius:var(--locale-radius);box-shadow:var(--locale-shadow)}
.language-page .card strong,.language-page .card b,.language-page .check strong,.language-page .animal-links span,.language-page .official a,.language-page .back a,.language-page .toc a{color:var(--locale-primary)}
.language-page .step,.language-page .first-steps li,.language-page .check,.language-page .qa,.language-page .toc{background:var(--locale-surface)}
.language-page .step:before,.language-page .first-steps li:before{background:var(--locale-primary)}
.language-page .cta,.language-page .affiliate-button{border-color:var(--locale-accent);border-radius:var(--locale-button-radius);background:var(--locale-accent);color:#fff;box-shadow:0 5px 14px color-mix(in srgb,var(--locale-accent) 20%,transparent)}
.language-page .cta:hover,.language-page .affiliate-button:hover{background:color-mix(in srgb,var(--locale-accent) 88%,#000)}
.language-page .regions a{background:var(--locale-primary);border-radius:var(--locale-button-radius)}
.language-page .provider-image img{object-fit:contain;background:#fff}
.language-page .qa{border-left-color:var(--locale-accent)}

/* English: restrained public-service layout, square cards and strong blue actions. */
.language-page.locale-en{
  --locale-primary:#163b68;
  --locale-accent:#075e9f;
  --locale-surface:#f3f7fb;
  --locale-tint:#eaf1f8;
  --locale-line:#c9d6e3;
  --locale-radius:6px;
  --locale-shadow:0 3px 12px rgb(22 59 104 / 8%);
  --locale-button-radius:5px;
}
.locale-en .hero-copy{border-left:6px solid var(--locale-accent)}
.locale-en .card{border-left:4px solid #8fb2d2}
.locale-en .section h2{letter-spacing:-.015em}
.locale-en .note,.locale-en .disclosure{border-radius:4px}

/* Simplified Chinese: compact comparison UI with jade structure and vermilion actions. */
.language-page.locale-zh-cn{
  --locale-primary:#23493f;
  --locale-accent:#a91f2b;
  --locale-surface:#f7f8f5;
  --locale-tint:#f5f0e7;
  --locale-line:#d8d0c3;
  --locale-radius:8px;
  --locale-shadow:0 4px 14px rgb(35 73 63 / 9%);
  --locale-button-radius:6px;
}
.locale-zh-cn .hero{border-top:4px solid #c99a45}
.locale-zh-cn .hero-copy{padding-block:28px}
.locale-zh-cn .section{padding-block:24px}
.locale-zh-cn .section h2{padding-bottom:8px;border-bottom:2px solid #c99a45}
.locale-zh-cn .card{min-height:116px}
.locale-zh-cn .card b{color:var(--locale-accent)}
.locale-zh-cn .language-switch a[aria-current="page"]{background:var(--locale-accent);border-color:var(--locale-accent)}

/* Vietnamese: friendly teal cards, rounder surfaces and warm orange actions. */
.language-page.locale-vi{
  --locale-primary:#0b6866;
  --locale-accent:#a94712;
  --locale-surface:#f0faf7;
  --locale-tint:#e5f7f1;
  --locale-line:#bcded5;
  --locale-radius:16px;
  --locale-shadow:0 8px 22px rgb(11 104 102 / 11%);
  --locale-button-radius:14px;
}
.locale-vi .hero{background:linear-gradient(145deg,#e3f7ef,#fff7df)}
.locale-vi .card{border-top:4px solid #e7b23b}
.locale-vi .step,.locale-vi .first-steps li{border-radius:14px}
.locale-vi .regions a{box-shadow:0 5px 14px rgb(11 104 102 / 16%)}

/* Brazilian Portuguese: warm, expressive cards and large high-contrast coral actions. */
.language-page.locale-pt-br{
  --locale-primary:#075f63;
  --locale-accent:#ad3b2d;
  --locale-surface:#fff7ef;
  --locale-tint:#f7eadc;
  --locale-line:#e1c8b7;
  --locale-radius:20px;
  --locale-shadow:0 10px 28px rgb(7 95 99 / 12%);
  --locale-button-radius:999px;
}
.locale-pt-br .hero{background:linear-gradient(145deg,#f5e5d8,#e6f5ee)}
.locale-pt-br .hero-copy{padding-block:38px}
.locale-pt-br .card{border:0;border-bottom:5px solid #e08a58}
.locale-pt-br .cta,.locale-pt-br .affiliate-button{font-size:16px;padding-block:14px}
.locale-pt-br .regions a{padding-inline:16px}

@media(max-width:699px){
  .language-page .hero{grid-template-columns:1fr}
  .language-page .hero-copy{padding:24px 18px 22px;order:2}
  .language-page .hero-media{order:1;min-height:0;aspect-ratio:16/7}
  .language-page .hero-media img{min-height:0;aspect-ratio:16/7;object-position:70% center}
  .language-page .hero h1{font-size:clamp(26px,7.3vw,35px)}
  .locale-en .hero-copy{border-left:0;border-top:5px solid var(--locale-accent)}
  .locale-zh-cn .hero-copy{padding-block:22px}
  .locale-pt-br .hero-copy{padding-block:26px}
  .locale-pt-br .cta,.locale-pt-br .affiliate-button{font-size:14px}
}

@media(prefers-reduced-motion:no-preference){
  .language-page .card,.language-page .regions a,.language-page .cta,.language-page .affiliate-button{transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
  .language-page .card:hover,.language-page .regions a:hover{transform:translateY(-2px)}
}
