/*
 Theme Name:   CGuard Child Theme
 Theme URI:    https://culinairyguard.com
 Description:  Child theme for the Extendable parent theme
 Author:       Your Name
 Author URI:   https://waestudios.com
 Template:     extendable
 Version:      1.0.0
 Text Domain:  cguard-child-theme
*/

/* You can add your custom CSS below */

/*page*/

main.wp-block-group[id="wp--skip-link--target"] {
  padding-top: var(--wp--custom--spacing--medium) !important;
  padding-bottom: var(--wp--custom--spacing--medium) !important;
}



/*fonts*/
@font-face {
  font-family: 'Mulish';
  src: url('assets/fonts/Mulish-Light.woff2') format('woff2'),
       url('assets/fonts/Mulish-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Mulish';
  src: url('assets/fonts/Mulish-Regular.woff2') format('woff2'),
       url('assets/fonts/Mulish-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mulish';
  src: url('assets/fonts/Mulish-Medium.woff2') format('woff2'),
       url('assets/fonts/Mulish-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mulish';
  src: url('assets/fonts/Mulish-Black.woff2') format('woff2'),
       url('assets/fonts/Mulish-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('assets/fonts/Roboto-Regular.woff2') format('woff2'),
       url('assets/fonts/Roboto-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('assets/fonts/Roboto-Italic.woff2') format('woff2'),
       url('assets/fonts/Roboto-Italic.woff') format('woff');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}


/*  
   Variables (colors, fonts, radius)
     */
:root{
  --bg-main:#0c142b;
  --bg-secondary:#cdffff;
  --text-main:#ffffff;
  --text-dark:#000000;
  --accent:#f79650;
  --ink-contrast:#0b1a33;
  --radius:30px;

  --font-sans-1:'Mulish',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --font-sans-2:'Roboto',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/*  
   Base / Body
     */
html{box-sizing:border-box;scroll-behavior:smooth;font-synthesis-weight:none;font-synthesis-style:none}
*,*::before,*::after{box-sizing:inherit}

body {
  margin: 0;
  background: var(--bg-main);
  color: var(--text-main);
  font-family: var(--font-sans-1, 'Mulish', Arial, sans-serif);
  font-weight: 300;
  font-size: clamp(1.3rem, 1.2rem + 0.35vw, 1.5rem);
  line-height: 1.2;
  text-rendering: optimizeLegibility;
  font-synthesis-weight: none;
  font-synthesis-style: none;
}

html body {
  font-size: clamp(1.3rem, 1.2rem + 0.35vw, 1.5rem) !important;
  line-height: 1.2 !important;
}

.wp-block-post-content p,
.wp-block-group p,
p {
  font-size: inherit !important;
  line-height: inherit !important;
  margin-bottom: 1%;
}

@media (max-width: 400px) {
  html body { font-size: 1.55rem !important; }
}


/*  Headings */
h1,h2,h3,h4,h5{margin:0 0 .6em 0;font-family:var(--font-sans-1);line-height:1.2}
h1{font-weight:300;font-size:clamp(2.1rem,1.9rem + 3.1vw,3.25rem)}
h2{font-weight:300;font-size:clamp(1.8rem,1.5rem + 2.6vw,2.6rem)}
h3{font-weight:300;font-size:clamp(1.5rem,1.05rem + 2vw,1.85rem)}
h4{font-weight:300;font-size:clamp(1.15rem,0.98rem + 0.6vw,1.35rem)}
h5{font-weight:300;font-size:clamp(1.05rem,0.96rem + 0.3vw,1.15rem)}
.heading-accent,.has-accent-heading{color:var(--bg-secondary)}

h2.subhead,
h3.subhead,
h4.subhead {
  font-family: var(--font-sans-1);
  font-weight: 300;
  font-size: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
  margin: 0;;
  text-transform: uppercase;
}

.aligncenter { text-align: center; }


/* Big paragraph */
p.big-paragraph {
  font-family: var(--font-sans-1);
  font-weight: 300;
  font-size: clamp(2.5rem, 2rem + 3vw, 4rem) !important;
  line-height: 1.2;
  margin-bottom: 1.5em;
  color: var(--bg-secondary);
}

.big-paragraph .word.accent,
.big-paragraph .accent {
  color: #f79650 !important;
}
/* Links */
a{color:var(--bg-secondary);text-decoration:underline;text-underline-offset:2px}
a:hover,a:focus{opacity:.9}
a:focus-visible{outline: 3px solid --bg-secondary;text-decoration-thickness:.18em;outline-offset: 0.6rem;}

/* buttons */
.wp-block-button .wp-block-button__link,
button,.button,input[type="submit"],.wp-element-button{
  appearance:none;border:2px solid var(--accent);background:transparent;color:var(--accent);
  border-radius:999px;padding:.7em 1.2em;
  font-family:var(--font-sans-1);font-weight:400;letter-spacing:.2px;line-height:1;cursor:pointer;
  background-image:linear-gradient(var(--accent),var(--accent));
  background-size:0% 100%;background-repeat:no-repeat;background-position:left center;
  transition:background-size .25s ease, color .2s ease, transform .06s ease, box-shadow .2s ease, border-color .2s ease;
}
.wp-block-button .wp-block-button__link:hover,
button:hover,.button:hover,input[type="submit"]:hover,.wp-element-button:hover{
  background-size:100% 100%;
  color:var(--ink-contrast);
  border-color:var(--accent);
}
.wp-block-button .wp-block-button__link:focus-visible,
button:focus-visible,.button:focus-visible,input[type="submit"]:focus-visible,.wp-element-button:focus-visible{
  outline:0;
  background-size:100% 100%; /* also fill on keyboard focus */
  color:var(--ink-contrast);
  box-shadow:0 0 0 3px var(--bg-secondary),0 0 0 6px var(--bg-main);
}
/* Gutenberg "Fill" style parity */
.is-style-fill .wp-block-button__link,
.wp-block-button__link.is-style-fill,
.wp-element-button.is-style-fill{
  background:var(--accent);color:var(--ink-contrast);border-color:var(--accent);
}
.wp-block-button__link:is(:hover,:active).is-style-fill,
.wp-element-button.is-style-fill:is(:hover,:active){
  filter:brightness(.95);
}
/* Focus override on light sections */
.has-secondary-bg :is(.wp-block-button .wp-block-button__link,button,.button,input[type="submit"],.wp-element-button):focus-visible{
  box-shadow:0 0 0 3px #0c142b,0 0 0 6px #f2914a;
}

/*Gutenberg: layout containers
.wp-block-group,
.wp-block-cover{
  border-radius:var(--radius);
  overflow:hidden;
}*/

/*Gutenberg: text blocks*/
p{margin:0 0 1.1em}
.wp-block-quote{
  margin:1.5em 0;padding:1em 1.25em;background:rgba(255,255,255,0.05);
  border-left:4px solid var(--accent);
}
.wp-block-pullquote{
  margin:2em 0;padding:1.25em 1.5em;background:rgba(255,255,255,0.06);text-align:center;
}
.wp-block-list{padding-left:1.25em}
.wp-block-code,.wp-block-preformatted{
  background:rgba(255,255,255,0.06);padding:1em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

/*  
   Gutenberg: media blocks
     */
.wp-block-image img,.wp-block-gallery img{display:block;width:100%;height:auto}
figcaption{font-size:.9em;color:rgba(255,255,255,.85);text-align:center;margin-top:.5em}

/*  
   Gutenberg: cover, group, columns
     */
.wp-block-cover{min-height:min(60vh,720px)}
.wp-block-group{padding:clamp(1rem,.6rem + 2vw,2.25rem)}
.wp-block-columns{gap:clamp(1rem,.6rem + 1.3vw,2rem)}
@media (max-width:781px){.wp-block-columns{gap:1rem}}

/*  
   Secondary background
     */
.has-secondary-bg,.bg-secondary{background:var(--bg-secondary);color:var(--text-dark)}
.has-secondary-bg a{color:#003a44}

/*  
   HR / separators
     */
hr,.wp-block-separator{
  border:none;height:2px;background:var(--accent);
  width:min(100%,780px);margin:2rem auto;opacity:1;
}

/*  
   Forms (basic)
     */
input,select,textarea{
  width:100%;max-width:100%;
  color:var(--text-main);background:rgba(255,255,255,.04);
  border:2px solid rgba(255,255,255,.2);border-radius:12px;
  padding:.7em .9em;font-family:var(--font-sans-2);
}
input::placeholder,textarea::placeholder{color:rgba(255, 255, 255, 0.65)}
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:0;border-color:var(--accent);
  box-shadow:0 0 0 3px var(--bg-secondary),0 0 0 6px var(--bg-main);
}

/*  
   Tables
     */
table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:var(--radius)}
thead th{background:rgba(255,255,255,.08)}
th,td{padding:.8em 1em;border-bottom:1px solid rgba(255,255,255,.12)}
tbody tr:nth-child(odd){background:rgba(255,255,255,.03)}

/*  
   Utility helpers
     */
.rounded{border-radius:var(--radius)}
.attn{color:var(--bg-secondary)}
.bg-attn{background:var(--bg-secondary);color:var(--text-dark)}
.max-w-content{max-width:72rem;margin-inline:auto;padding-inline:clamp(1rem,2vw,2rem)}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
}
.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden;background:#cdffff;color:#000;padding:.75rem 1rem;border-radius:6px}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;z-index:10000}

/*footer*/
footer.wp-block-template-part .date,
footer.wp-block-template-part .date time,
footer.wp-block-template-part .copyright {
  font-size: 0.8rem !important;
  line-height: 1.4;
}


/* ===========================
   HEADER SHELL
   =========================== */

.cguard-header{
  position: relative;
  z-index: 50;
  border-radius: 0 0 var(--radius) var(--radius);
  margin: 0;
  padding: 0;
  background: color-mix(in oklab, var(--bg-main) 65%, transparent);
  -webkit-backdrop-filter: saturate(120%) blur(8px);
  backdrop-filter: saturate(120%) blur(8px);
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
}

.cguard-header.is-sticky{
  position: sticky;
  top: 0;
}

/* inner row */
.cguard-header__inner{
  width: min(1360px, 100%);
  max-width: 1600px;
  margin-inline: auto;
  padding: clamp(0.25rem, 0.6vw, 0.65rem) clamp(0.75rem, 1vw, 1.25rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(1rem, 2vw, 3rem);
}

/* ===========================
   LOGO
   =========================== */

.cguard-logo img,
.cguard-logo svg {
  width: clamp(150px, 15vw, 200px);
  height: auto;
}

.cguard-logo a:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 3px color-mix(in oklab, var(--bg-secondary) 85%, transparent),
    0 0 0 6px var(--bg-main);
  border-radius: 6px;
}

/* shrink logo slightly when header is fixed */
.cguard-header.is-fixed .cguard-logo img,
.cguard-header.is-fixed .cguard-logo svg {
  width: clamp(120px, 12vw, 150px);
  transition: width 0.3s ease;
}

/* ===========================
   NAVIGATION BASE
   =========================== */

.cguard-nav .wp-block-navigation__container{
  gap: clamp(.75rem, 1.8vw, 2.25rem);
}

.cguard-nav a{
  color: var(--bg-secondary);
  text-decoration: none !important;
  position: relative;
  padding-block: 8px;
  line-height: 1.1;
  transition: color .2s ease;
}

/* underline-on-hover effect */
.cguard-nav a::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  height: 2px;
  width: 0;
  background: var(--bg-secondary);
  transition:
    width .25s ease,
    left .25s ease,
    background-color .15s ease;
}

.cguard-nav a:hover,
.cguard-nav a:focus-visible{
  color: var(--accent);
  outline: 0;
}

.cguard-nav a:hover::after,
.cguard-nav a:focus-visible::after{
  left: 0;
  width: 100%;
  background: var(--accent);
}

/* ===========================
   LAST ITEM AS PILL CTA
   =========================== */

.cguard-nav .wp-block-navigation__container > li:last-child > a{
  outline: none;
  border: 2px solid var(--accent);
  border-radius: 999px;
  color: var(--accent);
  padding: .55em 1.05em;
  line-height: 1;
  background-image: linear-gradient(var(--accent), var(--accent));
  background-size: 0% 100%;
  background-repeat: no-repeat;
  background-position: left center;
  transition:
    background-size .25s ease,
    color .2s ease,
    border-color .2s ease;
  text-decoration: none !important;
}

/* no underline on the pill CTA */
.cguard-nav .wp-block-navigation__container > li:last-child > a::after{
  content: none;
}

/* hover / focus: fill the pill, but don't move or glow */
.cguard-nav .wp-block-navigation__container > li:last-child > a:hover,
.cguard-nav .wp-block-navigation__container > li:last-child > a:focus-visible{
  background-size: 100% 100%;
  color: #0b1a33;
  box-shadow: none;        /* kill light blue border/glow */
  transform: none;         /* stop growing/jumping */
}

/* global nav focus-visible: remove blue ring, keep text/underline change */
.cguard-nav a:focus-visible{
  box-shadow: none;
  border-radius: 6px;
}

/* ===========================
   TOUCH TARGET MOBILE
   =========================== */

@media (max-width: 782px){
  .cguard-nav .wp-block-navigation__container a{
    padding-block: 12px;
  }
}

/* Increase horizontal gap between desktop nav links */
@media (min-width: 783px) {
  .cguard-nav .wp-block-navigation__container {
    gap: clamp(1.25rem, 2.5vw, 3rem);
  }
}

/* ===========================
   MOBILE NAV OVERLAY
   =========================== */

/* full-screen overlay when menu is open */
nav.cguard-nav .wp-block-navigation__responsive-container.is-menu-open {
  position: fixed;
  inset: 0;
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
  background: var(--bg-main);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  z-index: 9999;
}

/* structure the dialog */
nav.cguard-nav .wp-block-navigation__responsive-dialog {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  padding: clamp(1rem, 3vw, 2rem);
  color: var(--text-main);
}

/* scroll area for the menu list */
nav.cguard-nav .wp-block-navigation__responsive-container-content {
  margin-top: 1rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* overlay menu list layout ONLY (no effect on desktop inline nav) */
nav.cguard-nav .wp-block-navigation__responsive-container .wp-block-navigation__container {
  gap: 0.75rem;
  padding-bottom: 2rem; /* breathing room at bottom of overlay */
}

/* Link colors inside the overlay */
nav.cguard-nav .wp-block-navigation__responsive-container a {
  color: var(--bg-secondary);
  text-decoration: none;
  font-size: clamp(1.05rem, 3.5vw, 1.25rem);
  line-height: 1.3;
  display: inline-block;
  padding-block: .75rem;
}

/* close button contrast */
nav.cguard-nav .wp-block-navigation__responsive-container
  .wp-block-navigation__responsive-container-close svg path {
  fill: black;
}

/* When the WP admin bar is present, account for it */
@media (min-width: 783px) {
  html.admin-bar nav.cguard-nav
    .wp-block-navigation__responsive-container.is-menu-open {
    top: 32px;
    height: calc(100dvh - 32px);
  }
}

@media (max-width: 782px) {
  html.admin-bar nav.cguard-nav
    .wp-block-navigation__responsive-container.is-menu-open {
    top: 46px;
    height: calc(100dvh - 46px);
  }
}

/* CTA spacing in overlay on mobile */
@media (max-width: 782px) {
  nav.cguard-nav .wp-block-navigation__responsive-container .wp-block-navigation__container > li:last-child {
    margin-top: 0.75rem;
    margin-bottom: 1.75rem;
  }

  nav.cguard-nav .wp-block-navigation__responsive-container .wp-block-navigation__container > li:last-child > a {
    padding: 0.9em 1.5em;
    display: inline-block;
  }
}

/* desktop nav layout refinements */
@media (min-width: 783px){
  nav.cguard-nav {
    --wp--style--block-gap: clamp(1.75rem, 2.2vw, 3.5rem);
  }

  nav.cguard-nav .wp-block-navigation__container{
    gap: var(--wp--style--block-gap) !important;
    column-gap: var(--wp--style--block-gap) !important;
    row-gap: 0 !important;
  }

  nav.cguard-nav .wp-block-navigation__container > li{
    margin: 0 !important;
  }

  nav.cguard-nav .wp-block-navigation__container > li:last-child{
    margin-inline-start: clamp(1rem, 1.2vw, 2rem) !important;
  }
}

/* ===========================
   SLIMMER DESKTOP HEADER
   =========================== */

@media (min-width: 983px){
  /* slightly tighter inner padding = slimmer bar */
  .cguard-header__inner{
    padding-block: clamp(0.1rem, 0.3vw, 0.3rem) !important;
    padding-inline: clamp(0.75rem, 1vw, 1.25rem) !important;
  }

  /* smaller vertical hit-area while keeping nav usable */
  .cguard-nav a{
    padding-block: 6px !important; /* was 8px */
  }

  /* trim the CTA pill a bit */
  .cguard-nav .wp-block-navigation__container > li:last-child > a{
    padding: .5em .95em !important;
  }

  /* when fixed (on up-scroll), make it a hair tighter */
  .cguard-header.is-fixed .cguard-header__inner{
    padding-block: clamp(0.15rem, 0.35vw, 0.35rem) !important;
  }
}

/* ===========================
   SCROLLED STATE & ANIMATION
   =========================== */

.cguard-header.is-fixed{
  background: color-mix(in oklab, var(--bg-main) 92%, transparent);
  box-shadow: 0 6px 18px rgba(0,0,0,.28);
}

/* Smooth hide/reveal */
.cguard-header{
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    background-color .25s ease;
  will-change: transform;
}

/* Fixed state positioning */
.cguard-header.is-fixed{
  position: fixed;
  left: 0;
  right: 0;
  transform: translateY(0);
  z-index: 1000;
}

/* Hide when scrolling down */
.cguard-header.is-fixed.is-hidden{
  transform: translateY(-110%);
}

/* Reduce motion respect */
@media (prefers-reduced-motion: reduce){
  .cguard-header{
    transition: none;
  }
}

@media (max-width: 782px) {

  /* Mobile header bar background */
  .cguard-header {
    background: var(--bg-main) !important; /* your dark blue */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Mobile menu overlay background */
  nav.cguard-nav .wp-block-navigation__responsive-container.is-menu-open,
  nav.cguard-nav .wp-block-navigation__responsive-dialog,
  nav.cguard-nav .wp-block-navigation__responsive-container-content {
    background: var(--bg-main) !important;
  }
}

/*==================big para text fade================*/
.wp-block-column .subhead {
  opacity: 0;
  transition: opacity 0.6s ease, color 0.6s ease;
}

.wp-block-column .big-paragraph .word {
  opacity: 0.12;             
  color: #f79650;           
  transition: opacity 0.6s ease, color 0.6s ease;
}

.big-paragraph .word.last-orange {
  color: #f79650 !important;
}


.wp-block-column .big-paragraph.not-ready { visibility: hidden; }
.wp-block-column .big-paragraph.ready     { visibility: visible; }


.wp-block-column.inview .subhead {    
  opacity: 1;
  color: #ffffff;
}

.wp-block-column .big-paragraph .word.shown {
  opacity: 1;
  color: #ffffff;
}


@media (prefers-reduced-motion: reduce) {
  .wp-block-column .subhead,
  .wp-block-column .big-paragraph .word {
    transition: none !important;
    opacity: 1 !important;
    color: inherit !important;
  }
}

/*fade in bg and block*/
.wp-block-cover .wp-block-cover__image-background,
.wp-block-cover .wp-block-cover__background {
  opacity: 0;
  transition: opacity 420ms ease-out;
  will-change: opacity;
}

/* interior block you want to fade second */
.fade-in-block {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 420ms ease-out, transform 420ms ease-out;
  will-change: opacity, transform;
}

/* when the section enters view: bg first */
.wp-block-cover.inview .wp-block-cover__image-background,
.wp-block-cover.inview .wp-block-cover__background {
  opacity: 1;
}

/* then content shortly after */
.wp-block-cover.inview-contents .fade-in-block {
  opacity: 1;
  transform: translateY(0);
}

/* Reduced motion: show everything, no animation */
@media (prefers-reduced-motion: reduce) {
  .wp-block-cover .wp-block-cover__image-background,
  .wp-block-cover .wp-block-cover__background,
  .fade-in-block {
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Editor-only overrides: always show content while editing */
.block-editor-page .wp-block-cover .wp-block-cover__image-background,
.block-editor-page .wp-block-cover .wp-block-cover__background,
.block-editor-page .fade-in-block,
.editor-styles-wrapper .wp-block-cover .wp-block-cover__image-background,
.editor-styles-wrapper .wp-block-cover .wp-block-cover__background,
.editor-styles-wrapper .fade-in-block {
  opacity: 1 !important;
  transform: none !important;
}


/*scroll section*/

/* 1. Section container */
.sticky-benefits {
  display: flex;
  align-items: flex-start;
  position: relative;
}

/* 2. Left column (sticky heading) */
.sticky-benefits .wp-block-column:first-child {
  position: sticky;
  top: 25vh; /* adjust: 0.25 of viewport from top */
  align-self: flex-start;
}

@media (max-width: 768px) {
  .sticky-benefits .wp-block-column:first-child {
    position: static;
    top: auto;
  }
}

/* 3. Benefit groups (default invisible / slight offset) */
.sticky-benefits .wp-block-group {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
  will-change: opacity, transform;
}

/* 4. Active benefit in view */
.sticky-benefits .wp-block-group.inview {
  opacity: 1;
  transform: translateY(0);
}

/* Reduced motion accessibility */
@media (prefers-reduced-motion: reduce) {
  .sticky-benefits .wp-block-group {
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* form styling */

.wpforms-form {
  color: var(--text-main);
  font-family: var(--font-sans-1, 'Mulish', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
}

.wpforms-form .wpforms-field {
  margin-bottom: 1.2rem;
}

.wpforms-form .wpforms-field-label {
  display: block;
  margin-bottom: 0.4rem;
  font-weight: 400;
  font-size: 0.9em;
  color: var(--text-main);
}

.wpforms-form .wpforms-required-label {
  color: var(--accent);
}

.wpforms-form .wpforms-field-description,
.wpforms-form .wpforms-field-sublabel {
  font-size: 0.85em;
  color: rgba(255, 255, 255, 0.8);
}

.wpforms-form input[type="text"],
.wpforms-form input[type="email"],
.wpforms-form input[type="url"],
.wpforms-form input[type="tel"],
.wpforms-form input[type="number"],
.wpforms-form input[type="password"],
.wpforms-form textarea {
  width: 100%;
  max-width: 100%;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.4;
  color: var(--text-main);
  background-color: rgba(4, 13, 30, 0.95);
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--radius, 30px);
  padding: 0.85em 1em;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease,
    color 0.2s ease;
}

.wpforms-form textarea {
  min-height: 8rem;
  resize: vertical;
}

.wpforms-form input::placeholder,
.wpforms-form textarea::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

.wpforms-form input[type="text"]:hover,
.wpforms-form input[type="email"]:hover,
.wpforms-form input[type="url"]:hover,
.wpforms-form input[type="tel"]:hover,
.wpforms-form input[type="number"]:hover,
.wpforms-form input[type="password"]:hover,
.wpforms-form textarea:hover {
  border-color: rgba(255, 255, 255, 0.6);
}

.wpforms-form input[type="text"]:focus,
.wpforms-form input[type="email"]:focus,
.wpforms-form input[type="url"]:focus,
.wpforms-form input[type="tel"]:focus,
.wpforms-form input[type="number"]:focus,
.wpforms-form input[type="password"]:focus,
.wpforms-form textarea:focus,
.wpforms-form input[type="text"]:focus-visible,
.wpforms-form input[type="email"]:focus-visible,
.wpforms-form input[type="url"]:focus-visible,
.wpforms-form input[type="tel"]:focus-visible,
.wpforms-form input[type="number"]:focus-visible,
.wpforms-form input[type="password"]:focus-visible,
.wpforms-form textarea:focus-visible,
.wpforms-form input[type="text"]:active,
.wpforms-form input[type="email"]:active,
.wpforms-form input[type="url"]:active,
.wpforms-form input[type="tel"]:active,
.wpforms-form input[type="number"]:active,
.wpforms-form input[type="password"]:active,
.wpforms-form textarea:active {
  outline: 0;
  border-color: var(--accent);
  background-color: rgba(7, 20, 45, 0.98);
  box-shadow:
    0 0 0 2px var(--bg-main),
    0 0 0 5px var(--accent);
}

.wpforms-form input[type="email"]:user-valid,
.wpforms-form input[type="text"]:user-valid,
.wpforms-form textarea:user-valid {
  border-color: var(--accent);
}

.wpforms-form input.wpforms-error,
.wpforms-form textarea.wpforms-error {
  border-color: #ff7070;
  background-color: rgba(40, 7, 7, 0.9);
  box-shadow:
    0 0 0 2px var(--bg-main),
    0 0 0 5px #ff7070;
}

.wpforms-form label.wpforms-error {
  margin-top: 0.3rem;
  font-size: 0.8em;
  color: #ffb3b3;
}

.wpforms-confirmation-container-full,
.wpforms-error-container-full {
  border-radius: var(--radius, 30px);
  padding: 1em 1.2em;
  font-size: 0.95em;
}

.wpforms-confirmation-container-full {
  background-color: #0f4025;
  color: #e7fff1;
}

.wpforms-error-container-full {
  background-color: #401313;
  color: #ffe6e6;
}

.wpforms-field.wpforms-field-hp,
.wpforms-form [aria-hidden="true"][tabindex="-1"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* submit button */

.wpforms-form .wpforms-submit-container {
  margin-top: 1.4rem;
}

.wpforms-container.wpforms-block button.wpforms-submit {
  all: unset;
  box-sizing: border-box;
  display: inline-block;
  appearance: none;
  border: 2px solid var(--accent) !important;
  background: transparent !important;
  color: var(--accent) !important;
  border-radius: 999px !important;
  padding: 0.7em 1.2em !important;
  font-family: var(--font-sans-1, 'Mulish', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
  font-weight: 400;
  letter-spacing: .2px;
  line-height: 1;
  cursor: pointer;
  background-image: linear-gradient(var(--accent), var(--accent)) !important;
  background-size: 0% 100% !important;
  background-repeat: no-repeat;
  background-position: left center;
  max-width: 100%;
  transition:
    background-size .25s ease,
    color .2s ease,
    transform .06s ease,
    box-shadow .2s ease,
    border-color .2s ease;
}

.wpforms-container.wpforms-block button.wpforms-submit:hover {
  background-size: 100% 100% !important;
  color: var(--ink-contrast) !important;
  border-color: var(--accent) !important;
}

.wpforms-container.wpforms-block button.wpforms-submit:focus-visible {
  outline: 0;
  background-size: 100% 100% !important;
  color: var(--ink-contrast) !important;
  box-shadow:
    0 0 0 3px var(--bg-secondary),
    0 0 0 6px var(--bg-main);
}

.wpforms-container.wpforms-block button.wpforms-submit:active {
  transform: translateY(1px);
}

@media (max-width: 600px) {
  .wpforms-container.wpforms-block button.wpforms-submit {
    display: block;
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
  }
}


/*comment form*/

.comment-form {
  color: var(--text-main);
  font-family: var(--font-sans-1, 'Mulish', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
}

.comment-form label {
  display: block;
  margin-bottom: 0.4rem;
  font-weight: 400;
  font-size: 0.9em;
  color: var(--text-main);
}

.comment-form .required {
  color: var(--accent);
}

/* text inputs and textarea */

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  max-width: 100%;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.4;
  color: var(--text-main);
  background-color: rgba(4, 13, 30, 0.95);
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--radius, 30px);
  padding: 0.85em 1em;
  margin-bottom: 1.2rem;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease,
    color 0.2s ease;
}

.comment-form textarea {
  min-height: 8rem;
  resize: vertical;
}

.comment-form input::placeholder,
.comment-form textarea::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

.comment-form input:hover,
.comment-form textarea:hover {
  border-color: rgba(255, 255, 255, 0.6);
}

.comment-form input:focus,
.comment-form textarea:focus,
.comment-form input:focus-visible,
.comment-form textarea:focus-visible {
  outline: 0;
  border-color: var(--accent);
  background-color: rgba(7, 20, 45, 0.98);
  box-shadow:
    0 0 0 2px var(--bg-main),
    0 0 0 5px var(--accent);
}

/* cookie consent checkbox */

.comment-form .comment-form-cookies-consent {
  display: flex;
  align-items: center;      /* vertical centering */
  gap: 0.6rem;
  margin-bottom: 1.2rem;
}


.comment-form .comment-form-cookies-consent input[type="checkbox"] {
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 4px;
  accent-color: var(--accent);
}

.comment-form .comment-form-cookies-consent label {
  margin: 0;
  line-height: 1.4;
  font-size: 1rem; 
  color: var(--text-main);
}

/* submit button */

.comment-form .form-submit input[type="submit"],
.comment-form .form-submit .wp-block-button__link,
.comment-form .form-submit .wp-element-button {
  all: unset;
  box-sizing: border-box;
  display: inline-block;
  cursor: pointer;

  border: 2px solid var(--accent);
  color: var(--accent);

  padding: 0.7em 1.4em;
  border-radius: 999px;

  font-family: var(--font-sans-1);
  font-weight: 400;
  letter-spacing: .2px;
  line-height: 1;

  background-image: linear-gradient(var(--accent), var(--accent));
  background-size: 0% 100%;
  background-repeat: no-repeat;
  background-position: left center;

  transition:
    background-size .25s ease,
    color .2s ease,
    transform .06s ease,
    box-shadow .2s ease,
    border-color .2s ease;
}

.comment-form .form-submit input[type="submit"]:hover,
.comment-form .form-submit .wp-block-button__link:hover,
.comment-form .form-submit .wp-element-button:hover {
  background-size: 100% 100%;
  color: var(--ink-contrast);
  border-color: var(--accent);
}

.comment-form .form-submit input[type="submit"]:focus-visible,
.comment-form .form-submit .wp-block-button__link:focus-visible,
.comment-form .form-submit .wp-element-button:focus-visible {
  outline: 0;
  background-size: 100% 100%;
  color: var(--ink-contrast);
  box-shadow:
    0 0 0 3px var(--bg-secondary),
    0 0 0 6px var(--bg-main);
}

.comment-form .form-submit input[type="submit"]:active,
.comment-form .form-submit .wp-block-button__link:active,
.comment-form .form-submit .wp-element-button:active {
  transform: translateY(1px);
}

/* mobile button */
@media (max-width: 600px) {
  .comment-form .form-submit input[type="submit"] {
    display: block;
    width: 100%;
    text-align: center;
  }
}

/*reverse order hero block*/
@media (max-width: 768px) {
  .reverse-order {
    display: flex;
    flex-direction: column-reverse;
  }
}

/*popup accessibility*/
#popmake-261 .pum-content:focus-visible,
#popmake-261 iframe:focus-visible,
#popmake-261 .pum-close:focus-visible {
  outline: 2px solid white !important; 
  outline-offset: 3px;
}

/* Make the close button a bit easier to hit and keep it visually consistent */
#popmake-261 .pum-close {
  min-width: 2.5rem;
  min-height: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* Optional: subtle hover state for mouse users */
#popmake-261 .pum-close:hover {
  color: white;
  background-color:black;
  border: 1px solid white;
}