/*
Theme Name:   AskHole
Theme URI:    https://askhole.com.au
Description:  Astra child theme for AskHole — brand tokens, typography, logo/highlight/reward treatments.
Author:       AskHole
Template:     astra
Version:      0.3.3
Text Domain:  askhole
*/

/* ============================================================
   AskHole brand tokens  (from askhole-brand-library.html :root)
   ============================================================ */
:root{
  --purple:#783FF2;
  --purple-dark:#5b2fd0;
  --yellow:#FFD100;
  --ink:#0D1117;
  --offwhite:#F7F7F9;
  --cream:#F3EDE4;
  --green:#1B9C5B;            /* rewards are ALWAYS green */
  --reward-bg:#eafaf1;        /* reward pill background */
  --reward-border:#cdeedd;    /* reward pill border */
  --f-logo:'Kalam','Comic Sans MS',cursive;
  --f-display:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --f-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --f-hand:'Caveat',cursive;
  /* brush underline (exact path from the brand library, purple) */
  --brush:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 40' fill='%23783FF2'%3E%3Cpath d='M9 28 C 34 11, 95 6, 152 9 C 180 10, 202 13, 214 17 C 203 21, 178 19, 150 19 C 92 19, 40 25, 9 28 Z'/%3E%3C/svg%3E");
}

/* ============================================================
   Base typography — Inter everywhere; headings Inter ExtraBold
   ============================================================ */
body{font-family:var(--f-body);color:var(--ink);line-height:1.6;}
h1,h2,h3,h4,h5,h6,
.entry-title,.site-title,.ast-single-post .entry-title{
  font-family:var(--f-display);font-weight:800;letter-spacing:-.4px;color:var(--ink);
}
a{color:var(--purple);}
a:hover,a:focus{color:var(--purple-dark);}

/* ============================================================
   Buttons / CTAs — Inter Bold on brand purple
   ============================================================ */
.wp-block-button__link,.ast-button,.button,button,
input[type="submit"],input[type="button"],.ast-custom-button{
  font-family:var(--f-display);font-weight:700;letter-spacing:0;
  background:var(--purple);border:2px solid var(--purple);color:#fff;border-radius:12px;
}
.wp-block-button__link:hover,.button:hover,button:hover,
input[type="submit"]:hover,input[type="button"]:hover{
  background:var(--purple-dark);border-color:var(--purple-dark);color:#fff;
}
/* Secondary — mirrors brand library .btn.secondary (white, ink text, grey border) */
.btn-ghost,.is-style-outline .wp-block-button__link{
  background:#fff;color:var(--ink);border:2px solid #e2e2ea;
}
.btn-ghost:hover,.is-style-outline .wp-block-button__link:hover{
  background:#fff;color:var(--ink);border-color:#d0d0da;
}

/* ============================================================
   Logo lockup:  <span class="askhole-logo"><span class="ask">ask</span><span class="hole">hole</span></span>
   Matches brand library .logo (align-items:baseline; underline sits below the baseline)
   ============================================================ */
.askhole-logo{
  font-family:var(--f-logo);font-weight:700;font-size:52px;line-height:1;
  display:inline-flex;align-items:baseline;letter-spacing:.01em;
}
.askhole-logo .ask{color:var(--ink);}
.askhole-logo .hole{color:var(--purple);position:relative;margin-left:.20em;padding-bottom:.12em;} /* 0.20em deliberate split */
.askhole-logo .hole::after{
  content:"";position:absolute;left:-.12em;right:-.19em;bottom:-.17em;height:.46em;
  background:var(--brush) center/100% 100% no-repeat;
}

/* ============================================================
   Tagline + purple underline highlight (Kalam Bold, ~1.3x, purple)
   You ask. We <span class="u">get it</span><span class="dot">.</span>
   ============================================================ */
.askhole-tagline{font-family:var(--f-display);font-weight:800;letter-spacing:-.4px;color:var(--ink);}
.askhole-tagline .u{
  font-family:var(--f-logo);font-weight:700;font-size:1.3em;line-height:1;color:var(--purple);
  position:relative;padding:0 2px 4px;
}
.askhole-tagline .u::after{
  content:"";position:absolute;left:-.10em;right:-.20em;bottom:-.12em;height:.44em;
  background:var(--brush) center/100% 100% no-repeat;
}
/* full stop takes purple Kalam ONLY when it immediately follows a highlighted word */
.askhole-tagline .dot{font-family:var(--f-logo);font-weight:700;font-size:1.3em;color:var(--purple);}

/* ============================================================
   Reward / price callouts — Caveat green ON a light-green pill
   Matches brand library .rBadge (background + border + radius + padding)
   ============================================================ */
.askhole-reward,.reward{
  display:inline-block;font-family:var(--f-hand);font-weight:700;letter-spacing:.5px;
  color:var(--green);background:var(--reward-bg);border:1px solid var(--reward-border);
  border-radius:10px;padding:6px 16px;font-size:26px;
}
/* Handwritten sticky-note annotations (purple) */
.askhole-hand{font-family:var(--f-hand);font-weight:700;color:var(--purple);font-size:1.35em;}

/* Background helpers */
.bg-cream{background:var(--cream);}
.bg-offwhite{background:var(--offwhite);}

/* ============================================================
   Header logo — the logo IS the "askhole" wordmark
   ============================================================ */
/* Hide the redundant text site title (kept accessible for screen readers) */
.ast-site-identity .site-title{
	position:absolute !important;
	width:1px;height:1px;overflow:hidden;
	clip:rect(1px,1px,1px,1px);white-space:nowrap;
}
/* Size the logo sensibly in the header */
.ast-site-identity .custom-logo{max-height:54px;width:auto;}