/*
Theme Name: AvenalPress
Theme URI: https://avenalpress.com
Author: AvenalPress
Description: A playful, editable WordPress news and satire theme inspired by the AvenalPress.com mockup.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 8.0
Text Domain: avenalpress
*/

:root{
  --ap-orange:#f4511e;
  --ap-teal:#0d97a8;
  --ap-black:#111;
  --ap-cream:#fffaf2;
  --ap-border:#ded7cc;
  --ap-muted:#6b655f;
  --ap-max:1280px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ap-black);
  background:#f6f4f0;
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.5;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.ap-wrap{width:min(100% - 28px,var(--ap-max));margin-inline:auto}
.site-header{background:var(--ap-cream);border-top:4px solid #111}
.ap-brand{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:28px;
  align-items:center;
  padding:22px 0 18px;
}
.ap-logo{
  font-family:"Comic Sans MS","Trebuchet MS",cursive;
  font-weight:900;
  font-size:clamp(46px,7vw,92px);
  line-height:.9;
  letter-spacing:-5px;
}
.ap-logo .press,.ap-logo .dotcom{color:var(--ap-orange)}
.ap-logo .dotcom{
  display:inline-block;
  font-size:.52em;
  border:5px solid var(--ap-orange);
  border-radius:999px;
  padding:.1em .28em .16em;
  transform:rotate(-2deg);
  letter-spacing:-2px;
}
.ap-tagline{
  margin-top:14px;
  font-family:"Comic Sans MS","Trebuchet MS",cursive;
  font-size:clamp(15px,2vw,24px);
}
.ap-tagline strong{color:var(--ap-orange)}
.ap-promise{
  display:grid;
  grid-template-columns:1fr 135px;
  gap:16px;
  align-items:center;
}
.ap-promise h2{
  margin:0 0 8px;
  padding:6px 10px;
  background:var(--ap-teal);
  color:#fff;
  font-size:clamp(17px,2.2vw,27px);
  text-transform:uppercase;
}
.ap-pan{
  width:132px;height:80px;border:7px solid #111;border-radius:50%;
  position:relative;background:#252525;transform:rotate(-7deg)
}
.ap-pan:after{content:"";position:absolute;right:-73px;top:22px;width:80px;height:18px;background:#111;border-radius:12px}
.ap-pan:before{content:"♨";position:absolute;color:var(--ap-orange);font-size:58px;left:27px;top:2px}
.main-nav{background:#050505;color:#fff}
.main-nav .ap-wrap{display:flex;align-items:center;justify-content:space-between}
.menu{display:flex;gap:0;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.menu a{display:block;padding:15px 18px;font-weight:700;text-transform:uppercase}
.menu a:hover,.menu .current-menu-item>a{background:var(--ap-orange)}
.ap-search{padding:13px 0;font-size:22px}
.ap-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:18px;
  margin-top:18px;
}
.ap-main,.ap-sidebar{min-width:0}
.ap-feature{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(220px,.7fr);
  background:#fff;border:1px solid var(--ap-border)
}
.ap-feature-media{position:relative;min-height:470px;background:#ddd;overflow:hidden}
.ap-feature-media img{width:100%;height:100%;object-fit:cover}
.ap-kicker{
  position:absolute;left:16px;top:16px;background:var(--ap-orange);color:#fff;
  padding:6px 10px;font-weight:800;text-transform:uppercase
}
.ap-feature-title{
  position:absolute;left:18px;right:18px;bottom:48px;margin:0;color:#fff;
  font-size:clamp(30px,4.5vw,58px);line-height:1.02;text-shadow:0 2px 7px #000
}
.ap-feature-excerpt{
  position:absolute;left:18px;right:18px;bottom:14px;margin:0;color:#fff;
  font-size:18px;text-shadow:0 2px 6px #000
}
.ap-feature-copy{padding:34px 24px;font-size:22px}
.ap-btn{
  display:inline-block;margin-top:18px;background:var(--ap-orange);color:#fff;
  padding:12px 18px;font-weight:800;text-transform:uppercase
}
.ap-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.ap-card{background:#fff;border:1px solid var(--ap-border);display:flex;flex-direction:column}
.ap-card-media{aspect-ratio:16/10;background:#ddd;overflow:hidden}
.ap-card-media img{width:100%;height:100%;object-fit:cover}
.ap-card-body{padding:12px;display:flex;flex-direction:column;gap:8px;flex:1}
.ap-card h3{margin:0;font-size:23px;line-height:1.08}
.ap-card p{margin:0;color:#2e2e2e}
.ap-label{align-self:flex-start;background:var(--ap-teal);color:#fff;padding:4px 7px;font-size:12px;font-weight:800;text-transform:uppercase}
.ap-read{margin-top:auto;color:var(--ap-orange);font-weight:900;text-transform:uppercase}
.ap-sidebar section{background:#fff;border:1px solid var(--ap-border);margin-bottom:14px}
.ap-sidebar h2{
  margin:0;background:var(--ap-orange);color:#fff;padding:8px 12px;
  font-size:18px;text-transform:uppercase
}
.ap-sidebar .teal{background:var(--ap-teal)}
.ap-headline{display:grid;grid-template-columns:72px 1fr;gap:10px;padding:10px;border-bottom:1px solid var(--ap-border);align-items:center}
.ap-headline img{width:72px;height:62px;object-fit:cover}
.ap-sidebar-list{margin:0;padding:12px 18px 16px 34px}
.ap-sidebar-list li{margin:8px 0}
.ap-social{display:flex;gap:10px;padding:14px;flex-wrap:wrap}
.ap-social a{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#111;color:#fff;font-weight:900}
.ap-bottom{display:grid;grid-template-columns:1.2fr .9fr 1fr;gap:14px;margin-top:16px}
.ap-box{background:#fff;border:1px solid var(--ap-border)}
.ap-box h2{margin:0;color:#fff;padding:8px 12px;background:var(--ap-orange);font-size:18px;text-transform:uppercase}
.ap-box.teal h2{background:var(--ap-teal)}
.ap-box-content{padding:12px}
.ap-footer{margin-top:18px;background:#050505;color:#fff}
.ap-footer .ap-wrap{display:flex;gap:22px;align-items:center;justify-content:space-between;padding:18px 0;flex-wrap:wrap}
.ap-footer-logo{font-family:"Comic Sans MS",cursive;font-size:32px;font-weight:900}
.ap-footer-logo span{color:var(--ap-orange)}
.article{background:#fff;border:1px solid var(--ap-border);padding:24px}
.article h1{font-size:clamp(34px,5vw,64px);line-height:1;margin:.2em 0}
.article-meta{color:var(--ap-muted);margin-bottom:18px}
.entry-content{font-family:Georgia,serif;font-size:20px;line-height:1.7}
.entry-content h2,.entry-content h3{font-family:Arial,Helvetica,sans-serif}
.wp-block-image img{border-radius:4px}
@media(max-width:980px){
  .ap-brand,.ap-layout,.ap-feature,.ap-bottom{grid-template-columns:1fr}
  .ap-promise{display:none}
  .ap-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ap-feature-copy{font-size:18px}
}
@media(max-width:620px){
  .ap-wrap{width:min(100% - 18px,var(--ap-max))}
  .ap-grid{grid-template-columns:1fr}
  .menu{display:none}
  .ap-logo{font-size:50px;letter-spacing:-3px}
  .ap-feature-media{min-height:410px}
  .ap-feature-title{font-size:36px}
  .ap-feature-excerpt{font-size:15px}
}