/*
Theme Name: By Kara — In the Margins
Version: 1.0
Requires PHP: 8.0
Text Domain: bykara
*/
:root{--ink:#21152f;--paper:#faf7ed;--lilac:#cfa5f6;--lime:#b3ee75}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:19px/1.6 Georgia,serif}a{color:inherit}header,footer{padding:20px 5%;display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap;border-bottom:1px solid #bcaec6}.logo{font:bold 40px Georgia;text-decoration:none;letter-spacing:-3px}nav{display:flex;gap:22px;flex-wrap:wrap;font:14px Arial}nav a{text-decoration:none}.hero{display:grid;grid-template-columns:2fr 1fr;min-height:630px}.hero-left{padding:45px 5%;position:relative;overflow:hidden}.hero h1{font-size:clamp(75px,11vw,170px);line-height:.9;letter-spacing:-.09em;margin:35px 0}.hero h1 em{display:block}.hero h1 sup{color:#9b65d4;font-size:.27em}.hero-left p{font-size:30px}.book{position:absolute;right:2%;bottom:-35px;width:65%;transform:rotate(-10deg);opacity:.7}.hero-right{background:var(--lilac);padding:40px;display:flex;flex-direction:column;justify-content:space-between}.number{font-size:100px;line-height:1}.hero-right h2{font-size:clamp(32px,3.5vw,58px);line-height:1.1}.action{display:inline-block;background:var(--lime);padding:12px 18px;text-decoration:none;font:bold 15px Arial;width:max-content}.section{padding:55px 5%}.section h2{font-size:clamp(35px,5vw,65px);line-height:1.1}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{border-top:2px solid var(--ink);padding-top:15px}.card h3{font-size:30px;line-height:1.2}.reading{max-width:800px;padding:50px 20px;margin:auto}.reading h1{font-size:clamp(50px,7vw,95px);line-height:1.05}.reading .body{font-size:21px;line-height:1.85}.reading img{max-width:100%;height:auto}.note{background:#e9d0fa;padding:24px;margin:30px 0}.note summary{cursor:pointer;font-size:25px}.rabbit{background:var(--ink);color:white;padding:30px;margin:35px 0}.rabbit a{display:block;padding:12px;background:#48345e;margin:10px 0;color:white}.small{font:12px Arial;letter-spacing:2px;text-transform:uppercase}footer{border-top:1px solid #bcaec6;border-bottom:0;font:13px Arial}@media(max-width:800px){.hero{grid-template-columns:1fr}.hero-left{min-height:520px}.hero h1{font-size:clamp(66px,14vw,115px)}.hero-right{min-height:350px}.cards{grid-template-columns:1fr}}