/* Block-theme glue on top of site.css: maps core block wrappers onto the
   static site's classes so the two render the same. */
.wp-block-post-template{list-style:none; margin:0; padding:0}
.wp-block-post-template>li{display:contents}
.wp-block-query.grid,.wp-block-query.reviews,.wp-block-query.svc-list{display:block; margin:0}
.wp-block-post-template.reviews>li{break-inside:avoid; -webkit-column-break-inside:avoid; margin:0}
.wp-block-post-template.grid{margin-top:34px}
.wp-block-post-template.reviews{margin-top:32px}
.wp-block-button__link.btn{width:auto}
.wp-block-button{display:inline-block}
.wp-block-buttons{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.hero-cta .wp-block-button__link,.page-hero .wp-block-button__link,.cta-band .wp-block-button__link{font-size:16px; padding:14px 22px}
.hdr .wp-block-button__link{font-size:14px; padding:9px 15px}
.wp-block-buttons.hero-cta{margin-top:28px}
.card .tag:empty,.svc .quote p:empty{display:none}
.faq-item{border-bottom:1px solid var(--line); padding:16px 0 18px}
.faq-item h3{font-size:16.5px; font-weight:600; letter-spacing:-.015em; margin:0 0 8px}
.faq-item .ans{padding:0}
.faq-item .ans p{margin:0 0 10px; color:var(--ink-2); font-size:15.5px}
.review .wp-block-post-title{font-size:14px; font-weight:600; margin:0; display:inline}
.review cite .src{text-transform:capitalize}
/* ---------------------------------------------------------------------------
   Gravity Forms, restyled to the comp in site/index.html.

   Gravity Forms 2.9 ships the "Orbital" framework, whose own stylesheet is
   loaded after the theme's and uses :where() plus a set of custom properties.
   Setting those properties is the supported way in, so the form follows the
   brand instead of showing Gravity Forms' default blue. The explicit rules
   below it cover the older markup and the few places Orbital wins on
   specificity.
--------------------------------------------------------------------------- */
.form-wrap .gform_wrapper{
  --gf-color-primary:var(--green);
  --gf-color-primary-contrast:var(--on-green);
  --gf-color-primary-darker:#1FA8BC;
  --gf-ctrl-btn-bg-color-primary:var(--green);
  --gf-ctrl-btn-bg-color-hover-primary:#4FD3E5;
  --gf-ctrl-btn-bg-color-focus-primary:#4FD3E5;
  --gf-ctrl-btn-color-primary:var(--on-green);
  --gf-ctrl-btn-color-hover-primary:var(--on-green);
  --gf-ctrl-btn-border-color-primary:transparent;
  --gf-ctrl-btn-font-size:15px;
  --gf-ctrl-bg-color:rgba(255,255,255,.06);
  --gf-ctrl-border-color:var(--field-line);
  --gf-ctrl-color:var(--field-ink);
  --gf-ctrl-label-color-primary:var(--field-ink-2);
  --gf-ctrl-desc-color:var(--field-ink-2);
  --gf-ctrl-radius:6px;
  --gf-local-color:var(--field-ink);
  max-width:520px;
}
.form-wrap .gform_wrapper .gform_fields{row-gap:14px}

/* Labels match the comp's .row label: Hepta Slab, small, uppercase. */
.form-wrap .gform_wrapper .gfield_label{
  font-family:var(--lbl); font-weight:600; font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--field-ink-2); margin:0 0 6px
}
/* Gravity Forms marks the required field in its own red. The comp says
   "(required)" in the label's own colour, which is the whole point of putting
   it there: it reads as part of the label, not as an error. */
.form-wrap .gform_wrapper .gfield_required,
.form-wrap .gform_wrapper .gfield_required_text,
.form-wrap .gform_wrapper .gfield_required .gfield_required{
  color:var(--field-ink-2); font:inherit; font-weight:600; margin-left:4px
}

.form-wrap .gform_wrapper input:not([type=submit]),
.form-wrap .gform_wrapper textarea,
.form-wrap .gform_wrapper select{
  font-family:var(--sans); font-size:16px; padding:12px 13px; border-radius:4px;
  border:1px solid var(--field-line); background:rgba(255,255,255,.06);
  color:var(--field-ink); width:100%; box-shadow:none
}
.form-wrap .gform_wrapper textarea{min-height:92px; resize:vertical}
.form-wrap .gform_wrapper input::placeholder,
.form-wrap .gform_wrapper textarea::placeholder{color:rgba(150,183,188,.75)}
.form-wrap .gform_wrapper input:focus,
.form-wrap .gform_wrapper textarea:focus{
  outline:2px solid var(--green); outline-offset:1px; border-color:transparent
}

/* The help text under a field sat at the same dim colour as a disabled
   control, which is below the contrast floor on the petrol field. */
.form-wrap .gform_wrapper .gfield_description{
  font-size:13px; color:var(--field-ink-2); padding:6px 0 0; opacity:1
}
.form-wrap .gform_wrapper .charleft,
.form-wrap .gform_wrapper .ginput_counter{font-size:12px; color:var(--field-ink-2)}

/* The submit button is the comp's .btn: full width, cyan, dark label. */
.form-wrap .gform_wrapper .gform_footer{margin:16px 0 0; padding:0}
.form-wrap .gform_wrapper .gform_footer input[type=submit],
.form-wrap .gform_wrapper .gform_footer .gform_button,
.form-wrap .gform_wrapper button.gform_button{
  font-family:var(--sans) !important; font-weight:600 !important;
  font-size:15px !important; letter-spacing:-.005em;
  background:var(--green) !important; color:var(--on-green) !important;
  border:0 !important; border-radius:4px !important; padding:13px 20px !important;
  width:100% !important; cursor:pointer;
  box-shadow:0 1px 0 rgba(0,0,0,.08), 0 6px 18px -8px rgba(20,112,127,.45)
}
.form-wrap .gform_wrapper .gform_footer input[type=submit]:hover,
.form-wrap .gform_wrapper button.gform_button:hover{background:#4FD3E5 !important}

/* Validation and the confirmation, on the dark field. */
.form-wrap .gform_wrapper .gfield_validation_message,
.form-wrap .gform_wrapper .validation_message{
  background:rgba(242,85,61,.12); border:0; border-left:3px solid #FF6F61;
  color:#FFB4A8; font-size:13.5px; padding:8px 12px; margin-top:6px
}
.form-wrap .gform_wrapper .gform_validation_errors{
  background:rgba(242,85,61,.12); border:1px solid rgba(255,111,97,.4);
  border-radius:4px; box-shadow:none
}
.form-wrap .gform_wrapper .gform_validation_errors h2,
.form-wrap .gform_wrapper .gform_validation_errors a{color:#FFB4A8}
.gform_confirmation_wrapper .gform_confirmation_message,
.form-wrap .gform_wrapper .gform_confirmation_message{
  background:rgba(255,255,255,.06); border:1px solid var(--field-line);
  border-radius:4px; padding:22px 24px; color:var(--field-ink-2); max-width:520px
}
.gform_confirmation_wrapper .gform_confirmation_message a{
  color:var(--field-ink); font-weight:600; white-space:nowrap
}

/* ---------------------------------------------------------------------------
   Footer contact list. The static build writes <li> with an inline icon; here
   the phone and email are bound blocks, so the icons are drawn in CSS the same
   way the header's call button draws its own.
--------------------------------------------------------------------------- */
.ftr .contact-list .wp-block-buttons{margin:0}
.ftr .contact-list>*{display:flex; gap:10px; align-items:flex-start; margin:0}
.ftr .contact-list>*::before{
  content:""; width:16px; height:16px; flex:none; margin-top:4px;
  background:var(--green); -webkit-mask-size:contain; mask-size:contain;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center; mask-position:center
}
.ftr .contact-list .ftr-phone-row::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E")
}
.ftr .contact-list .ftr-email-row::before{margin-top:5px;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E")
}
.ftr .contact-list .ftr-serving::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6-5.3-6-10a6 6 0 0 1 12 0c0 4.7-6 10-6 10z'/%3E%3Ccircle cx='12' cy='11' r='2.2'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6-5.3-6-10a6 6 0 0 1 12 0c0 4.7-6 10-6 10z'/%3E%3Ccircle cx='12' cy='11' r='2.2'/%3E%3C/svg%3E")
}
/* A bound button is the only block that can carry a link whose href and text
   both come from the business identity, so the phone, the email and the
   address are buttons here. WordPress styles every button as a full-width
   centred pill, which turned the footer email into its own centred line that
   broke mid-word. Strip the button chrome wherever one stands in for text. */
.ftr .contact-list .wp-block-button,
.spec dd .wp-block-button{width:auto; max-width:100%}
.ftr .contact-list .wp-block-button__link,
.spec dd .wp-block-button__link{
  width:auto; text-align:left; padding:0; border:0; border-radius:0;
  background:none; box-shadow:none; display:inline; min-width:0
}
.ftr .contact-list .ftr-phone{
  font-family:var(--disp); font-size:19px; font-weight:600; letter-spacing:-.02em;
  color:var(--field-ink); text-decoration:none
}
.ftr .contact-list .ftr-email{
  color:var(--field-ink-2); font-size:14.5px; text-decoration:none;
  overflow-wrap:break-word; hyphens:none
}
.ftr .contact-list .ftr-phone:hover,
.ftr .contact-list .ftr-email:hover{color:var(--field-ink); text-decoration:underline; text-underline-offset:3px}
/* The email in the contact band is a mailto link now, styled as the comp's
   underlined address rather than as a button. */
.spec dd .wp-block-buttons{margin:0}
.spec .spec-mail{
  display:inline; padding:0; background:none; border:0; border-radius:0;
  font:inherit; color:inherit; text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:rgba(232,241,248,.45); overflow-wrap:break-word
}
.spec .spec-mail:hover{text-decoration-color:currentColor}
.job-card img{width:100%; height:auto; border-radius:4px; display:block}
/* bound-button and loop wrappers */
.hdr .wp-block-buttons.hdr-call{margin-left:0}
.hdr .hdr-call .wp-block-button__link{display:inline-flex; align-items:center; gap:10px; font-family:var(--sans); font-weight:600; font-size:14px; padding:9px 15px; border-radius:4px; background:var(--green); color:var(--on-green); text-decoration:none}
.hdr .hdr-call .wp-block-button__link::before{content:""; width:16px; height:16px; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E") center/contain no-repeat}
@media(max-width:900px){.hdr .hdr-call .wp-block-button__link{font-size:0; padding:10px 12px} .hdr .hdr-call .wp-block-button__link::before{width:18px; height:18px}}
.wp-block-button__link.btn::before,.wp-block-button__link.callbar::before{content:""; width:18px; height:18px; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E") center/contain no-repeat}
.wp-block-buttons.hero-cta{display:inline-flex; margin:28px 12px 0 0; vertical-align:middle}
.hero-ghost{display:inline-block; margin:28px 0 0; vertical-align:middle}
.callbar-wrap,.callbar-wrap .wp-block-button{display:contents}
.wp-block-button__link.callbar{
  position:fixed; left:0; right:0; bottom:0; z-index:50; display:none;
  box-sizing:border-box; width:auto; min-width:0; max-width:none; height:auto; min-height:0;
  border:0; border-top:1px solid rgba(0,0,0,.12); border-radius:0; box-shadow:none;
  background:var(--green); color:var(--on-green); text-decoration:none;
  font-family:var(--sans); font-weight:700; font-size:18px; line-height:1.2;
  align-items:center; justify-content:center; gap:10px;
  padding:15px; padding-bottom:calc(15px + env(safe-area-inset-bottom,0px))
}
@media(max-width:900px){.wp-block-button__link.callbar{display:flex}}
.ftr .contact-list{display:grid; gap:10px}
.ftr .contact-list .wp-block-buttons{margin:0}
.ftr .ftr-phone{font-family:var(--disp); font-weight:600; font-size:20px; letter-spacing:-.02em; color:var(--field-ink); background:none; padding:0; text-decoration:none}
.ftr .ftr-email,.ftr .ftr-serving{margin:0; color:var(--field-ink)}
.ccard .wp-block-button__link.big{font-family:var(--disp); font-weight:600; font-size:20px; letter-spacing:-.02em; color:var(--ink); background:none; padding:0; text-decoration:none}
.ccard p.big{font-family:var(--disp); font-weight:600; font-size:16px; letter-spacing:-.02em; color:var(--ink); margin:0; word-break:break-all}
.contact .wp-block-buttons{margin-top:18px}
.spec dd .wp-block-group{margin:0}
.spec dd p{margin:0; font-size:16px; font-weight:600; color:var(--field-ink)}
.svc .quote .quote-by{font-family:var(--sans); font-weight:600; font-size:13.5px; font-style:normal; color:var(--ink-3); margin:0}
.svc .signs-text{white-space:pre-line; color:var(--ink); font-size:15px; margin:0; line-height:1.9}
.svc .meta .svc-photo{margin:-20px -22px 16px}
.svc .meta .svc-photo img{display:block; width:100%; height:auto; border-radius:0}
.svc .meta .svc-photo:empty{display:none}
.review .cite{display:flex; align-items:center; gap:6px; font-family:var(--sans); font-weight:600; font-size:14px; font-style:normal; color:var(--ink-2); border-top:1px solid var(--line); padding-top:14px}
.review .cite>*{flex:0 0 auto; width:auto; margin:0}
.review .cite .src::before{content:"· "}
.review .wp-block-post-content p{margin:12px 0 18px; font-size:15.5px; color:var(--ink-2)}
.card .wp-block-post-title{font-size:18px; font-weight:600; margin:0 0 8px}
.card>p{color:var(--ink-2); font-size:15px}
.job-card .tag{margin-top:12px}

/* The emblem is a watermark, not a picture: it sits behind the columns, so it
   has to stay out of the way of the text on top of it. */
.ftr .wm{right:-40px; top:auto; bottom:-30px; width:min(220px,24vw); opacity:.05}
@media(max-width:1100px){.ftr .wm{display:none}}

/* Fairway (0.7.1): block-markup details the static build does not have. */
.wp-block-button__link.btn{border-radius:4px}
.card .wp-block-post-featured-image a{display:block; height:100%}
.card .wp-block-post-featured-image:empty{display:none}
.band--stripes .wp-block-post-template.reviews{display:grid; grid-template-columns:1fr; gap:0; columns:auto}
.cta-band .wp-block-button__link{background:var(--navy); color:#fff}

/* 0.7.2: block-markup details for the reviews loop and footer */
.band--stripes .review .wp-block-post-content p,.band--stripes .review .wp-block-post-content{color:var(--navy-deep)}
.review .cite .wp-block-post-title{font:600 15px/1.3 var(--sans); letter-spacing:0; text-transform:none; margin:0; display:inline}
.review .cite .src{display:inline; margin:0}
.band--stripes .reviews>li:first-child>.review .cite .wp-block-post-title,.band--stripes .reviews>li:first-child>.review .cite .src{font:700 12.5px/1 var(--lbl); letter-spacing:.14em; text-transform:uppercase}
.ftr .ftr-phone-row{display:none}
.ftr .ftr-email{white-space:normal; overflow-wrap:normal; word-break:normal}

/* 0.7.7: the reviews leaderboard in block markup. One column of scorecards,
   the first quote in the slab at reading size, the name strip on top. */
.band--stripes .review .wp-block-post-content{order:0}
.band--stripes .reviews>li:first-child>.review .wp-block-post-content p{font:600 19px/30px var(--slab); letter-spacing:0; background:repeating-linear-gradient(transparent 0 29px,rgba(19,41,75,.09) 29px 30px)}
.band--stripes .review .cite .wp-block-post-title,.band--stripes .review .cite .src{font:700 12px/1.2 var(--lbl); letter-spacing:.14em; text-transform:uppercase; color:var(--navy-deep); display:inline; margin:0}
.band--stripes .review .cite .src::before{content:"\00B7  "}

/* 0.7.9: the Gravity Forms send spinner sits inside the button at button
   size. Without a size it drew a ring wider than the button on submit. */
.gform_wrapper .gform-loader,.gform_wrapper .gform_ajax_spinner{width:22px!important; height:22px!important; max-width:22px; max-height:22px; border-width:3px!important; margin:0!important}
