
:root{--ink:#111;--cream:#f4f0ea;--paper:#fbfaf7;--taupe:#d8c7ac;--muted:#6f675e;--line:#ded6ca;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Georgia,"Times New Roman",serif;background:var(--paper);color:var(--ink);line-height:1.6}
a{color:inherit}.topbar{position:sticky;top:0;z-index:60;background:var(--ink);color:var(--cream);text-align:center;padding:.68rem 1rem;font-family:Arial,sans-serif;font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.nav{max-width:var(--max);margin:0 auto;padding:1.6rem 1.1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;font-family:Arial,sans-serif}
.brand{font-family:Georgia,"Times New Roman",serif;font-size:1.55rem;text-decoration:none;letter-spacing:-.04em}
.navlinks{display:flex;gap:.2rem;align-items:center;flex-wrap:wrap;justify-content:flex-end}.navlinks a{text-decoration:none;color:#333;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;padding:.55rem .65rem;border-bottom:1px solid transparent}.navlinks a:hover{border-color:var(--ink)}.navlinks .pill{border:1px solid var(--ink);padding:.55rem .85rem}
.hero{max-width:var(--max);margin:0 auto;min-height:78vh;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:3rem;padding:5rem 1.1rem 4rem}
.eyebrow{font-family:Arial,sans-serif;font-size:.72rem;text-transform:uppercase;letter-spacing:.18em;font-weight:700;color:var(--muted)}
h1,h2,h3{line-height:.96;margin:0 0 1.2rem;font-weight:400;letter-spacing:-.055em}h1{font-size:clamp(4.2rem,11vw,10rem)}h2{font-size:clamp(3rem,7vw,6.6rem)}h3{font-size:1.7rem}.lede{font-size:1.3rem;color:var(--muted);max-width:690px}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem;font-family:Arial,sans-serif}.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--ink);padding:.9rem 1.15rem;text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700;transition:.2s ease;background:transparent}.btn.primary{background:var(--ink);color:var(--cream)}.btn:hover{transform:translateY(-2px)}
.hero-art{min-height:560px;background:var(--ink);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.hero-art:before{content:"";position:absolute;width:72%;height:72%;border:1px solid var(--taupe);border-radius:50%}.hero-art:after{content:"MANTELO";position:absolute;bottom:2rem;left:2rem;color:var(--cream);font-family:Arial,sans-serif;letter-spacing:.3em;font-size:.8rem}.line-a,.line-b{position:absolute;background:var(--taupe);height:1px;width:80%;transform:rotate(-38deg)}.line-b{transform:rotate(38deg);width:55%;opacity:.55}
.section{max-width:var(--max);margin:0 auto;padding:5.5rem 1.1rem;border-top:1px solid var(--line)}.editorial{display:grid;grid-template-columns:.75fr 1.25fr;gap:3rem;align-items:start}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.card,.article-card,.panel{background:var(--paper);border:1px solid var(--line);padding:1.5rem}.card p,.article-card p,.panel p,.muted{color:var(--muted)}.card.dark{background:var(--ink);color:var(--cream);border-color:var(--ink)}.card.dark p{color:#d8d0c5}.article-card{text-decoration:none;display:block;min-height:230px}.article-card:hover{background:var(--cream)}.meta{font-family:Arial,sans-serif;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:700}
.banner{padding:3rem;background:var(--ink);color:var(--cream)}.banner p{color:#d8d0c5}.form-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:1rem}
form{display:grid;gap:.85rem;font-family:Arial,sans-serif}label{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700}input,textarea{width:100%;border:1px solid var(--line);background:#fff;color:var(--ink);padding:1rem;font:inherit}textarea{min-height:145px;resize:vertical}button{border:1px solid var(--ink);background:var(--ink);color:var(--cream);padding:1rem;font:inherit;text-transform:uppercase;letter-spacing:.08em;font-size:.82rem;font-weight:700;cursor:pointer}.form-message,.form-error{display:none;border:1px solid var(--line);padding:1rem}
.share{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem;font-family:Arial,sans-serif}.share button,.share a{border:1px solid var(--line);background:transparent;color:var(--ink);padding:.7rem .85rem;text-decoration:none;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}
.footer{max-width:var(--max);margin:0 auto;padding:3.5rem 1.1rem 4rem;color:var(--muted);border-top:1px solid var(--line);display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:1rem;font-family:Arial,sans-serif;font-size:.9rem}.footer a{color:var(--muted);text-decoration:none;display:block;margin:.35rem 0}
.content{max-width:880px;margin:0 auto;padding:5rem 1.1rem}.content p,.content li{color:var(--muted);font-size:1.08rem}.content h1{font-size:clamp(3.4rem,8vw,7.2rem)}.content h2{font-size:clamp(2rem,5vw,4rem);margin-top:2rem}.notice{border:1px solid var(--line);background:var(--cream);padding:1.2rem;margin-top:1.5rem}.date{font-family:Arial,sans-serif;color:var(--muted);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}
@media(max-width:850px){.hero,.editorial,.form-wrap,.footer,.grid-2{grid-template-columns:1fr}.grid-3{grid-template-columns:1fr}.nav{align-items:flex-start;flex-direction:column}h1{font-size:4.1rem}.hero-art{min-height:360px}}
