/* ==========================================================================
   Raindrop Ventures — Homepage
   Design tokens are lifted verbatim from design-system-tokens/ in the handoff.
   ========================================================================== */

/* --- Tokens: colors ------------------------------------------------------ */
:root{
  /* base — vintage California sunrise hat */
  --canvas-cream:#F3EBDA;
  --pacific-cobalt:#2B5FAE;
  --sunrise-vermillion:#E0512D; /* agency-era history — retired from Ventures usage */
  --ink-navy:#1A2E52;
  --golden-hour:#E8A33C;
  --agency-teal:#2E9BA8; /* reference only: Raindrop Agency drop color */
  /* derived tints */
  --cream-2:#EAE0C9;
  --cream-3:#E1D5B9;
  --cobalt-tint:#DCE5F2;
  --vermillion-tint:#F7DCD2;
  /* semantic */
  --bg-page:var(--canvas-cream);
  --bg-dark:var(--pacific-cobalt);
  --surface-card:var(--canvas-cream);
  --text-body:var(--ink-navy);
  --text-muted:color-mix(in oklab,var(--ink-navy) 62%,var(--canvas-cream));
  --text-inverse:var(--canvas-cream);
  --accent-cta:var(--golden-hour);
  --accent-rare:var(--pacific-cobalt);
  --border-patch:var(--pacific-cobalt);
  --link:var(--pacific-cobalt);
  --link-hover:var(--golden-hour);
}

/* --- Tokens: typography -------------------------------------------------- */
:root{
  --font-display:"Helvetica Neue",Helvetica,Arial,sans-serif; /* client override of Fraunces */
  --font-body:"Archivo",Helvetica,Arial,sans-serif;
  --font-script:"Yellowtail",cursive;
  --font-wordmark:"Archivo Black",sans-serif;   /* SUB for Santral Bold (logo only) */
  --font-condensed:"Oswald",sans-serif;         /* SUB for Owners XNarrow Black */
  --text-display-xl:clamp(44px,6vw,72px);
  --text-display:38px;
  --text-h2:28px;
  --text-h3:20px;
  --text-body-size:16px;
  --text-small:13px;
  --text-label:12px;
  --track-label:.16em;
  --track-wordmark:-.02em;
  --leading-display:1.05;
  --leading-body:1.55;
}

/* --- Tokens: spacing, radii, shadows, motion ----------------------------- */
:root{
  --space-1:4px;  --space-2:8px;  --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px;
  --radius-patch:10px;
  --radius-control:8px;
  --radius-pill:999px;
  --border-patch-w:2px;
  --shadow-patch:5px 5px 0 var(--pacific-cobalt);
  --shadow-patch-sm:3px 3px 0 var(--pacific-cobalt);
  --ease-brand:cubic-bezier(.33,1,.68,1);
  --nav-h:84px;
}

/* --- Base ---------------------------------------------------------------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg-page);
  color:var(--text-body);
  font-family:var(--font-body);
  font-size:var(--text-body-size);
  line-height:var(--leading-body);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,p,blockquote,figure{margin:0}
img{max-width:100%}
a{color:var(--link);text-decoration:none;transition:color .15s var(--ease-brand)}
a:hover{color:var(--link-hover)}

.wrap{max-width:1440px;margin:0 auto;padding-left:var(--space-9);padding-right:var(--space-9)}

.display{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.06;
  letter-spacing:-.03em;
  text-wrap:balance;
}
.label{
  font-family:var(--font-condensed);
  font-weight:600;
  font-size:var(--text-label);
  letter-spacing:var(--track-label);
  text-transform:uppercase;
  color:var(--pacific-cobalt);
}
.label-gold{color:var(--golden-hour)}
.prose p{margin-bottom:var(--space-5);max-width:56ch;text-wrap:pretty}
.prose p:last-child{margin-bottom:0}
.h2{font-size:clamp(34px,3.4vw,50px)}
.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* --- Components: Button -------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-body);font-weight:600;
  text-transform:uppercase;letter-spacing:.06em;
  border:2px solid var(--ink-navy);
  border-radius:var(--radius-control);
  box-shadow:3px 3px 0 var(--ink-navy);
  padding:13px 24px;font-size:13px;
  cursor:pointer;white-space:nowrap;
  transition:background-color .15s var(--ease-brand),color .15s var(--ease-brand),
             box-shadow .15s var(--ease-brand),transform .15s var(--ease-brand);
}
.btn--primary{background:var(--golden-hour);color:var(--ink-navy)}
.btn--secondary{background:transparent;color:var(--ink-navy)}
.btn:hover{background:var(--golden-hour);color:var(--ink-navy)}
.btn:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--ink-navy)}
.btn:focus-visible{outline:3px solid var(--pacific-cobalt);outline-offset:3px}
.btn--lg{padding:16px 30px;font-size:14px}
.btn--sm{padding:10px 22px;font-size:12px;border-radius:var(--radius-pill)}

/* --- Components: PatchCard ----------------------------------------------- */
.patch{
  background:var(--surface-card);
  border:var(--border-patch-w) solid var(--border-patch);
  border-radius:var(--radius-patch);
  box-shadow:var(--shadow-patch);
  padding:var(--space-5);
}
.patch--cobalt{
  background:var(--pacific-cobalt);
  border-color:var(--ink-navy);
  box-shadow:5px 5px 0 var(--ink-navy);
  color:var(--canvas-cream);
}
.pcard{transition:box-shadow .15s var(--ease-brand),transform .15s var(--ease-brand)}
.pcard:hover{box-shadow:2px 2px 0 var(--pacific-cobalt);transform:translate(3px,3px)}

/* --- Components: Badge --------------------------------------------------- */
.badge{
  display:inline-block;
  font-family:var(--font-condensed);font-weight:600;
  font-size:11px;text-transform:uppercase;letter-spacing:var(--track-label);
  padding:4px 12px;border-radius:var(--radius-pill);
  border:2px solid transparent;line-height:1.4;
}
.badge--gold{background:var(--golden-hour);color:var(--ink-navy)}
.badge--cobalt{background:var(--pacific-cobalt);color:var(--canvas-cream)}
.badge--outline{background:transparent;color:var(--ink-navy);border-color:var(--ink-navy)}

/* --- Nav ----------------------------------------------------------------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:var(--canvas-cream);
  border-bottom:1px solid var(--ink-navy);
}
.nav__inner{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h)}
.logo{display:block;line-height:1}
.logo__mark{
  font-family:var(--font-wordmark);font-size:25px;
  letter-spacing:var(--track-wordmark);color:var(--ink-navy);
  display:flex;align-items:center;
}
.logo__mark img{margin:0 1px;display:block}
.logo__sub{
  font-family:var(--font-condensed);font-weight:600;font-size:10px;
  letter-spacing:.42em;color:var(--pacific-cobalt);margin-top:4px;
}
.nav__right{display:flex;align-items:center;gap:var(--space-7)}
.nav__links{display:flex;align-items:center;gap:var(--space-6)}
.navlink{
  font-family:var(--font-body);font-weight:600;font-size:13px;
  letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-navy);white-space:nowrap;
}
.navlink:hover{color:var(--golden-hour)}

/* --- Hero ---------------------------------------------------------------- */
.hero{position:relative;overflow:hidden}
.hero__inner{position:relative;padding-top:120px;padding-bottom:104px}
svg.hero-sun{display:block;height:auto}
.hero-sun{position:absolute;right:-104px;top:116px;width:340px;pointer-events:none}
.hero__title{
  letter-spacing:-.035em;line-height:1.02;
  font-size:clamp(46px,5.4vw,82px);max-width:16ch;
}
.hero__sub{margin-top:var(--space-7);max-width:52ch;font-size:19px;line-height:1.6;text-wrap:pretty}
.hero__ctas{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-7)}

/* --- Proof bar ----------------------------------------------------------- */
.proof{background:var(--pacific-cobalt)}
.proof__inner{
  padding-top:var(--space-8);padding-bottom:var(--space-8);
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6);
}
.stat__val{
  font-family:var(--font-condensed);font-weight:400;
  font-size:clamp(48px,4.6vw,74px);line-height:.9;color:var(--canvas-cream);
}
.stat__rule{height:6px;width:64px;background:var(--golden-hour);margin:12px 0 10px}
.stat__lab{
  font-family:var(--font-condensed);font-weight:500;font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--canvas-cream);
}
.stat__detail{font-size:14px;color:var(--cobalt-tint);margin-top:4px}

/* --- Who We Are ---------------------------------------------------------- */
.section{padding-top:var(--space-9);padding-bottom:var(--space-9)}
.whogrid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-9);align-items:start}
.whogrid__aside{display:flex;flex-direction:column;gap:var(--space-6);margin-top:78px}
.who__h2{margin:var(--space-4) 0 var(--space-6);max-width:18ch}
.founder{display:flex;gap:var(--space-4);align-items:flex-start}
.founder__photo{
  flex:0 0 auto;width:96px;height:96px;border-radius:var(--radius-pill);
  background:var(--cobalt-tint);border:2px solid var(--pacific-cobalt);overflow:hidden;
}
.founder__photo img{width:100%;height:100%;object-fit:cover;display:block}
.founder__body{min-width:0;flex:1 1 auto}
.founder__name{font-size:22px}
.founder__role{
  font-family:var(--font-condensed);font-weight:500;font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;
  color:var(--pacific-cobalt);margin:5px 0 9px;
}
.founder__line{font-size:15px;line-height:1.55;text-wrap:pretty}

/* --- Portfolio ----------------------------------------------------------- */
.portfolio{background:var(--ink-navy)}
.portfolio__head{
  display:grid;grid-template-columns:1fr .9fr;gap:var(--space-8);
  align-items:end;margin-bottom:var(--space-8);
}
.portfolio__h2{color:var(--canvas-cream);margin-top:var(--space-4)}
.portfolio__intro{color:var(--cobalt-tint);font-size:17px;max-width:40ch;text-wrap:pretty}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6)}
.pgrid>.feature{grid-column:span 2}
.pcard--portfolio{display:flex;flex-direction:column;gap:var(--space-4)}


.pcard__blurb{font-size:15px;line-height:1.55;text-wrap:pretty}
.feature .pcard__blurb{font-size:17px}
.pcard__kicker{
  font-family:var(--font-display);font-weight:700;font-size:18px;
  line-height:1.4;letter-spacing:-.01em;color:var(--golden-hour);margin-top:auto;
}
/* Photo well. The logo silhouette treatment is gone at the client's request, so the
   eight shots no longer share a background — the fixed ratio, the cobalt frame and a
   consistent crop are what hold the wall together now. The brand name returns as type
   because a product photo, unlike a logo, doesn't say who it is. */
.shot{
  width:100%;aspect-ratio:3/2;
  background:var(--cream-2);
  border:1px solid var(--cobalt-tint);
  border-radius:var(--radius-control);
  overflow:hidden;
}
.feature .shot{aspect-ratio:9/4}                    /* Grüns keeps its taller feature crop */
.shot img{width:100%;height:100%;object-fit:cover;display:block}

/* Per-image crop bias. object-fit:cover crops from the centre by default, which
   cuts heads off portrait shots and leaves RevAir's "award winning" badge in frame. */
.shot img{object-position:center}
.shot img[alt="Maeva"]{object-position:center 12%}  /* include her face — RevAir next to it is a full portrait */
/* Each portfolio tile is now a link to the brand's site. The global a{} rules
   would tint every word inside it, so colour is pinned back to the body token. */
a.pcard--portfolio{color:var(--text-body);text-decoration:none}
a.pcard--portfolio:hover,
a.pcard--portfolio:focus-visible{color:var(--text-body)}
a.pcard--portfolio:focus-visible{outline:3px solid var(--golden-hour);outline-offset:4px}
/* affordance: the name picks up the accent and grows an arrow on hover */
.pcard__name{transition:color .15s var(--ease-brand)}
a.pcard--portfolio:hover .pcard__name{color:var(--pacific-cobalt)}
.pcard__name::after{
  content:"↗";display:inline-block;margin-left:.35em;
  font-size:.7em;vertical-align:.08em;
  color:var(--pacific-cobalt);opacity:0;transform:translate(-3px,3px);
  transition:opacity .15s var(--ease-brand),transform .15s var(--ease-brand);
}
a.pcard--portfolio:hover .pcard__name::after{opacity:1;transform:translate(0,0)}
.pcard__name{font-size:22px;line-height:1.15}
.feature .pcard__name{font-size:30px}

/* --- What We Do ---------------------------------------------------------- */
.what__h2{margin:var(--space-4) 0 var(--space-8)}
.whatgrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);align-items:stretch}
.whatcard{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-6)}
.icontile{
  width:58px;height:58px;border-radius:var(--radius-patch);
  background:var(--cobalt-tint);display:grid;place-items:center;
}
.icontile--cream{background:var(--canvas-cream)}
.whatcard__title{font-size:30px}
.whatcard__body{font-size:16px;text-wrap:pretty}
.whatcard__block{margin-top:var(--space-2)}
.whatcard__label{
  font-family:var(--font-condensed);font-weight:600;font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;
  color:var(--pacific-cobalt);margin-bottom:var(--space-3);
}
.patch--cobalt .whatcard__label{color:var(--golden-hour)}
.whatcard__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--space-2)}
.whatcard__list li{
  font-family:var(--font-display);font-weight:700;font-size:18px;
  letter-spacing:-.01em;line-height:1.3;padding-left:var(--space-5);position:relative;
}
.whatcard__list li::before{
  content:"";position:absolute;left:0;top:.6em;
  width:10px;height:3px;background:var(--pacific-cobalt);
}
.patch--cobalt .whatcard__list li::before{background:var(--golden-hour)}
/* the additive item: a gold + rather than a dash, so it reads as "and on top of
   all that" instead of just another line in the list */
.whatcard__list li.plus{margin-top:var(--space-2)}
.whatcard__list li.plus::before{
  content:"+";background:none;width:auto;height:auto;
  top:0;left:0;line-height:1.3;
  font-family:var(--font-display);font-weight:700;color:var(--golden-hour);
}
.whatcard__kicker{
  font-size:15px;line-height:1.55;text-wrap:pretty;
  border-top:1px solid var(--cobalt-tint);
  padding-top:var(--space-4);margin-top:var(--space-2);
}
.patch--cobalt .whatcard__kicker{border-top-color:var(--pacific-cobalt);color:var(--cobalt-tint)}
.whatcard__cta{margin-top:auto;padding-top:var(--space-4)}
.patch--cobalt .btn--secondary{border-color:var(--canvas-cream);color:var(--canvas-cream)}
.patch--cobalt .btn--secondary:hover{border-color:var(--ink-navy);color:var(--ink-navy)}
.pullquote{
  margin:var(--space-8) 0 0;
  border-left:6px solid var(--golden-hour);
  padding:var(--space-2) 0 var(--space-2) var(--space-6);
  max-width:66ch;
}
.pullquote p{
  font-size:clamp(22px,2.1vw,30px);font-weight:500;
  line-height:1.35;letter-spacing:-.015em;text-wrap:pretty;
}

/* --- Contact ------------------------------------------------------------- */
.contact{background:var(--pacific-cobalt)}
.contact__inner{
  padding-top:var(--space-9);padding-bottom:var(--space-9);
  display:grid;grid-template-columns:1fr 1fr;gap:var(--space-9);align-items:start;
}
.script{font-family:var(--font-script);font-size:38px;color:var(--golden-hour);line-height:1.1}
.contact__h2{color:var(--canvas-cream);margin:var(--space-4) 0 var(--space-5);max-width:20ch;font-size:clamp(32px,3.2vw,48px)}
.contact__intro{color:var(--cobalt-tint);font-size:17px;max-width:42ch;text-wrap:pretty}
.form{display:grid;gap:var(--space-4)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.field{display:flex;flex-direction:column;gap:6px}
.field span{
  font-family:var(--font-condensed);font-weight:500;font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--canvas-cream);
}
.field input,.field select,.field textarea{
  font-family:var(--font-body);font-size:15px;color:var(--ink-navy);
  background:var(--canvas-cream);border:2px solid var(--ink-navy);
  border-radius:var(--radius-control);padding:11px 13px;width:100%;outline:none;
  transition:border-color .15s var(--ease-brand);
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--golden-hour)}
.field textarea{resize:vertical;min-height:104px}
.form__submit{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}
.form__msg{
  font-family:var(--font-condensed);font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--golden-hour);
}
.form__msg--error{color:var(--canvas-cream)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* --- Footer -------------------------------------------------------------- */
.footer{background:var(--ink-navy);color:var(--canvas-cream);border-top:2px solid var(--pacific-cobalt)}
.footer__inner{
  padding-top:var(--space-6);padding-bottom:var(--space-6);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;
}
.footer__right{display:flex;gap:var(--space-5);align-items:center;flex-wrap:wrap}
.footer__link{color:var(--golden-hour)}
.footer__copy{color:var(--cobalt-tint)}

/* --- Breakpoints --------------------------------------------------------- */
@media(max-width:1199px){
  .pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1120px){
  .whogrid{grid-template-columns:minmax(0,1fr);gap:var(--space-7)}
  .whogrid__aside{margin-top:0}
}
@media(max-width:1060px){
  /* The handoff hides the mark below 1060 because the 340px bleed starts colliding
     with the headline. Shrinking and pushing it clears the collision and keeps the
     hero's one gold element on screen. */
  .hero-sun{width:280px;right:-90px;top:96px}
}
@media(max-width:900px){
  .wrap{padding-left:var(--space-5);padding-right:var(--space-5)}
  /* a 4th nav link ("Venture Studio") pushes the bar past the viewport at tablet
     widths — tighten here, and hide the links entirely below 820. */
  .nav__links{gap:var(--space-4)}
  .nav__right{gap:var(--space-5)}
  .hero__inner{padding-top:var(--space-8);padding-bottom:var(--space-8)}
  .section{padding-top:var(--space-8);padding-bottom:var(--space-8)}
  .proof__inner{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-7) var(--space-6)}
  .portfolio__head{grid-template-columns:minmax(0,1fr);gap:var(--space-5);align-items:start}
  .whatgrid{grid-template-columns:minmax(0,1fr)}
  .whatcard{padding:var(--space-5)}
  .pullquote{padding-left:var(--space-5)}
  .contact__inner{grid-template-columns:minmax(0,1fr);gap:var(--space-7)}
}
@media(max-width:820px){
  .pgrid{grid-template-columns:minmax(0,1fr)}
  .pgrid>.feature{grid-column:auto}
}
@media(max-width:720px){
  .nav__links{display:none}
  .nav__right{gap:var(--space-4)}

  /* Phone: there is no empty space beside a 327px text column, and stacking the mark
     above the copy costs ~300px of scroll before the headline starts. So it goes
     BEHIND the headline instead and the display type crosses it. Navy on Golden Hour
     is 5.8:1 — well past AA — and the copy stays right under the nav.

     Offsets are a percentage transform, not pixels, so the crop scales with the disc:
     the raindrop occupies the disc's 20–57% vertically and 31–69% horizontally, so
     cropping 26% off the right and 14% off the top keeps the whole drop on screen at
     every width in this range. Pixel offsets cut the drop on a 320px screen. */
  .hero-sun{
    display:block;z-index:0;
    width:min(70vw,265px);height:auto;aspect-ratio:1;
    right:0;top:0;margin:0;
    transform:translate(26%,-14%);
  }
  .hero__inner{position:relative;z-index:1} /* copy sits above the disc */

  /* Hero: the sun mark comes back into the flow above the headline, so the
     phone hero still opens on the brand instead of a wall of navy type. */
  .hero__inner{padding-top:var(--space-6);padding-bottom:var(--space-7)}
  .hero__title{font-size:clamp(36px,11.5vw,46px)}
  .hero__sub{font-size:17px;margin-top:var(--space-5)}
  .hero__ctas{margin-top:var(--space-6);gap:var(--space-3);flex-direction:column;align-items:stretch}
  .hero__ctas .btn{width:100%}

  /* Proof bar: 2x2, tighter numerals. Four full-height stats ate a screen. */
  .proof__inner{padding-top:var(--space-7);padding-bottom:var(--space-7)}
  .stat__val{font-size:38px}
  .stat__rule{width:48px;height:5px;margin:10px 0 8px}
  .stat__detail{font-size:13px}

  /* Portfolio: shallower logo wells, tighter cards. */
  .pcard--portfolio{padding:20px;gap:var(--space-3)}
  .pcard__name{font-size:20px}
  .feature .pcard__name{font-size:24px}
  .feature .shot{aspect-ratio:4/3}
  .feature .pcard__blurb{font-size:16px}

  /* What We Do + pull-quote */
  .whatcard{gap:var(--space-3)}
  .icontile{width:52px;height:52px}
  .icontile svg{width:34px;height:34px}
  .whatcard__title{font-size:26px}
  .what__h2{margin-bottom:var(--space-6)}
  .pullquote{margin-top:var(--space-7);border-left-width:5px}

  /* Contact + footer */
  .contact__inner{padding-top:var(--space-8);padding-bottom:var(--space-8)}
  .script{font-size:32px}
  .footer__inner{gap:var(--space-4);font-size:13px}
}

@media(max-width:400px){
  .btn--sm{padding:9px 16px;font-size:11px}
  .nav__right{gap:var(--space-3)}
  .form__row{grid-template-columns:minmax(0,1fr)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms!important}
}

/* ==========================================================================
   WordPress additions
   ========================================================================== */

/* Skip link surfaces on focus */
.skip-link:focus{
  position:fixed;left:16px;top:16px;z-index:100;width:auto;height:auto;margin:0;clip:auto;
  padding:10px 16px;background:var(--golden-hour);color:var(--ink-navy);
  font-family:var(--font-body);font-weight:600;border-radius:var(--radius-control);
}

/* Logged-in admin bar sits above the sticky nav */
.admin-bar .nav{top:32px}
@media(max-width:782px){.admin-bar .nav{top:46px}}

/* Generic page (thank-you, privacy) */
.page-body{max-width:1440px}
.page-title{margin:0 0 var(--space-6);max-width:20ch}
.page-lede{font-size:18px;max-width:52ch;margin-bottom:var(--space-6)}
.page-content{font-size:17px;max-width:64ch}
.page-content h2,.page-content h3{font-family:var(--font-display);font-weight:700;letter-spacing:-.02em;line-height:1.15;margin:var(--space-7) 0 var(--space-4)}
.page-content h2{font-size:30px}.page-content h3{font-size:22px}
.page-content p,.page-content ul,.page-content ol{margin:0 0 var(--space-5);max-width:64ch}
.page-content ul,.page-content ol{padding-left:1.25em}
.page-content a{text-decoration:underline;text-underline-offset:.15em}
.page-content img{height:auto;border-radius:var(--radius-control)}

/* ==========================================================================
   Gravity Forms — GF's own CSS is disabled (see inc/forms.php); these rules
   give its markup the design's field treatment.
   ========================================================================== */
.contact__form .gform_wrapper{width:100%}
.gform_wrapper .gform_heading{display:none}

/* GF's 12-column field grid, so its width settings keep working */
.gform_wrapper .gform_fields{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--space-4);margin:0;padding:0;list-style:none;
}
.gform_wrapper .gfield{grid-column:span 12;margin:0;padding:0}
.gform_wrapper .gfield--width-half,
.gform_wrapper .gf_left_half,.gform_wrapper .gf_right_half{grid-column:span 6}
.gform_wrapper .gfield--width-third,.gform_wrapper .gf_left_third,
.gform_wrapper .gf_middle_third,.gform_wrapper .gf_right_third{grid-column:span 4}
.gform_wrapper .gfield--width-two-thirds{grid-column:span 8}
.gform_wrapper .gfield--width-quarter{grid-column:span 3}
.gform_wrapper .gfield--width-three-quarter{grid-column:span 9}

/* label: Oswald caps in cream, 6px above the control */
.gform_wrapper .gfield_label{
  display:block;margin:0 0 6px;
  font-family:var(--font-condensed);font-weight:500;font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--canvas-cream);
}
.gform_wrapper .gfield_required{color:var(--golden-hour);margin-left:.3em}
.gform_wrapper .gfield_required_text,
.gform_wrapper .gfield_required_asterisk{font-size:inherit}
.gform_wrapper .hidden_label .gfield_label,
.gform_wrapper .gfield_visibility_hidden,
.gform_wrapper .gform_hidden,
.gform_wrapper .gform_validation_container,
.gform_wrapper .gf_invisible,
.gform_wrapper .ginput_recaptchav3{
  position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
}
.gform_wrapper .gfield_description{font-size:13px;color:var(--cobalt-tint);margin-top:6px}

/* controls: cream fill, 2px ink border, gold on focus */
.rv .gform_wrapper .ginput_container input:not([type=checkbox]):not([type=radio]):not([type=submit]),
.rv .gform_wrapper .ginput_container select,
.rv .gform_wrapper .ginput_container textarea{
  font-family:var(--font-body);font-size:15px;color:var(--ink-navy);
  background:var(--canvas-cream);border:2px solid var(--ink-navy);
  border-radius:var(--radius-control);padding:11px 13px;width:100%;outline:none;
  transition:border-color .15s var(--ease-brand);
}
.rv .gform_wrapper .ginput_container input:focus,
.rv .gform_wrapper .ginput_container select:focus,
.rv .gform_wrapper .ginput_container textarea:focus{border-color:var(--golden-hour)}
.rv .gform_wrapper .ginput_container textarea{resize:vertical;min-height:104px}
.gform_wrapper .ginput_container select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%231A2E52' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;
}
.gform_wrapper input::placeholder,.gform_wrapper textarea::placeholder{color:var(--text-muted)}

/* validation */
.gform_wrapper .gform_validation_errors{
  margin:0 0 var(--space-4);padding:12px 14px;
  background:var(--canvas-cream);border:2px solid var(--golden-hour);border-radius:var(--radius-control);
  color:var(--ink-navy);font-size:14px;
}
.gform_wrapper .gform_validation_errors h2{font:inherit;font-weight:600;margin:0}
.gform_wrapper .gform_validation_errors ol{margin:6px 0 0;padding-left:1.2em}
.gform_wrapper .gfield_error .ginput_container input,
.gform_wrapper .gfield_error .ginput_container select,
.gform_wrapper .gfield_error .ginput_container textarea{border-color:var(--golden-hour)}
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message{
  margin-top:6px;font-family:var(--font-condensed);font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--golden-hour);
}

/* submit row */
.gform_wrapper .gform_footer{
  display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;
  margin:var(--space-4) 0 0;padding:0;
}
.gform_wrapper .gform_ajax_spinner{width:22px;height:22px}

/* confirmation, in the design's gold caps */
.rv-confirm,
.gform_confirmation_message{
  font-family:var(--font-condensed);font-size:var(--text-label);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--golden-hour);
}
.gform_confirmation_message p{margin:0}

/* GF renders on the cobalt band: keep any stray text legible */
.contact__form,.contact__form .gform_wrapper{color:var(--canvas-cream)}

@media(max-width:520px){
  .gform_wrapper .gfield--width-half,
  .gform_wrapper .gf_left_half,.gform_wrapper .gf_right_half{grid-column:span 12}
}

/* Belt and braces for the submit: the theme's gform_submit_button filter emits a
   styled <button>, but if GF ever renders its raw <input type=submit> (legacy
   markup, a plugin conflict) it still gets the design's primary button. */
.gform_wrapper .gform_footer input[type=submit],
.gform_wrapper .gform_footer .gform_button{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-body);font-weight:600;text-transform:uppercase;letter-spacing:.06em;
  background:var(--golden-hour);color:var(--ink-navy);
  border:2px solid var(--ink-navy);border-radius:var(--radius-control);
  box-shadow:3px 3px 0 var(--ink-navy);padding:16px 30px;font-size:14px;
  cursor:pointer;white-space:nowrap;-webkit-appearance:none;appearance:none;
  transition:box-shadow .15s var(--ease-brand),transform .15s var(--ease-brand);
}
.gform_wrapper .gform_footer input[type=submit]:active,
.gform_wrapper .gform_footer .gform_button:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--ink-navy)}
.gform_wrapper .gform_footer input[type=submit]:focus-visible,
.gform_wrapper .gform_footer .gform_button:focus-visible{outline:3px solid var(--canvas-cream);outline-offset:3px}

/* reCAPTCHA notice and any HTML/legend field: small and muted, links stay legible */
.gform_wrapper .gfield_html,
.gform_wrapper .gform_required_legend{font-size:13px;line-height:1.5;color:var(--cobalt-tint)}
.gform_wrapper .gfield_html a{color:var(--canvas-cream);text-decoration:underline;text-underline-offset:.15em}
.gform_wrapper .gfield_html a:hover{color:var(--golden-hour)}

/* Admin-only note shown above the form when the configured GF form is missing */
.rv-admin-note{
  margin:0 0 var(--space-4);padding:10px 14px;
  background:var(--golden-hour);color:var(--ink-navy);
  border-radius:var(--radius-control);font-size:13px;font-weight:600;
}