:root { --ink:#19271e; --paper:#fbf8f1; --cream:#f5f0e6; --terracotta:#b85c43; --line:rgba(25,39,30,.2); }
* { box-sizing:border-box; }
body { background:var(--paper); color:var(--ink); font-family:"Trebuchet MS",Trebuchet,Arial,sans-serif; margin:0; min-height:100vh; }
.language-page { margin:0 auto; max-width:1080px; padding:52px 42px 0; }
.welcome { align-items:center; display:grid; gap:72px; grid-template-columns:1.15fr .85fr; min-height:570px; }
.welcome-copy { max-width:570px; }
.eyebrow { color:var(--terracotta); font-size:11px; font-weight:700; letter-spacing:.13em; margin:0 0 20px; text-transform:uppercase; }
h1 { font-family:"Noto Serif",Georgia,serif; font-size:clamp(40px,5.4vw,66px); font-weight:600; letter-spacing:-.045em; line-height:1.06; margin:0; }
h1 em { color:var(--terracotta); font-weight:500; }
.intro { font-size:16px; line-height:1.65; margin:23px 0 38px; }
.language-links { border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(2,1fr); }
.language-link { align-items:center; border-bottom:1px solid var(--line); color:inherit; display:grid; gap:14px; grid-template-columns:auto 1fr auto; min-height:112px; padding:20px 18px; text-decoration:none; transition:background .2s,color .2s; }
.language-link + .language-link { border-left:1px solid var(--line); }
.language-link:hover { background:var(--ink); color:var(--paper); }
.number { color:var(--terracotta); font-size:12px; font-weight:700; align-self:start; }
.language-link strong { font-family:"Noto Serif",Georgia,serif; font-size:clamp(24px,2.8vw,34px); font-weight:600; letter-spacing:-.04em; }
.arrow { color:var(--terracotta); font-size:24px; transition:transform .2s; }
.language-link:hover .arrow { transform:translate(4px,-4px); }
.portrait-wrap { justify-self:center; margin:0; position:relative; width:min(285px,72vw); }
.portrait-wrap img { display:block; filter:grayscale(100%) contrast(1.08); position:relative; width:100%; z-index:1; }
.sun { background:#d7a25d; border-radius:50%; height:190px; position:absolute; right:-41px; top:-30px; width:190px; }
.books { height:145px; margin:0 auto; max-width:510px; position:relative; }
.book { box-shadow:12px 16px 25px rgba(25,39,30,.2); height:137px; object-fit:cover; position:absolute; top:10px; width:94px; }
.book-one { left:62px; transform:rotate(-8deg); }.book-two { right:62px; transform:rotate(8deg); }.book-three { left:50%; transform:translateX(-50%); z-index:1; }
footer { color:#647067; font-size:11px; margin:0 auto; max-width:1080px; padding:20px 42px; width:100%; }
@media (max-width:700px) { .language-page { padding:40px 26px 0; } .welcome { gap:42px; grid-template-columns:1fr; min-height:0; } .portrait-wrap { margin:0 auto; order:-1; width:180px; } .sun { height:125px; right:-27px; top:-19px; width:125px; } .language-links { grid-template-columns:1fr; } .language-link + .language-link { border-left:0; } .books { margin-top:22px; transform:scale(.83); transform-origin:top center; } footer { padding:10px 26px 18px; } }