:root{
  --sage:#cfdab9;
  --butter:#f4e77a;
  --cream:#f9f5e6;
  --peach:#f3d9b1;
  --terra:#b7835f;
  --ink:#2c251f;
  --muted:#6c5f57;
  --line:#e9e0cf;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--cream);color:var(--ink);font-family: ui-serif, Georgia, 'Times New Roman', serif}
.container{width:min(1100px,92%);margin-inline:auto}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;border-radius:10px}
.logo-img{height:60px;width:auto;display:block}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.announce{background:var(--sage);padding:10px 0;text-align:center;font-size:.9rem;border-bottom:1px solid var(--line)}
.site-header{background:var(--cream);position:sticky;top:0;z-index:1000;border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.logo{font-weight:800;letter-spacing:.08em}
.cart{font-size:.9rem}
.menu{display:none;background:transparent;border:1px solid var(--line);border-radius:10px;padding:6px 10px}

.subnav{display:flex;gap:28px;justify-content:center;padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.subnav a{font-size:.95rem;letter-spacing:.15em}

.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:center;padding:28px 0 36px}
.hero h1,.hero h2{font-size:clamp(1.8rem,1.2rem + 3.2vw,3rem);line-height:1.05;margin:0 0 10px;font-variant-ligatures:none;letter-spacing:.02em}
.hero h1 span,.hero h2 span{background:linear-gradient(90deg,var(--butter),var(--peach));padding:2px 6px;border-radius:6px}
.hero p{color:var(--muted);margin:0 0 14px}
.cta{display:flex;gap:10px;flex-wrap:wrap}

.btn{display:inline-block;background:var(--terra);color:#fff;border:none;border-radius:999px;padding:12px 16px;font-weight:700}
.btn:hover{opacity:.95}
.btn-outline{display:inline-block;border:1px solid var(--ink);padding:12px 16px;border-radius:999px}
.btn-small{padding:10px 14px;border-radius:999px;border:1px solid var(--ink);background:#fff}
.btn-soft{padding:10px 14px;border-radius:999px;background:var(--peach);border:1px solid var(--ink)}

.ribbon{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff7e6}
.ribbon-track{display:flex;gap:40px;overflow:auto;white-space:nowrap;padding:10px 0;font-size:.9rem;color:var(--muted);letter-spacing:.18em}

.split{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:30px 0}
.split-left{background:var(--butter);padding:22px;border-radius:14px;border:1px solid var(--line)}
.split-left h2{margin:0 0 6px;letter-spacing:.06em}
.split-right{background:var(--cream);padding:8px;border-radius:14px;border:1px solid var(--line)}
.split-right img{width:100%;height:100%;object-fit:cover;border-radius:12px}

.section{padding:40px 0}
.section-title{letter-spacing:.12em;margin:0 0 14px;border-bottom:1px solid var(--line);padding-bottom:8px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.card-meta{padding:10px}
.muted{color:var(--muted)}

/* product images fit nicely */
.card-img{height:250px;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover;border-bottom:1px solid var(--line)}

.stripe{background:var(--peach);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stripe-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center;padding:26px 0}
.stripe-text h3{margin:0 0 6px}
.stripe-art{height:140px;background:linear-gradient(90deg,var(--sage),var(--butter),var(--peach));border:1px dashed var(--ink);border-radius:12px}

.newsletter{padding:36px 0;text-align:center}
.inline-form{display:flex;gap:8px;justify-content:center;margin-top:8px}
.inline-form input{padding:12px 14px;border:1px solid var(--ink);border-radius:999px;width:min(420px,80%);background:#fff}

/* FOOTER */

.logo.small{font-weight:800}
.marigold{height:16px;background:var(--terra)}

/* POSTER SECTIONS */
.poster-wrap{background:#9aa7b3;padding:34px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.poster{width:min(820px,92%);margin:0 auto;background:#fcf4d9;border:1px solid #d6caa9;box-shadow:0 2px 0 rgba(0,0,0,.04);border-radius:8px;padding:22px 22px 24px;text-align:center;color:#2b241f}
.poster-head{margin-bottom:8px}
.poster-brand{font-family: ui-serif, Georgia, 'Times New Roman', serif; letter-spacing:.14em; font-weight:800}
.poster-subbrand{font-family:'Times New Roman', Georgia, serif;font-style:italic;letter-spacing:.03em;margin-top:2px;opacity:.9}
.poster-title{font-family: ui-serif, Georgia, 'Times New Roman', serif; letter-spacing:.12em; margin:8px 0 2px; font-size:1.3rem}
.poster-sub{font-style:italic;color:#6b625b;margin:0 0 12px}
.poster-body{font-family: ui-serif, Georgia, 'Times New Roman', serif;line-height:1.75;font-size:1.02rem;text-align:left;max-width:700px;margin:0 auto}
.poster-body p{margin:0 0 12px}

/* LOGO + CENTERED TITLE IN HEADER */
.brand-wrap{display:flex;align-items:center;gap:12px}
.site-title{margin:0;font-size:1.6rem;font-weight:800;letter-spacing:.05em;color:var(--ink);line-height:1.1}
.site-header .nav{position:relative}
.site-title{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;pointer-events:none;white-space:nowrap}

/* HERO IMG */
.hero-left img{width:100%;height:auto;object-fit:contain}

/* RESPONSIVE */
@media (max-width: 900px){
  .hero{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr 1fr}
  .stripe-inner{grid-template-columns:1fr}
}

/* safety: prevent any accidental horizontal scroll */
html, body, .site-footer{
  overflow-x: hidden;
}
/* ===== Cart Drawer ===== */
.cart-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);backdrop-filter:saturate(120%) blur(2px);z-index:98;opacity:0;pointer-events:none;transition:.2s}
.cart-drawer{position:fixed;right:0;top:0;height:100vh;width:min(420px,92%);background:#fff;border-left:1px solid var(--line);z-index:99;transform:translateX(100%);transition:transform .25s;display:flex;flex-direction:column}
.cart-drawer.show{transform:none}
.cart-overlay.show{opacity:1;pointer-events:auto}
.hidden{display:block} /* utility: we control via .show */

/* Head/foot */
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}
.cart-close{border:none;background:transparent;font-size:26px;line-height:1;cursor:pointer}
.cart-items{padding:8px 12px;overflow:auto;flex:1}
.cart-foot{border-top:1px solid var(--line);padding:14px 16px}
.cart-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}

/* Line item */
.cart-item{display:grid;grid-template-columns:60px 1fr auto;gap:10px;align-items:center;padding:10px 6px;border-bottom:1px dashed var(--line)}
.cart-item img{width:60px;height:60px;object-fit:cover;border-radius:8px}
.cart-item h5{margin:0;font-size:.98rem}
.cart-item .price{color:var(--muted);font-size:.92rem}
.qty{display:flex;align-items:center;gap:8px;margin-top:6px}
.qty button{width:28px;height:28px;border:1px solid var(--line);background:#fff;border-radius:6px;cursor:pointer}
.remove-btn{border:none;background:transparent;color:#a33;cursor:pointer;margin-left:8px}
/* Footer stick to bottom on cart page */
.cart-body{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.cart-body main{
  flex: 1;                 /* content grows, footer pushes down */
}
.cart-body .site-footer{
  margin-top: auto;        /* keeps footer at bottom when content is short */
}
/* ==== Cart page: always stick footer to bottom ==== */
html, body { height: 100%; }        /* ensure full-height context */

.cart-body{
  min-height: 100dvh;               /* mobile-safe viewport height */
  display: flex;
  flex-direction: column;
}

.cart-body > .announce,
.cart-body > .site-header{
  flex: 0 0 auto;                   /* header/announce take natural height */
}

.cart-body > main{
  flex: 1 0 auto;                   /* main fills remaining space */
  display: block;                   /* avoid any weird collapses */
}

.cart-body > .site-footer{
  flex: 0 0 auto;
  margin-top: auto !important;      /* push footer down */
}

/* === Not Your First Rodeo (split CTA) === */
.rodeo-split{
  display:grid; grid-template-columns:1fr 1fr; min-height:68vh; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.rodeo-split .rodeo-col.left{ background:var(--bg); padding:72px 8vw; display:flex; flex-direction:column; justify-content:center }
.rodeo-split .rodeo-col.right{ background:color-mix(in srgb, var(--sage) 92%, white 8%); position:relative; display:grid; place-items:center; padding:40px 0 }
.rodeo-split h2{ font-family:"Bodoni Moda", serif; text-transform:uppercase; letter-spacing:.02em; font-size:clamp(2.0rem,1.2rem + 3.4vw,3.8rem); color:#7A552E; margin:0 0 14px }
.rodeo-split p{ max-width:46ch; color:var(--muted); }
.rodeo-split .cta{ display:flex; gap:16px; margin-top:22px; flex-wrap:wrap }
.btn-pill{ background:transparent; border:2px solid #7A552E; color:#7A552E; border-radius:999px; padding:.9rem 1.4rem; letter-spacing:.22em; text-transform:uppercase; font-weight:700; font-size:.9rem }
.btn-pill:hover{ background:#7A552E; color:#fff; transition:all .2s ease }

.rodeo-split .signpost{ width:min(420px, 70%); height:auto; filter:drop-shadow(0 12px 24px rgba(0,0,0,.12)); }

/* Decor text around art */
.rodeo-decor{ position:absolute; font-weight:700; color:#7A552E; opacity:.7; letter-spacing:.6em; font-size:.82rem }
.rodeo-decor.top{ top:12px; right:34px; transform:rotate(180deg) }
.rodeo-decor.bottom{ bottom:12px; left:34px }
.rodeo-decor.side{ top:50%; transform:translateY(-50%); writing-mode:vertical-lr }
.rodeo-decor.side.left{ left:10px }
.rodeo-decor.side.right{ right:10px }

/* Responsive */
@media (max-width: 980px){
  .rodeo-split{ grid-template-columns:1fr; }
  .rodeo-split .rodeo-col.left{ padding:56px 6vw }
  .rodeo-split .rodeo-col.right{ padding:32px 0 }
  .rodeo-decor{ display:none }
}


/* === Typography base === */
h1,h2,h3,h4{ font-family:"Bodoni Moda", serif; letter-spacing:-.01em }
body, p, a, li, input, button, small{ font-family:"Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif }


/* === Love is in the details (editorial split) === */
.love-details{
  position:relative;
  display:grid; grid-template-columns:1.05fr .95fr; align-items:center;
  padding:72px 0;
  background:linear-gradient(90deg, #D6E4E6 0 60%, #F4E6C8 60% 100%);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.love-details .ld-left{ padding-left:8vw; padding-right:6vw }
.love-details h2{ font-family:"Bodoni Moda", serif; font-size:clamp(2.2rem,1.4rem + 3.2vw,3.8rem); line-height:1.02; letter-spacing:.02em; color:#7A552E; margin:0 0 14px }
.love-details p{ max-width:58ch; }
.ld-links{ display:flex; gap:48px; margin-top:26px; flex-wrap:wrap }
.ld-links a{ text-decoration:underline; text-underline-offset:6px; letter-spacing:.5em; font-weight:600; font-size:.95rem; color:#7A552E }
.ld-links a:hover{ opacity:.9 }

.love-details .ld-right{ position:relative; padding:40px 0; display:grid; place-items:center }
.ld-hero{ width:min(680px, 82%); height:auto; border-radius:16px; border:1px solid var(--line); box-shadow:0 16px 36px rgba(0,0,0,.10) }

.ld-cactus{ position:absolute; left:calc(60% - 26px); bottom:28px; width:80px; height:auto; opacity:.9 }

.ld-stamp{ position:absolute; top:18px; right:12%; width:120px; height:120px; border:2px solid #7A552E; border-radius:50%; display:grid; place-items:center; color:#7A552E; font-weight:700; letter-spacing:.18em; font-size:.7rem; background:rgba(255,255,255,.4); backdrop-filter:blur(2px) }
.ld-stamp span{ transform:rotate(-12deg) }

@media (max-width: 1000px){
  .love-details{ grid-template-columns:1fr; background:#D6E4E6; }
  .love-details .ld-right{ background:#F4E6C8; margin-top:16px; padding:32px 0 }
  .ld-cactus{ left:24px; bottom:12px }
}

/* === Footer Split (Connect / Info / Shop + Badge) === */
.footer-split{ background:var(--bg); border-top:1px solid var(--line) }
.footer-split .footer-grid{ display:grid; grid-template-columns: repeat(3, 1fr); align-items:start; gap:40px; padding:48px 0 }
.f-head{ margin:0 0 16px; font-family:"Bodoni Moda", serif; letter-spacing:.18em; text-transform:uppercase; color:#7A552E }
.f-list{ list-style:none; margin:0; padding:0; }
.f-list li{ margin:16px 0 }
.f-list a{ letter-spacing:.22em; text-transform:uppercase; font-weight:600; font-size:.92rem; color:#6B5C52; text-decoration:none }
.f-list a:hover{ color:#7A552E }
.f-badge{ display:flex; align-items:center; justify-content:center; }
.badge-svg{ width:220px; height:auto; }

/* Bottom bar */
.footer-bar{ background: color-mix(in srgb, var(--sage) 85%, white 15%); border-top:1px solid var(--line) }
.bar-inner{ padding:14px 0; text-align:center; letter-spacing:.22em; text-transform:uppercase; font-size:.82rem; color:#6B5C52 }
.bar-inner .brand{ color:#7A552E; font-weight:800 }
.bar-inner a{ color:#6B5C52; text-decoration:none }
.bar-inner a:hover{ color:#7A552E }

@media (max-width: 900px){
  .footer-split .footer-grid{ grid-template-columns:1fr 1fr; }
.footer-split .f-badge{ grid-column:1 / -1; }  /* spans full width on tablets */
}

/* === Instagram Band (above footer) === */
.insta-band{ background:#E8D98C; border-top:1px solid var(--line); }
.insta-wrap{ display:grid; grid-template-columns: 1.2fr 1fr 1.6fr auto; align-items:center; gap:26px; padding:36px 0 }
.insta-heading{ font-family:"Bodoni Moda", serif; letter-spacing:.12em; font-size:clamp(1.4rem,1rem + 1.8vw,2.2rem); color:#7A552E; text-align:center }

/* Plaque */
.insta-plaque{ background:#F8EED8; border:3px solid #6F5A3E; border-radius:18px; padding:18px 22px; box-shadow:0 8px 20px rgba(0,0,0,.08) }
.plaque-inner{ text-align:center; color:#6F5A3E }
.plaque-kicker{ font-weight:800; letter-spacing:.14em; font-size:.86rem }
.plaque-underline{ letter-spacing:.38em; text-decoration:underline; text-underline-offset:4px; margin:.2rem 0 .6rem }
.plaque-brand{ font-family:"Perandory Semicondensed", serif; font-weight:850; font-size:clamp(1.8rem,1rem + 2.2vw,2.4rem) }
.plaque-and{ font-family:"Bodoni Moda", serif; font-weight:700; font-size:1.1rem; margin:.2rem 0 }

/* Grid */
.insta-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:16px }
.insta-tile{ position:relative; display:block; background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden }
.insta-tile img{ width:100%; height:160px; object-fit:cover; display:block }
.insta-tile .play{ position:absolute; inset:auto auto 8px 8px; display:inline-flex; align-items:center; justify-content:center; width:36px; height:28px; background:#0008; color:#fff; font-weight:800; border-radius:6px; font-size:.88rem; }

/* Handle */
.insta-handle{ justify-self:end; letter-spacing:.22em; color:#6B5C52; font-weight:700 }

/* Responsive */
@media (max-width: 1080px){
  .insta-wrap{ grid-template-columns: 1fr; gap:18px; text-align:center }
  .insta-handle{ justify-self:center }
}

/* === Invite band (“YOU’RE INVITED”) === */
.invite{
  position:relative;
  background: #F1C9AC; /* soft peach base */
  background:
    radial-gradient(1200px 520px at 50% 15%, rgba(255,255,255,.25), transparent 60%),
    radial-gradient(420px 180px at 18% 30%, rgba(183,131,95,.22), transparent 60%),
    radial-gradient(420px 180px at 82% 68%, rgba(183,131,95,.22), transparent 60%),
    var(--peach);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding: 78px 0 86px;
  overflow:hidden;
}
.invite-inner{ text-align:center; }

.invite-hero{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin-bottom:18px;
}
.invite-word{
  font-family:"perandory semicondensed", serif;
  font-weight:800;
  letter-spacing:.18em;
  font-size: clamp(1.6rem, 1.1rem + 3.2vw, 3rem);
  color:#7A552E;
  text-transform:uppercase;
}
.invite-envelope{
  width:min(96px, 12vw);
  height:auto;
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.10));
}

.invite-copy{
  max-width:min(80ch, 92%);
  margin: 8px auto 28px;
  color:#6B5C52;
  line-height:1.65;
  font-size:1.05rem;
}

.invite-form{
  display:flex;
  gap:16px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}
.invite-form input[type="email"]{
  appearance:none;
  background:transparent;
  border:none;
  border-bottom:2px solid #7A552E;
  padding:14px 6px 10px;
  width:min(520px, 82vw);
  font-size:1.05rem;
  font-weight:600;
  letter-spacing:.28em;
  text-transform:uppercase;
  outline:none;
}
.invite-form input::placeholder{
  color:#7A552E;
  opacity:.9;
}
.invite-btn{
  display:inline-block;
  border:none;
  border-radius:999px;
  padding:16px 26px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  background:#E8DFC6;
  color:#2C251F;
  box-shadow:0 8px 20px rgba(0,0,0,.08);
  cursor:pointer;
}
.invite-btn:hover{ transform:translateY(-1px); }

@media (max-width: 560px){
  .invite-hero{ gap:12px; }
  .invite-word{ letter-spacing:.16em; }
  .invite-btn{ width:100%; max-width:300px; }
}

.love-details{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:0;
  background:linear-gradient(90deg, #D6E4E6 0 60%, #F4E6C8 60% 100%);
  padding: 72px 0;
}
.love-details .ld-left{ padding: 0 3vw; }
.love-details h2{
  font-family:"Bodoni Moda", serif;
  font-weight:800;
  font-size: 65px;
  line-height:1.16;
  color:#7A552E;
  margin:0 0 0px;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.love-details .muted{ color:#5e5a54; line-height:1.8; max-width:60ch; }
.ld-links{ margin-top:26px; display:flex; gap:40px; }
.ld-links a{ text-decoration:none; letter-spacing:.5em; font-weight:700; color:#7A552E; }
.ld-right{ position:relative; display:flex; align-items:center; justify-content:center; }
.ld-hero{ max-width:min(620px, 86%); height:auto; border-radius:6px; box-shadow:0 12px 38px rgba(0,0,0,.18); }
.ld-cactus{ position:absolute; left:-40px; bottom:8%; width:70px; opacity:.9; }
.ld-stamp{ position:absolute; right:2%; top:4%; font-size:.8rem; color:#6F4E37; border:2px dashed #6F4E37; border-radius:50%; padding:18px 12px; transform:rotate(-16deg); background:rgba(255,245,230,.6); }

@media (max-width: 900px){
  .love-details{ grid-template-columns: 1fr; background:#D6E4E6; }
  .ld-right{ order:-1; padding: 0 4vw 24px; }
  .love-details .ld-left{ padding: 0 6vw 12px; }
}

/* Moving banner ribbon */
.ribbon{ background:#e4deb8; border-top:1px solid #d0c7b5; border-bottom:1px solid #d0c7b5; overflow:hidden; }
.ribbon-track{
  display:flex; gap:40px; width:max-content; white-space:nowrap;
  font-weight:700; letter-spacing:.25em;
  padding:12px 0;
  animation:ribbon-scroll 28s linear infinite;
}
@keyframes ribbon-scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }


/* === Collage Billboard (under header) === */
.marquee{
  position:relative;
  min-height:72vh;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:color-mix(in srgb, var(--cream) 90%, white 10%);
  border-bottom:1px solid var(--line);
}
.marquee-inner{ text-align:center; position:relative; z-index:2; }
.marquee-kicker{
  display:flex; gap:26px; justify-content:center; align-items:center;
  font-weight:800; letter-spacing:.35em; color:#7A552E; margin-bottom:10px;
  font-size:.95rem; text-transform:uppercase;
}
.marquee-kicker span{ display:inline-block; }
.marquee-title{
  font-family:"Bodoni Moda", serif;
  font-weight:900;
  font-size: clamp(2.2rem, 1rem + 6vw, 5rem);
  line-height:1.02;
  letter-spacing:.02em;
  color:color-mix(in srgb, #7A552E 92%, black 8%);
  margin:0 0 18px;
  text-transform:uppercase;
}
.marquee-cta{ font-weight:800; padding:14px 24px; letter-spacing:.12em; }

/* floating decor images */
.marquee-decor{ position:absolute; z-index:1; filter: drop-shadow(0 12px 28px rgba(0,0,0,.14)); }
.marquee-decor img{ width:min(340px, 26vw); height:auto; border-radius:12px; border:1px solid var(--line); }
.marquee-decor.lt{ left:6%; top:10%; transform:rotate(-2deg); }
.marquee-decor.lb{ left:2%; bottom:6%; transform:rotate(-4deg); }
.marquee-decor.rt{ right:8%; top:8%; transform:rotate(1deg); }
.marquee-decor.rb{ right:10%; bottom:8%; transform:rotate(3deg); }

@media (max-width: 980px){
  .marquee{ min-height:64vh; }
  .marquee-decor img{ width:min(240px, 36vw); }
  .marquee-decor.lb{ display:none; }
  .marquee-decor.rb{ display:none; }
}

/* ===== Header (2-row style like screenshot) ===== */
.nav.nav-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 0;
}
.top-link{
  font-size:.92rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  text-decoration:underline;
  text-underline-offset:4px;
}
.top-right{ display:flex; align-items:center; gap:28px; }

/* Override old absolute-centering so title sits naturally in the middle */
.site-header .nav .site-title{
  position:static;
  left:auto; top:auto; transform:none;
  margin:0;
  pointer-events:auto;
  white-space:normal;
  font-family:"Bodoni Moda", serif;
  font-weight:900;
  letter-spacing:.06em;
  color:#7A552E;
  font-size:clamp(1.8rem, 1.2rem + 2.6vw, 3rem);
  text-transform:none;
  line-height:1.1;
}

/* Bottom nav bar look */
.subnav.subnav-main{
  display:flex;
  gap:46px;
  justify-content:center;
  padding:12px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.subnav.subnav-main a{
  font-size:.95rem;
  letter-spacing:.22em;
  text-transform:uppercase;
}

/* Small screen tweaks */
@media (max-width:640px){
  .nav.nav-top{ gap:10px; }
  .top-right{ gap:16px; }
  .subnav.subnav-main{ gap:24px; flex-wrap:wrap; }
}

/* === Shop Preview (3-up layout & spacing) === */
.shop-preview{ padding:48px 0 56px; 
  /* Soft multi-tone background using your theme colors */
  background:
    radial-gradient(1200px 520px at 20% 10%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(600px 260px at 80% 70%, color-mix(in srgb, var(--sage) 30%, transparent), transparent 60%),
    radial-gradient(520px 220px at 10% 80%, color-mix(in srgb, var(--butter) 28%, transparent), transparent 62%),
    linear-gradient(135deg, color-mix(in srgb, var(--cream) 92%, white 8%), color-mix(in srgb, var(--peach) 55%, var(--sage) 10%));
}
.shop-preview .grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 32px 36px; /* nicer card spacing */
  align-items: stretch;

  grid-template-columns: minmax(280px, 520px) !important;
  justify-content: center !important;
  justify-items: center !important;
}
.shop-preview .card{ height:100%; max-width:520px; }
.shop-preview .card-img{
  aspect-ratio: 4 / 3;
  overflow:hidden;
  border-radius:8px;
}
.shop-preview .card-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* responsive: 2 cols then 1 */
@media (max-width: 980px){
  .shop-preview .grid{ grid-template-columns: repeat(2, minmax(220px,1fr)); }
}
@media (max-width: 600px){
  .shop-preview .grid{ grid-template-columns: 1fr; }
}
/* kept for history: removed background override to show gradient */

/* give breathing room below the cards so the CTA never overlaps */
.shop-preview .grid{
  margin-bottom:28px;
}

/* center the CTA and neutralize any inherited positioning from .btn-soft */
.shop-preview .cta-center{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  margin-top:8px;
}
.shop-preview .cta-center .btn-soft{
  position:static !important;
  transform:none !important;
  margin:0 auto;
}




/* === Requested tweaks === */
/* Hide the mushroom/cactus in LOVE IS IN THE DETAILS */
.ld-cactus{ display:none !important; }

/* New & Noteworthy: prettier + interactive buttons */
.shop-preview .add-to-cart{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:.5em;
  border:2px solid #7A552E;
  background:linear-gradient(180deg,#FFFFFF 0%, #F8EED8 100%);
  font-weight:800;
  letter-spacing:.12em;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .2s ease;
  box-shadow:0 6px 14px rgba(0,0,0,.08);
}
.shop-preview .add-to-cart::before{
  content:"🛒";
  display:inline-block;
  transform:translateY(1px);
}
.shop-preview .add-to-cart::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(120deg, transparent 0, rgba(255,255,255,.55) 40%, transparent 80%);
  transform: translateX(-120%);
  pointer-events:none;
}
.shop-preview .add-to-cart:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.12); }
.shop-preview .add-to-cart:hover::after{ animation: btn-shine 800ms ease forwards; }
.shop-preview .add-to-cart:active{ transform:translateY(0); }

/* VIEW ALL: make it bolder and add arrow */
.shop-preview .cta-center .btn-soft{
  display:inline-flex; align-items:center; gap:10px;
  border:2px solid #7A552E;
  background:linear-gradient(180deg,#F9EBD4,#F1C9AC);
  font-weight:900; letter-spacing:.18em; text-transform:uppercase;
  box-shadow:0 8px 22px rgba(0,0,0,.12);
  padding:14px 22px;
  transition:transform .15s ease, box-shadow .2s ease;
}
.shop-preview .cta-center .btn-soft::after{
  content:"↗";
  font-size:1.1em;
}
.shop-preview .cta-center .btn-soft:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(0,0,0,.16);
}

/* Keyboard focus for accessibility */
.shop-preview .add-to-cart:focus-visible,
.shop-preview .cta-center .btn-soft:focus-visible{
  outline:3px solid #7A552E; outline-offset:2px;
  box-shadow:0 0 0 6px rgba(122,85,46,.15);
}

/* Button shine animation */
@keyframes btn-shine{ to{ transform: translateX(120%);} }


/* === Align NEW & NOTEWORTHY buttons to .btn-pill (Inquire) === */
.shop-preview .add-to-cart,
.shop-preview .cta-center .btn-soft{
  background: transparent !important;
  color: #7A552E !important;
  border: 2px solid #7A552E !important;
  border-radius: 999px !important;
  padding: 12px 18px !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-weight: 700 !important;
  font-size: .9rem !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color .2s ease, color .2s ease !important;
}

/* Remove previous icon/shine added earlier */
.shop-preview .add-to-cart::before,
.shop-preview .add-to-cart::after{
  content: none !important;
  background: none !important;
}

/* Hover/focus to mirror .btn-pill */
.shop-preview .add-to-cart:hover,
.shop-preview .cta-center .btn-soft:hover{
  background:#7A552E !important;
  color:#fff !important;
}

.shop-preview .add-to-cart:focus-visible,
.shop-preview .cta-center .btn-soft:focus-visible{
  outline: 2px solid #7A552E !important;
  outline-offset: 2px;
}


/* [PATCH 2025-09-17F] Insta handle link style */
.insta-handle{ text-decoration:none; }
.insta-handle:hover{ opacity:.8; }


/* === [PATCH 2025-09-17G] Force Insta tiles perfectly square by absolute-fill === */
.insta-grid .insta-tile{ aspect-ratio:1/1 !important; height:auto !important; position:relative; overflow:hidden; }
.insta-grid .insta-tile img{ position:absolute; inset:0; width:100% !important; height:100% !important; object-fit:cover !important; }
/* === End PATCH 2025-09-17G === */


/* === HOWDY hero (authors page) === */
.howdy-page{ --howdy-green:#7D8B6A; --howdy-brown:#6B5C52; --howdy-peach:#F1C9AC; }

/* Side decorative tiles (fixed, repeat vertically) */
.howdy-page::before,
.howdy-page::after{
  content:"";
  position:fixed;
  top:0; bottom:0;
  width:96px;
  pointer-events:none;
  z-index:0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Crect width='96' height='96' fill='none'/%3E%3Cpath d='M48 6 78 36 48 66 18 36 48 6z M48 30 60 42 48 54 36 42 48 30z' fill='%23F1C9AC' stroke='%237A552E' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: repeat-y;
  background-size: 96px 96px;
  opacity:.9;
}
.howdy-page::before{ left:0; }
.howdy-page::after{ right:0; }

/* Keep page content above the decorations */
.howdy-hero, .announce, footer{ position:relative; z-index:1; }

.howdy-hero{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  align-items:center;
  gap: clamp(18px, 2vw, 40px);
  padding: clamp(18px, 3vw, 36px) 0;
}
.howdy-left .howdy-photo{
  width:100%;
  height:auto;
  border-radius: 6px;
  box-shadow: 0 6px 24px rgba(0,0,0,.08);
  border:1px solid var(--line);
}
.howdy-right{ max-width: 54ch; }
.howdy-title{
  font-family:"Bodoni Moda", serif;
  font-weight:900;
  letter-spacing: 1mm;
  text-transform: uppercase;
  color: var(--howdy-green);
  font-size: clamp(50px,50px, 50px);
  font-size: 35px;
  line-height:1.02;
  margin: .2rem 0 .6rem;
}
.howdy-lede{
  margin: 0 0 .4rem;
  color: var(--howdy-brown);
  font-weight:700;
}
.howdy-copy{
  color: var(--muted);
  line-height:1.8;
  margin: 0 0 1.2rem;
}
.howdy-btn{
  display:inline-block;
  background: var(--howdy-peach);
  border: 2px solid #7A552E;
  color:#7A552E;
  padding: .95rem 1.4rem;
  border-radius: 999px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  box-shadow: 0 8px 20px rgba(0,0,0,.10);
}
.howdy-btn:hover{ transform: translateY(-1px); }
.howdy-btn:active{ transform:none; }

/* Responsive: single column with image on top */
@media (max-width: 940px){
  .howdy-hero{ grid-template-columns:1fr; }
  .howdy-right{ max-width: 62ch; }
}

/* Keep no horizontal scroll due to side motifs on tiny screens */
@media (max-width: 680px){
  .howdy-page::before, .howdy-page::after{ width:64px; background-size:64px 64px; }
}
/* ensure sticky/fixed header stays above everything */
.site-header{position:sticky;top:0;z-index:1000}


/* remove or override the old pointer-events:none on .site-title */
.site-title{
  pointer-events:auto;            /* ensure it’s clickable */
  text-decoration:none;           /* keep it looking like a heading */
  color: inherit;
  display:inline-block;
}



/* --- Howdy hero tweaks: image on right, larger visual weight --- */
.howdy-hero .howdy-photo{
  width: min(10%, 72px);
  max-width: none;
  display:block;
  margin-inline: auto;
}
@media (max-width: 900px){
  .howdy-hero .container{
    display:block !important;
  }
  .howdy-hero .howdy-photo{
    width: 100%;
  }
}


.howdy-hero .howdy-right{ 
  padding-left: clamp(32px,  96px);
}
.howdy-hero .howdy-photo{
  width: min(130%, 860px);
  height: auto;
  margin-left: auto;
}
@media (max-width: 900px){
  .howdy-hero .howdy-right{ padding-left: 0; }
  .howdy-hero .howdy-photo{ width: 100%; margin-left: 0; }
}

/* Utility: screen-reader only / invisible anchor */
.sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }


/* --- Revert howdy photo to original/normal size --- */
.howdy-hero .howdy-photo{
  width: min(100%, 400px) !important;
  max-width: 400px !important;
  height: auto !important;
}


/* ===== Index-only Howdy Section (scoped) ===== */
.index-howdy{
  padding-block: clamp(36px, 8vw, 96px);
}
.index-howdy .container{
  display: grid;
  grid-template-columns: 0.95fr 1.05fr; /* text | image */
  align-items: center;
  column-gap: clamp(24px, 3vw, 56px);
}
.index-howdy__left{ order: 1; }
.index-howdy__right{ order: 2; }

/* Typography inside (kept simple, independent from other howdy styles) */
.index-howdy__title{
  font-size: clamp(30px, 8vw, 112px);
  line-height: 0.95;
  font-size: 50px;
  font-weight: 200;
  letter-spacing: 0.1em;
  margin: 0 0 15px 0;
  text-transform: uppercase;
  color: #6F5A3E;
  
}
.index-howdy__lede{
  font-weight: 700;
  margin: 0 0 14px 0;
  color: #6F5A3E;
}
.index-howdy__copy{
  margin: 0 0 24px 0;
  color: color-mix(in srgb, var(--muted) 85%, transparent);
}
.index-howdy__btn{
  display: inline-block;
  padding: 14px 22px;
  border-radius: 28px;
  border: 2px solid currentColor;
  text-decoration: none;
  font-weight: 700;
}

/* Image sizing (original/neutral) */
.index-howdy__photo{
  width: min(100%, 600px);
  max-width: 600px;
  height: auto;
  display: block;
  margin-left: auto; /* keep image aligned to the right column's edge */
}

/* Responsive: stack on small screens */
@media (max-width: 900px){
  .index-howdy .container{
    display: block;
  }
  .index-howdy__photo{
    width: 100%;
    max-width: none;
    margin: 18px 0 0 0;
  }
}


/* --- Index Howdy: use Inter for body text (match LOVE DETAILS) --- */
.index-howdy, 
.index-howdy p, 
.index-howdy a, 
.index-howdy li, 
.index-howdy small, 
.index-howdy .index-howdy__lede, 
.index-howdy .index-howdy__copy {
  font-family:"Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}


/* --- Make index-howdy button behave like Rodeo .btn-pill --- */
.index-howdy__btn{
  background: transparent;
  border: 2px solid #7A552E;
  color: #7A552E;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: .06em;
  font-size: .9rem;
  transition: all .2s ease;
}
.index-howdy__btn:hover{
  background: #7A552E;
  color: #fff;
}
.index-howdy__btn:focus-visible{
  outline: 3px solid color-mix(in srgb, #7A552E 30%, white);
  outline-offset: 3px;
}

/* Match the Rodeo split paragraph typography */
.index-howdy__copy{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; /* same family */
  font-size: 1rem;        /* same default size */
  line-height: 1.6;       /* comfortable body copy */
  letter-spacing: normal; /* avoid headline spacing */
  font-weight: 400;       /* normal body weight */
  text-transform: none;
}
#howdy-hero{
  background: linear-gradient(180deg, var(--sage) 0%, var(--cream) 45%, var(--peach) 100%);
}











/*
@font-face{
  font-family:"Perandory SemiCondensed";
  src:url("assets/fonts/Perandory-SemiCondensed.woff2") format("woff2");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}
*/

:root{
  --title-font-stack: "Perandory SemiCondensed","Bodoni Moda",ui-serif,Georgia,"Times New Roman",serif;
}

/* Site title (center wordmark) */
html body .site-title{
  font-family: var(--title-font-stack) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
}

/* Global headings */
html body h1,
html body h2,
html body h3,
html body h4{
  font-family: var(--title-font-stack) !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
}

/* Hero headings */
html body .hero h1,
html body .hero h2{
  font-family: var(--title-font-stack) !important;
  letter-spacing: .14em !important;
}

/* Marquee big title (if used) */
html body .marquee-title{
  font-family: var(--title-font-stack) !important;
  letter-spacing: .16em !important;
}

/* Shop hero title */
html body .shop-hero-banner__title{
  font-family: var(--title-font-stack) !important;
  letter-spacing: .16em !important;
}
/* === END PATCH === */



/* === GPT PATCH: Embed Perandory SemiCondensed font (OTF) === */
@font-face{
  font-family: "Perandory SemiCondensed";
  src:
    local("Perandory SemiCondensed"),
    url("assets/fonts/Perandory-SemiCondensed.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
/* === END PATCH === */

/* === Mobile tap-target sizing & accessibility tweaks === */
@media (max-width: 640px){
  .qty button,
  .btn,
  .btn-outline,
  .btn-small,
  .btn-soft,
  .btn-pill,
  .checkout-link,
  .top-link,
  .subnav a {
    min-width: 44px;
    min-height: 44px;
  }
}
/* --- Insta band tweaks (remove plaque + left-align heading) --- */
.insta-plaque{ display:none !important; }

/* With plaque removed, use 3 columns: [heading | grid | handle] */
.insta-wrap{
  grid-template-columns: 1fr 1.6fr auto !important;
}

/* Move the heading to the left */
.insta-heading{
  text-align: left !important;
  justify-self: start !important;
}
@media (max-width: 1080px){
  .insta-heading{ text-align:left !important; }
}
/* === 1) HERO / MARQUEE: prevent overlap === */
@media (max-width: 900px){
  /* Let the hero breathe and avoid fixed heights */
  .marquee{
    min-height: auto !important;
    padding: 56px 0 36px !important;
  }
  /* Hide floating side photos that collide with the headline on small screens */
  .marquee-decor{ display: none !important; }
  .marquee-inner{ z-index: 2; position: relative; }
}

/* Optional: nudge decor farther out on larger screens to reduce crowding */
@media (min-width: 901px){
  .marquee-decor img{ width: min(220px, 22vw) !important; }
  .marquee-decor.lt{ left: 3% !important; top: 10% !important; }
  .marquee-decor.rt{ right: 4% !important; top: 8% !important; }
}

/* === 2) “HOWDY / INTRO” band: put text on top, image below on mobile === */
@media (max-width: 900px){
  .index-howdy .container{
    grid-template-columns: 1fr !important;
    row-gap: 18px !important;
  }
  /* text first, image second */
  .index-howdy__right{ order: 1 !important; }
  .index-howdy__left{  order: 2 !important; }

  /* make the image scale nicely */
  .index-howdy img,
  .howdy-hero .howdy-photo{
    width: 100% !important;
    max-width: 480px !important;
    height: auto !important;
    margin: 0 auto !important;
  }
}

/* === 3) Header title safety: never overlap nav on small screens === */
@media (max-width: 900px){
  .site-title{
    position: static !important;
    transform: none !important;
    white-space: normal !important;
    text-align: center !important; /* or left if you prefer */
    pointer-events: auto !important;
  }
}

/* === 4) General image safety: prevent overflow into text === */
img{ max-width: 100%; height: auto; }
/* === MOBILE FOOTER / INSTA FIXES === */
@media (max-width: 768px){

  /* Stack the Insta band instead of tight columns */
  .insta-wrap{
    grid-template-columns: 1fr !important;
    row-gap: 16px !important;
    align-items: start !important;
  }

  /* Make the "FOLLOW US FOR UPDATES" readable and left-aligned */
  .insta-heading{
    text-align: left !important;
    font-size: 1.25rem !important;   /* smaller on phones */
    letter-spacing: .12em !important; /* less spread so it doesn't break every letter */
    line-height: 1.2 !important;
    max-width: none !important;
  }

  /* Two-wide Insta grid on mobile (was 4) */
  .insta-grid{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  /* Put the handle under the grid and align left */
  .insta-handle{
    justify-self: start !important;
  }

  /* Footer columns: 2-up on phones with comfy spacing */
  .footer-grid{
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
  }
  /* Badge logo centered below the lists */
  .f-badge{
    grid-column: 1 / -1 !important;
    justify-content: center !important;
  }
}

/* (Optional) if screens are super narrow, just hide the long heading */
@media (max-width: 360px){
  .insta-heading{ display:none !important; }
}

/* Tablet: keep slim decor + add safe gutters */
@media (max-width: 900px){
  .howdy-page{ padding-left: 64px; padding-right: 64px; }
  .howdy-page::before,
  .howdy-page::after{
    width: 64px;
    background-size: 64px 64px;
  }
}
/* Very small phones */
@media (max-width: 480px){
  .howdy-page{ padding-left: 44px; padding-right: 44px; }
  .howdy-page::before,
  .howdy-page::after{
    width: 44px;
    background-size: 44px 44px;
  }
}
/* Footer: mobile/tablet layout like the reference */
.footer-split .footer-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  align-items: start;
}

@media (max-width: 900px){
  .footer-split .footer-grid{
    grid-template-columns: 1fr 1fr;      /* two columns on tablets */
    text-align: center;
  }
  .footer-split .f-badge{ grid-column: 1 / -1; }
}

@media (max-width: 680px){
  .footer-split .footer-grid{
    grid-template-columns: 1fr;          /* single column on phones */
    text-align: center;
    gap: 18px;
  }

  /* stack the SHOP list and logo vertically, centered */
  .f-col--shop .shop-wrap{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  .f-col--shop .footer-logo{
    position: static !important;         /* cancel any absolute rules */
    right: auto; top: auto;
    margin: 6px auto 0;
  }

  .f-col .f-head{ margin-bottom: 6px; }
  .f-list li{ margin: 8px 0; }
}

/* optional: add the trailing “.” style like the reference */
.f-head{ text-transform: uppercase; letter-spacing: .18em; }
.f-head::after{ content: "."; }
@media (max-width: 680px){
  .f-col--shop .footer-logo{ display: none; }
}
/* keep the SHOP column neat + stacked */
.f-col--shop .shop-wrap{
  display: flex;
  flex-direction: row;
  align-items: center;   /* use flex-start if you prefer left aligned */
  gap: 12px;
}

.f-col--shop .footer-logo{
  position: static !important;  /* cancels old absolute positioning */
  margin: 6px auto 0;           /* centers under BOOKS */
}

/* SHOP column: keep logo within the flow, aligned to the left */
.f-col--shop .shop-wrap {
  display: flex; /* Logo and List/Heading wrapper are now side-by-side */
  flex-direction: row;
  align-items: flex-start; /* Aligns items to the top */
  gap: 20px; /* Add some space between the logo and the content */
}

.f-col--shop .footer-logo {
  position: static !important;
  margin: 0; /* Reset margin */
  order: 2; /* Put the logo on the right side of the list/heading */
}
.f-col--shop .footer-logo img {
  width: 100px; /* Adjust size if needed for better fit */
}

/* Ensure the list wrapper is aligned to the top and first */
.f-col--shop .list-wrap {
  order: 1; /* Put the list/heading on the left side */
  /* Remove any conflicting align-items rules */
}

/* For the links to line up under the heading */
.footer-split .f-head {
  text-align: left; /* Ensure the heading is left-aligned */
  margin: 0 0 6px;
}
.f-list {
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: left; /* Ensure the list is left-aligned */
}
/* Footer: keep logo beside the Books list on desktop */
.footer-split .f-col--shop .shop-wrap{
  display: flex;
  flex-direction: row;      /* was column */
  align-items: flex-start;
  gap: 16px;
}
.footer-split .f-col--shop .list-wrap{ flex: 1; }
.footer-split .f-col--shop .footer-logo img{
  width: 120px; height: auto;
}

/* On phones, stack them again */
@media (max-width: 680px){
  .footer-split .f-col--shop .shop-wrap{
    flex-direction: column;
    align-items: center;
  }
}


/* === Mobile header drawer === */
.menu{ display:none; background:transparent; border:1px solid var(--line);
       border-radius:999px; padding:8px 14px; letter-spacing:.22em;
       text-transform:uppercase; font-weight:800; }

/* Drawer + overlay */
.m-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.35);
  opacity:0; pointer-events:none; transition:.25s; z-index:998; }
.m-overlay.show{ opacity:1; pointer-events:auto; }

.m-drawer{ position:fixed; inset:0 0 0 auto; width:100%;
  max-width:100%; height:100dvh; background:var(--cream);
  border-left:1px solid var(--line); transform:translateX(100%);
  transition:transform .28s ease; z-index:999; display:flex; flex-direction:column; }
.m-drawer.show{ transform:none; }

/* drawer header */
.m-head{ display:flex; align-items:center; justify-content:space-between;
  padding:18px; border-bottom:1px solid var(--line); }
.m-brand{ font-family:"Bodoni Moda", serif; font-weight:900; letter-spacing:.06em; color:#7A552E; font-size:1.4rem; }
.m-close{ border:none; background:transparent; font-size:34px; line-height:1; cursor:pointer; color:#7A552E; }

/* centered links like the screenshot */
.m-nav{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; }
.m-nav a{ font-family:"Bodoni Moda", serif; font-weight:900; letter-spacing:.22em;
  text-transform:uppercase; font-size:clamp(1.1rem, 2.8vw, 2rem); color:#7A552E; text-decoration:none; }
.m-nav a:hover{ opacity:.9; }

.m-search{ text-align:center; padding:22px 0 32px; letter-spacing:.28em; text-transform:uppercase; display:block; color:#7A552E; text-decoration:underline; text-underline-offset:4px; }

/* Prevent background scroll when open */
:root.no-scroll, :root.no-scroll body{ overflow:hidden; }

/* Show button / hide desktop subnav on small screens */
@media (max-width: 900px){
  .menu{ display:inline-block; }
  .subnav.subnav-main{ display:none; }
}
/* Hide search on phones/tablets */
@media (max-width: 1024px), (hover: none) and (pointer: coarse) {
  /* Drawer search link */
  .m-drawer .m-search { display: none !important; }

  /* Any header search controls you might have */
  header .search,
  header .search-btn,
  header .header-search,
  header .nav-top .search-link {
    display: none !important;
  }
}
/* Hide all search entry points on phones/tablets */
@media (max-width: 1024px), (hover: none) and (pointer: coarse) {
  /* Header search text link */
  .nav.nav-top .search-link { 
    display: none !important; 
  }

  /* Drawer search item */
  .m-drawer .m-search { 
    display: none !important; 
  }
}
/* Main nav hover underline (site-wide) */
.subnav-main a{
  position: relative;
  text-decoration: none;
}
.subnav-main a::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;      /* distance below the text */
  height: 2px;       /* line thickness */
  width: 0;
  margin: 0 auto;    /* centers the line */
  background: #7A552E;
  transition: width .25s ease;
}
.subnav-main a:hover::after,
.subnav-main a:focus-visible::after{
  width: 100%;
}
/* Two-line hamburger icon (mobile only) */
@media (max-width: 900px){
  .menu.menu-icon{
    width: 36px; height: 28px; padding: 0; border: none; background: transparent;
    position: relative; display: inline-flex; align-items: center; justify-content: center;
  }
  .menu.menu-icon span,
  .menu.menu-icon::before,
  .menu.menu-icon::after{
    content: ""; position: absolute; left: 6px; right: 6px; height: 2px; background: #7A552E;
    transition: transform .25s ease, opacity .2s ease, top .25s ease, bottom .25s ease;
  }
  /* two parallel lines (top/bottom) */
  .menu.menu-icon::before{ top: 8px; }
  .menu.menu-icon::after{  bottom: 8px; }
  /* center line is hidden; we keep the span for animation symmetry */
  .menu.menu-icon span{ opacity: 0; }

  /* When menu is open (aria-expanded=true), turn into an X */
  .menu.menu-icon[aria-expanded="true"]::before{
    top: 50%; transform: translateY(-50%) rotate(45deg);
  }
  .menu.menu-icon[aria-expanded="true"]::after{
    bottom: auto; top: 50%; transform: translateY(-50%) rotate(-45deg);
  }
}
/* Ensure mobile drawer overlays the sticky header */
.m-overlay { z-index: 1100 !important; }
.m-drawer  { z-index: 1101 !important; }
/* === Mobile footer: stack columns + center like the reference === */
@media (max-width: 900px){
  /* one column instead of 2 */
  .footer-split .footer-grid{
    grid-template-columns: 1fr !important;
    row-gap: 28px;
    text-align: center;
  }

  /* tidy each column */
  .footer-split .f-col{ display: grid; justify-items: center; }
  .footer-split .f-head{ margin-bottom: 10px; letter-spacing: .22em; }

  /* links as a neat vertical list */
  .footer-split .f-list{ display: grid; gap: 10px; }
  .footer-split .f-list a{ display: inline-block; }

  /* Shop column: put logo and list on separate rows and center both */
  .footer-split .f-col--shop .shop-wrap{
    display: grid;
    justify-items: center;
    gap: 12px;
  }
  .footer-split .f-col--shop .footer-logo img{
    max-width: 160px;
    height: auto;
  }
}
/* Contact page: hide the small badge above the heading on phones */
@media (max-width: 900px){
  body.contact-like .contact-intro .badge { 
    display: none !important; 
  }
  /* tighten spacing now that the badge is gone (optional) */
  body.contact-like .contact-intro h1 { 
    margin-top: 0 !important; 
  }
}
/* Footer: on phones, show the logo above the lists in the SHOP column */
@media (max-width: 900px){
  .footer-split .f-col--shop .shop-wrap{
    display: flex !important;
    flex-direction: column !important;   /* stack */
    align-items: center !important;      /* center both */
    gap: 12px;
  }
  .footer-split .f-col--shop .footer-logo{
    order: -1 !important;                /* move logo above lists */
    position: static !important;         /* kill any old absolute rules */
    margin: 0 0 8px 0;
  }
  .footer-split .f-col--shop .footer-logo img{
    max-width: 160px;
    height: auto;
  }
}
/* Footer list centering (fix index misalignment on phones) */
.footer-split .f-list{
  list-style: none;
  margin: 0;
  padding-left: 0 !important;  /* kill default UL indent */
  text-align: center !important;
}
@media (max-width: 900px){
  .footer-split .footer-grid{ text-align: center; }
  .footer-split .f-col,
  .footer-split .f-col .list-wrap{
    display: grid;               /* gives us a centering context */
    justify-items: center;       /* center the list block itself */
  }
}

/* === PC Footer Alignment Fix (override only) === */
@media (min-width: 901px){
  /* 3 even columns, top-aligned, left text */
  .footer-split .footer-grid{
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 40px !important;
    align-items: start !important;
  }
  .footer-split .f-head,
  .footer-split .f-list{
    text-align: left !important;
  }

  /* SHOP column: list on left, logo on right, aligned to top */
  .f-col--shop .shop-wrap{
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 18px !important;
  }
  .f-col--shop .list-wrap{
    flex: 1 1 auto !important;
  }
  .f-col--shop .footer-logo{
    position: static !important;
    margin: 0 !important;
    transform: none !important;
    align-self: flex-start !important;
    display: block !important;
  }
  .f-col--shop .footer-logo img{
    width: 140px !important;
    height: auto !important;
  }

  /* Tighter list spacing so headings + items visually line up */
  .footer-split .f-list li{
    margin: 10px 0 !important;
  }
}

/* === IG-style definition card under "THE WOMAN BEHIND THE NAME" === */
.aq-card{
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.01em;
  text-align: center;
  max-width: 32ch;
  margin: 12px auto 0;
  color: var(--ink);
}
.ld-left h2{ text-align:center; }

.aq-term{ margin: 0 0 4px; }
.aq-term .pos{
  font-weight: 400;
  opacity: 0.8;
  margin-left: 6px;
}
.aq-pron{
  margin: 0 0 14px;
  opacity: 0.85;
}

.aq-section{
  font-weight: 600;
  text-transform: none;
  margin: 12px 0 6px;
}

.aq-list{
  list-style: decimal;
  padding: 0;
  margin: 10px auto 14px;
  display: inline-block;          /* keeps numbers aligned while text stays centered */
  text-align: left;               /* classic dictionary feel for the lines themselves */
  max-width: 32ch;
}
.aq-list li{ margin: 6px 0; }

.aq-note{ margin: 12px 0 8px; }
.aq-src{
  margin: 0;
  opacity: 0.75;
  font-style: italic;
}

/* smaller on phones, same look */
@media (max-width: 600px){
  .aq-card{ font-size: 14px; max-width: 30ch; }
}
/* === Wider IG-style card + normal paragraph body === */

/* Widen the dictionary-style block */
.aq-card{
  max-width: 44ch;                 /* was 32ch */
  font-size: 16px;                 /* a touch larger */
  line-height: 1.85;
  margin: 12px auto 0;
  text-align: center;
}
.aq-list{ max-width: 44ch; }

/* Make it a bit wider on larger screens to match the screenshot */
@media (min-width: 900px){
  .aq-card{ max-width: 48ch; font-size: 17px; line-height: 1.9; }
  .aq-list{ max-width: 48ch; }
}

/* Regular paragraph look for the lower part */
.aq-note,
.aq-src{
  font-family: ui-serif, Georgia, "Times New Roman", serif; /* back to your site’s serif */
  font-size: clamp(16px, 1.6vw, 18px);
  line-height: 1.85;
  letter-spacing: normal;
  text-align: center;              /* center under the heading; switch to left if you prefer */
  max-width: 62ch;                 /* comfortable reading width for a normal paragraph */
  margin: 18px auto 0;
  color: var(--ink);
}
.aq-src{ opacity: 0.8; margin-top: 8px; }
/* Center the two numbered points like the IG slide */
.aq-card{
  max-width: 46ch;              /* narrow “card” */
  margin: 0 auto;               /* centers the whole block */
  text-align: center;           /* headings/etymology centered */
}
.aq-list{
  max-width: 46ch;              /* same width as card */
  margin: 10px auto 16px;       /* centers the list block */
  list-style: decimal;
  text-align: left;             /* BUT keep lines themselves left, classic dictionary feel */
  padding-left: 1.4em;          /* room for numbers */
  line-height: 1.9;
}

/* Make the paragraph under it a regular left-aligned paragraph on desktop */
@media (min-width: 900px){
  .aq-note,
  .aq-src{
    font-family: ui-serif, Georgia, "Times New Roman", serif;
    max-width: 62ch;            /* comfortable reading width */
    margin: 22px 0 0;           /* use the column’s left edge, not centered */
    text-align: left;
    line-height: 1.85;
    letter-spacing: normal;
  }
  .aq-src{ opacity: .8; margin-top: 8px; font-style: italic; }
}

/* On phones, keep the lower paragraph centered for balance */
@media (max-width: 899px){
  .aq-note,
  .aq-src{
    max-width: 62ch;
    margin: 18px auto 0;
    text-align: center;
  }
}

/* === Muted tone for the definition block and the paragraphs === */
.aq-card,
.aq-card p,
.aq-card .aq-list li,
.aq-note,
.aq-src{
  color: var(--ink) !important;      /* uses your palette: #6c5f57 */
  opacity: 0.90;                       /* slight softening */
}

/* Keep key bits a touch clearer if you want */
.aq-term strong,
.aq-section{
  color: var(--ink) !important;        /* headings/term slightly darker for hierarchy */
  opacity: 0.95;
}

/* Links inside stay muted too, but with underline for accessibility */
.aq-card a,
.aq-note a,
.aq-src a{
  color: var(--ink) !important;
  text-decoration: underline;
}
/* === Make the ABOUT text match the hero style === */

/* Lower paragraph + source: same vibe as hero paragraph */
.aq-note,
.aq-src{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; /* same family */
  font-size: 1rem;        /* same default size */
  line-height: 1.6;       /* comfortable body copy */
  letter-spacing: normal; /* avoid headline spacing */
  font-weight: 400;       /* normal body weight */
  text-transform: none;

 
}
.aq-src{ opacity: 0.9; font-style: italic; margin-top: 8px; }

/* If you want the definition/list to match the hero too (not typewriter look),
   uncomment these and they'll take the same body style as well. */

.aq-card,
.aq-card p,
.aq-card .aq-list li{
  font-family: ui-serif, Georgia, "Times New Roman", serif;
  color: var(--ink) !important;
  font-weight: 100;
  font-size: 15px;
  text-align: center;
}