:root:where([data-language="spanish"]) { --navy:#344f61; --blue:#b94e39; --yellow:#b94e39; --paper:#fff4e5; --scope-surface:#f2ddc4; }
.brand-mark { display:flex; align-items:center; justify-content:center; }
.language-bar { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-top:18px; }
.language-bar > span { font-size:12px; color:var(--muted); letter-spacing:.04em; }
.language-switch { display:flex; gap:4px; padding:5px; border:1px solid var(--line); border-radius:100px; background:color-mix(in srgb,var(--paper) 85%,white); }
.language-switch a { display:flex; align-items:center; gap:8px; padding:9px 16px; border-radius:100px; font-size:12px; font-weight:800; }
.language-switch b { font:700 10px/1.1 Manrope,sans-serif; opacity:.65; }
.language-switch a[aria-current="page"] { background:var(--navy); color:white; box-shadow:0 3px 10px #0001; }
.language-switch a:hover { color:var(--blue); }
.language-switch a[aria-current="page"]:hover { color:white; }
body[data-language] .lessons, body[data-language] .hero-art { background:var(--scope-surface,#ebe6d8); }
body[data-language] .hero-lead,body[data-language] .about-text,body[data-language] .contact-copy>p { color:var(--muted); }
body[data-language] .hero-card,body[data-language] .lesson-card,body[data-language] .review-card,body[data-language] .tool-card { background:color-mix(in srgb,var(--paper) 85%,white); color:var(--ink); border-color:var(--line); }
body[data-language] .lesson-card p,body[data-language] .section-head p { color:var(--muted); }
body[data-language] .review-form,body[data-language] .contact-form,body[data-language] .cabinet-price-form,body[data-language] .cabinet-photo-form,body[data-language] .cabinet-gate { background:var(--scope-surface,#ebe6d8); }
body[data-language] .header-cta:hover,body[data-language] .button-light:hover { background:var(--navy); }
body[data-language] .price-section { color:white; }
body[data-language] .price-section .section-kicker,body[data-language] .price-section h2 em,body[data-language] .price-tag { color:#fff2ce; }
body[data-language] .price-row { border-color:#ffffff50; }
body[data-language] .price-section p,body[data-language] .price-intro p,body[data-language] .price-value small,body[data-language] .price-bottom>span { color:#ffffffcf; }
body[data-language="spanish"] .photo-sticker { transform:rotate(-12deg); font-size:15px; }
body[data-language="spanish"] .photo-sticker strong { font-size:22px; }
body[data-language="spanish"] .facts strong { font-size:45px; }
.spanish-tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.spanish-tiles article { position:relative; overflow:hidden; min-height:340px; padding:34px; border:1px solid var(--line); border-radius:28px; background:var(--scope-surface); }
.spanish-tiles article:nth-child(2) { background:var(--navy); color:#fff; transform:rotate(-2deg); }
.spanish-tiles article:nth-child(3) { background:var(--blue); color:#fff; }
.spanish-tiles article:after { content:'✳'; position:absolute; right:-18px; bottom:-55px; font-size:200px; opacity:.08; line-height:1; }
.spanish-tiles article>span { font-size:10px; font-weight:800; letter-spacing:.12em; }
.spanish-tiles strong { display:block; font-size:clamp(32px,3.5vw,48px); line-height:1.14; letter-spacing:-.04em; margin:35px 0 25px; }
.spanish-tiles p { margin:0; font-size:14px; opacity:.8; }
.cabinet-languages { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:30px 0; }
.cabinet-language { display:flex; align-items:center; gap:18px; padding:22px; border:1px solid var(--line); border-radius:20px; background:var(--paper); }
.cabinet-language>b { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:var(--scope-surface,#ebe6d8); font-size:18px; }
.cabinet-language strong,.cabinet-language small { display:block; }
.cabinet-language small { color:var(--muted); font-size:12px; }
.cabinet-language[aria-current="page"] { border:2px solid var(--blue); padding:21px; }
.scope-heading { color:var(--blue); font-weight:800; }
.cabinet-theme-form { padding:28px; border:1px solid var(--line); border-radius:22px; background:var(--scope-surface,#ebe6d8); }
.theme-presets { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:25px; }
.theme-presets button { display:flex; gap:8px; align-items:center; padding:10px 14px; background:var(--paper); color:var(--ink); border:1px solid var(--line); border-radius:100px; cursor:pointer; font:700 12px Manrope,sans-serif; }
.theme-presets i { display:block; width:15px; height:15px; border-radius:50%; }
.theme-colors { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:24px; }
.theme-colors label { display:grid; gap:8px; font-size:13px; font-weight:700; }
.theme-colors input { width:100%; height:48px; border:1px solid var(--line); background:var(--paper); border-radius:10px; padding:4px; cursor:pointer; }
.theme-preview { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; padding:25px; border-radius:18px; margin:0 0 24px; background:var(--preview-bg); color:var(--preview-primary); border:1px solid #0002; }
.theme-preview strong { font-size:23px; }
.theme-preview span { display:block; margin-top:8px; font-size:12px; }
.theme-preview b { padding:12px 20px; border-radius:100px; background:var(--preview-accent); color:white; font-size:12px; }
@media(max-width:900px) { .spanish-tiles { gap:14px; }.spanish-tiles article { padding:24px; }.theme-colors { grid-template-columns:1fr 1fr; } }
@media(max-width:600px) { .language-bar { justify-content:center; padding-top:12px; }.language-bar>span { display:none; }.language-switch { width:100%; }.language-switch a { flex:1; justify-content:center; padding:10px 12px; }.spanish-tiles { grid-template-columns:1fr; }.spanish-tiles article { min-height:280px; }.spanish-tiles article:nth-child(2) { transform:none; }.cabinet-languages { grid-template-columns:1fr; gap:10px; }.cabinet-language { padding:15px; }.cabinet-language[aria-current="page"] { padding:14px; }.cabinet-nav { gap:20px; overflow:auto; }.cabinet-nav a { white-space:nowrap; }.cabinet-theme-form { padding:20px; } }
body[data-language] .examples { background:var(--paper); }
body[data-language] .examples-board { background:radial-gradient(color-mix(in srgb,var(--navy) 25%,transparent) 1px,transparent 1px) 0 0 / 22px 22px,var(--scope-surface); border-color:var(--line); }
