/*
Theme Name: Grandma June
Theme URI: https://junewhitaker.com/
Author: June Whitaker
Description: Sales-page theme for "Grandma June's Home Secrets" — a country-cottage palette, a long-form sales front page, and an affiliate resource page. Converted from the original static HTML.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: grandma-june
Tags: one-column, custom-menu, translation-ready
*/

:root{
  /* country-cottage palette — buttermilk, sage, clay, honey */
  --ecru:#faf6ec;      /* page background, buttermilk        */
  --ecru2:#f2ede0;     /* alternating sections               */
  --paper:#fffdf8;     /* cards, panels                      */
  --dark:#4a5642;      /* deep sage — panels & footer        */
  --ink:#3d352c;       /* body text, warm dark brown         */
  --soft:#7d7264;      /* secondary text                     */
  --brown:#6b5842;     /* weathered wood                     */
  --mid:#7a6a52;       /* muted wood — must-haves page       */
  --gold:#c0a470;      /* honey — frames and rules           */
  --red:#b0664b;       /* clay terracotta — CTAs & emphasis  */
  --line:#e4dccb;      /* hairlines                          */
  --green:#6e8065;     /* sage — ticks                       */
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --hdrh:60px;         /* sticky site header height          */
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdrh) + 10px);}
body{margin:0;background:var(--ecru);color:var(--ink);
  font-family:Lora,"Iowan Old Style",Palatino,Georgia,serif;
  font-size:17.5px;line-height:1.66;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-family:"Playfair Display",Georgia,serif;color:var(--ink);
  margin:0;line-height:1.14;}
p{margin:0 0 1.05em;}
em{font-style:italic;}
a{color:var(--red);}
img{max-width:100%;height:auto;}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;}
.narrow{max-width:790px;margin:0 auto;padding:0 28px;}
.lab{font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;}

/* ---------------- accessibility ---------------- */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;
  margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important;}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;margin:0;
  position:fixed;top:8px;left:8px;z-index:100000;background:var(--paper);
  color:var(--ink);padding:12px 20px;border:1.5px solid var(--red);text-decoration:none;
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;}
:focus-visible{outline:2px solid var(--red);outline-offset:2px;}

/* ---------------- header ---------------- */
.siteheader{position:sticky;top:0;z-index:40;background:rgba(255,253,248,.94);
  backdrop-filter:saturate(1.4) blur(9px);border-bottom:1px solid var(--line);}
.siteheader .bar{max-width:1180px;margin:0 auto;padding:13px 28px;
  display:flex;align-items:center;gap:26px;}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:0 0 auto;}
.brand svg{flex:0 0 auto;}
.brand .name{font-family:"Playfair Display",Georgia,serif;font-size:20px;
  font-weight:700;color:var(--ink);line-height:1.05;letter-spacing:-.01em;}
.brand .name span{display:block;font-family:var(--mono);font-size:9px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--green);
  font-weight:400;margin-top:3px;}
.sitenav{display:flex;align-items:center;gap:24px;margin-left:auto;}
.sitenav ul{display:flex;align-items:center;gap:24px;margin:0;padding:0;list-style:none;}
.sitenav a{font-family:var(--mono);font-size:11.5px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--brown);text-decoration:none;
  padding:5px 0;border-bottom:1.5px solid transparent;transition:.14s;display:inline-block;}
.sitenav a:hover,.sitenav a:focus-visible,
.sitenav .current-menu-item > a,.sitenav a[aria-current="page"]{
  color:var(--red);border-bottom-color:var(--red);}
.sitenav .navcta > a,.sitenav a.navcta{background:var(--red);color:#fff;
  border:1.5px solid var(--red);padding:10px 18px;border-bottom-color:var(--red);}
.sitenav .navcta > a:hover,.sitenav .navcta > a:focus-visible,
.sitenav a.navcta:hover,.sitenav a.navcta:focus-visible{
  background:#95523a;border-color:#95523a;color:#fff;}
@media(max-width:820px){
  .siteheader .bar{flex-wrap:wrap;gap:12px 18px;padding:12px 18px;justify-content:center;}
  .sitenav{margin-left:0;width:100%;justify-content:center;gap:16px;flex-wrap:wrap;}
  .sitenav ul{justify-content:center;gap:16px;flex-wrap:wrap;}
  .brand .name{font-size:18px;}
  :root{--hdrh:118px;}
}

/* ---------------- buttons ---------------- */
.btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);
  font-size:13px;letter-spacing:.15em;text-transform:uppercase;text-decoration:none;
  padding:17px 30px;border:1.5px solid var(--red);transition:.14s;}
.btn.solid{background:var(--red);color:#fff;}
.btn.solid:hover,.btn.solid:focus-visible{background:#95523a;border-color:#95523a;}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink);}
.btn.ghost:hover,.btn.ghost:focus-visible{background:var(--ink);color:var(--ecru);}

/* ---------------- footer ---------------- */
.sitefooter{background:var(--dark);color:#c3c9b8;padding:34px 0 40px;
  font-size:14px;border-top:1px solid #5b6752;margin-top:0;}
.sitefooter a{color:#e8dcc0;text-decoration:none;}
.sitefooter a:hover{text-decoration:underline;}
.sitefooter .nav{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;margin-bottom:18px;}
.sitefooter .nav ul{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;
  margin:0;padding:0;list-style:none;}
.sitefooter .nav a{font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;}
.sitefooter .tag{text-align:center;font-family:"Playfair Display",Georgia,serif;
  font-style:italic;color:#e8dcc0;}
.sitefooter .fine{font-size:12.5px;color:#8d8275;line-height:1.6;max-width:56em;
  margin:16px auto 0;text-align:center;}