/*
Theme Name: TRA Modern Blocks
Theme URI: https://theriot.agency
Author: TheRiot Agency
Description: Block-theme version of TRA Modern — the GrowthOS WP Builder factory base. Same brand design, now editable in the Site Editor and generatable from a Site Blueprint. Sections ship as block patterns.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
*/

:root{
  --green:#65bc7b; --green-dark:#5aa86c; --olive:#aebf52; --navy:#212934;
  --ink:#181c1c; --gray:#3e3e3e; --muted:#6b7280; --line:#e6e6e6;
  --bg:#ffffff; --bg-soft:#f6f8f7; --radius:18px;
  --shadow:0 10px 40px -12px rgba(24,28,28,.18); --maxw:1180px;
}

body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:'Space Grotesk','Inter',sans-serif;line-height:1.08;letter-spacing:-.02em;font-weight:600}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.grad-text{background:linear-gradient(100deg,var(--green),var(--olive));-webkit-background-clip:text;background-clip:text;color:transparent}
/* Gradient text loses to imagery. Over hero photos and tinted bands the mid-tone green->olive
   clip blends straight into the backdrop - the hero's key word kept vanishing ("Your Reli...").
   On those surfaces the clip switches to a high-luminance pastel ramp and gains a drop-shadow:
   text-shadow paints OVER clipped glyphs, but filter:drop-shadow follows the rendered alpha,
   so the phrase stays separated on any backdrop the design layer picks. */
.hero .grad-text,.cta .grad-text,.sec.bg-brand .grad-text,.sec.bg-dark .grad-text{
  background:linear-gradient(100deg,#dcf6e4,#f0f8da);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 1px 6px rgba(8,14,18,.55));
}

/* --green is whatever the client set as PRIMARY, and plenty of brands set a dark neutral:
   charcoal or near-black with one bright accent. The eyebrow pill and the hero CTA both paint
   themselves in the primary and both sit on the dark hero, so on those brands they vanished -
   charcoal text in a charcoal pill on a charcoal hero, and a button that read as an empty
   shape. --olive (the accent) is the colour guaranteed to work here: the palette guard lifts
   it until it clears 3:1 against the dark sections specifically.
   Scoped to dark surfaces only - on light sections the primary is right and stays. */
.hero .eyebrow,.cta .eyebrow,.sec.bg-dark .eyebrow,.sec.bg-brand .eyebrow{
  color:var(--olive);
  background:color-mix(in srgb, var(--olive) 14%, transparent);
  border-color:color-mix(in srgb, var(--olive) 34%, transparent);
}
/* The dot's fill is an inline style on the span, so this has to outrank it. */
.hero .eyebrow .dot,.cta .eyebrow .dot,.sec.bg-dark .eyebrow .dot,.sec.bg-brand .eyebrow .dot{
  background:var(--olive) !important;
}
.hero .btn-primary,.cta .btn-primary,.sec.bg-dark .btn-primary,.sec.bg-brand .btn-primary{
  background:linear-gradient(120deg,var(--olive),var(--green-dark));
  color:#11161a;
  box-shadow:0 8px 22px -8px color-mix(in srgb, var(--olive) 70%, transparent);
}

/* Header */
.site-header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(180%) blur(14px);background:rgba(255,255,255,.78);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{font-family:'Space Grotesk';font-weight:700;font-size:22px;letter-spacing:-.03em;display:flex;align-items:center;gap:9px}
.brand .dot{width:11px;height:11px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--olive));box-shadow:0 0 0 4px rgba(101,188,123,.18)}
.brand b{color:var(--green-dark)}
.brand-logo{height:34px;width:auto;display:block}
.site-footer .brand-logo{filter:brightness(0) invert(1)}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a{font-size:15px;font-weight:500;color:var(--gray);transition:color .2s}
.nav-links a:hover{color:var(--ink)}
.nav-links ul.nav-menu{display:flex;gap:30px;align-items:center;list-style:none;margin:0;padding:0}
.nav-links li{position:relative}
.nav-links .sub-menu{position:absolute;top:100%;left:0;display:none;flex-direction:column;min-width:210px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:0 14px 34px -12px rgba(20,30,40,.22);list-style:none;margin:0;z-index:60}
.nav-links li:hover>.sub-menu{display:flex}
.nav-links .sub-menu a{white-space:nowrap;display:block;padding:9px 12px;border-radius:8px}
.nav-links .sub-menu a:hover{background:rgba(101,188,123,.12);color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;padding:12px 22px;border-radius:999px;transition:transform .15s ease,box-shadow .2s ease}
.btn-primary{background:linear-gradient(120deg,var(--green),var(--green-dark));color:#fff;box-shadow:0 8px 22px -8px rgba(101,188,123,.7)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{border:1px solid rgba(255,255,255,.25);color:#fff}
.btn-dark{background:var(--ink);color:#fff}
@media(max-width:860px){.nav-links{display:none}}

/* Hero */
.hero{position:relative;overflow:hidden;background:radial-gradient(120% 120% at 80% -10%,#2c3a44 0%,var(--navy) 45%,var(--ink) 100%);color:#fff}
/* The scrim the learned rule keeps asking for: hero copy sits over a photograph whose bright
   patches (sky, rooflines) eat white text. Above the .img-bg photo (z0) and orbs (z1), below
   .wrap (z2); heavier where the copy starts, fading right so the subject stays visible. */
.hero::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(9,15,19,.52) 0%,rgba(9,15,19,.34) 46%,rgba(9,15,19,.10) 80%)}
.hero .wrap{padding-top:96px;padding-bottom:110px;position:relative;z-index:2}
.orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;z-index:1}
.orb.a{width:420px;height:420px;background:var(--green);top:-120px;right:-60px}
.orb.b{width:360px;height:360px;background:var(--olive);bottom:-160px;left:-80px;opacity:.4}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--green);background:rgba(101,188,123,.12);border:1px solid rgba(101,188,123,.3);padding:7px 16px;border-radius:999px}
.hero h1{font-size:clamp(40px,7vw,76px);margin:26px 0 22px;max-width:14ch}
.hero p.lede{font-size:clamp(17px,2.2vw,22px);color:#c7d0d6;max-width:54ch;margin-bottom:36px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.stats{display:flex;gap:48px;margin-top:64px;flex-wrap:wrap}
.stat .n{font-family:'Space Grotesk';font-size:40px;font-weight:700;color:#fff}
.stat .l{font-size:14px;color:#9fb0b8}

/* Band */
.band{background:var(--bg-soft);border-bottom:1px solid var(--line)}
.band .wrap{padding:70px 24px;text-align:center}
.band h2{font-size:clamp(26px,4vw,40px);max-width:20ch;margin:0 auto 14px}
.band p{color:var(--muted);font-size:18px;max-width:60ch;margin:0 auto}

/* Sections */
.section{padding:96px 0}
.section-head{max-width:60ch;margin-bottom:48px}
.section-head .kicker{color:var(--green-dark);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:13px}
.section-head h2{font-size:clamp(28px,4.5vw,46px);margin:12px 0}
.section-head p{color:var(--muted);font-size:18px}

/* Cards */
.grid{display:grid;gap:20px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid-3,.grid-4{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(101,188,123,.5)}
.card .ic{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;color:var(--green-dark);background:linear-gradient(135deg,rgba(101,188,123,.16),rgba(171,187,99,.16));margin-bottom:18px;transition:.2s}
.card:hover .ic{background:linear-gradient(135deg,var(--green),var(--green-dark));color:#fff}
.card .ic svg{width:24px;height:24px}
.card h3{font-size:20px;margin-bottom:8px}
.card p{color:var(--muted);font-size:15px}

/* GrowthOS */
.os{background:var(--ink);color:#fff;border-radius:28px;padding:64px;position:relative;overflow:hidden}
.os .orb.c{width:340px;height:340px;background:var(--green);top:-100px;right:-40px;opacity:.35}
.os .inner{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
@media(max-width:860px){.os{padding:40px}.os .inner{grid-template-columns:1fr;gap:28px}}
.os h2{font-size:clamp(28px,4vw,44px)}
.os p{color:#c7d0d6;font-size:17px;margin-top:16px}
.os-steps{display:flex;flex-direction:column;gap:14px}
.os-step{display:flex;gap:16px;align-items:flex-start;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px}
.os-step .num{font-family:'Space Grotesk';font-weight:700;color:var(--green);font-size:18px;min-width:28px}
.os-step h4{font-size:17px;margin-bottom:2px}
.os-step span{color:#9fb0b8;font-size:14px}

/* Industries */
.tags{display:flex;flex-wrap:wrap;gap:12px}
.tag{border:1px solid var(--line);background:#fff;border-radius:999px;padding:11px 20px;font-weight:500;font-size:15px;color:var(--gray);transition:.2s}
.tag:hover{border-color:var(--green);color:var(--ink);background:rgba(101,188,123,.06)}

/* CTA */
.cta{background:linear-gradient(120deg,var(--green),var(--green-dark));border-radius:28px;padding:72px;text-align:center;color:#fff}
.cta h2{font-size:clamp(30px,5vw,52px);margin-bottom:16px}
.cta p{font-size:19px;opacity:.92;margin-bottom:32px;max-width:50ch;margin-left:auto;margin-right:auto}

/* Inner page header */
.page-hero{position:relative;overflow:hidden;background:radial-gradient(120% 140% at 85% -20%,#2c3a44 0%,var(--navy) 50%,var(--ink) 100%);color:#fff}
.page-hero .wrap{padding:84px 24px 72px;position:relative;z-index:2}
.page-hero h1{font-size:clamp(36px,6vw,60px);margin:18px 0 16px;max-width:18ch}
.page-hero p{font-size:clamp(17px,2vw,20px);color:#c7d0d6;max-width:56ch}

/* Split / prose */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
/* A split whose media slot is unfilled. One column, and the measure is held so the copy
   does not run the full band width -- an unbroken 1180px line is its own readability
   problem, and it is what the reviewer marks as 'competing left edges'. */
.split-solo{grid-template-columns:minmax(0,68ch);justify-content:center}
@media(max-width:840px){.split{grid-template-columns:1fr;gap:32px}}
.prose p{color:var(--gray);font-size:17px;margin-bottom:18px}
.lead{font-size:21px;color:var(--ink);font-weight:500;line-height:1.5}
.value{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line)}
.value .ic{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:var(--green-dark);background:linear-gradient(135deg,rgba(101,188,123,.16),rgba(171,187,99,.16))}
.value .ic svg{width:22px;height:22px}
.value h4{font-size:18px;margin-bottom:4px}
.value p{color:var(--muted);font-size:15px;margin:0}

/* Contact form */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
@media(max-width:840px){.contact-grid{grid-template-columns:1fr;gap:32px}}
.field{margin-bottom:18px}
.field label{display:block;font-size:14px;font-weight:600;margin-bottom:7px;color:var(--gray)}
.field input,.field textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:12px;font:inherit;font-size:15px;background:#fff;transition:border-color .2s,box-shadow .2s}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(101,188,123,.16)}
.field textarea{min-height:130px;resize:vertical}
.notice{padding:14px 18px;border-radius:12px;margin-bottom:22px;font-size:15px}
.notice.ok{background:rgba(101,188,123,.12);border:1px solid rgba(101,188,123,.4);color:var(--green-dark)}
.notice.err{background:#fdecec;border:1px solid #f3c0c0;color:#b23b3b}
.contact-card{background:var(--ink);color:#fff;border-radius:var(--radius);padding:36px}
.contact-card h3{font-size:22px;margin-bottom:18px}
.contact-card a{color:var(--green);font-weight:600}
.contact-line{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08);color:#c7d0d6;font-size:15px}
.contact-line .ic{color:var(--green)}

/* Footer */
.site-footer{background:var(--ink);color:#9fb0b8;padding:64px 0 36px}
.foot-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:32px}
.site-footer .brand{color:#fff}
.foot-cols{display:flex;gap:64px;flex-wrap:wrap}
.foot-col h5{color:#fff;font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.foot-col a{display:block;font-size:14px;margin-bottom:9px;transition:color .2s}
.foot-col a:hover{color:var(--green)}
.foot-bottom{padding-top:24px;font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

/* Image slots + size badges (placeholder spec) */
.img-slot{position:relative;display:block;border-radius:var(--radius);overflow:hidden;line-height:0;border:1px solid var(--line)}
.img-slot img{width:100%;height:auto;display:block}
.img-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.img-bg img{width:100%;height:100%;object-fit:cover;opacity:.22}
.img-badge{position:absolute;top:14px;left:14px;z-index:4;background:rgba(24,28,28,.86);color:#fff;font-size:12px;font-weight:600;line-height:1.25;padding:8px 12px;border-radius:10px;border:1px solid rgba(101,188,123,.55);display:inline-flex;flex-direction:column;gap:2px;max-width:240px;text-align:left}
.img-badge small{font-weight:400;color:#9fb0b8;font-size:10px;letter-spacing:.02em}
.img-badge-corner{top:18px;right:18px;left:auto}

/* ==========================================================================
   SECTION LIBRARY  (inc/sections.php — the tra/sec block)
   The vetted visual vocabulary. Every generated page is composed from these,
   so layout variety comes from picking sections, never from AI-authored CSS.
   ========================================================================== */

/* --- surfaces: alternating backgrounds are what give a page rhythm --------- */
.sec{padding:96px 0}
.sec.bg-light{background:var(--bg)}
.sec.bg-tint{background:var(--bg-soft)}
.sec.bg-dark{background:var(--ink);color:#c7d0d6}
.sec.bg-brand{background:linear-gradient(120deg,var(--green),var(--green-dark));color:#fff}
.sec.bg-dark h2,.sec.bg-dark h3,.sec.bg-dark h4,.sec.bg-brand h2,.sec.bg-brand h3,.sec.bg-brand h4{color:#fff}
.sec.bg-dark .section-head p{color:#9fb0b8}
.sec.bg-brand .section-head p,.sec.bg-brand .prose p{color:rgba(255,255,255,.92)}
.sec.bg-brand .section-head .kicker{color:rgba(255,255,255,.85)}
.sec.is-boxed{padding:0 0 96px}
.sec.bg-tint + .sec.bg-tint{padding-top:0}   /* two tints in a row read as one surface */
.sec:last-child{padding-bottom:110px}
@media(max-width:860px){.sec{padding:64px 0}.sec.is-boxed{padding:0 0 64px}}

.section-head.is-center{margin-left:auto;margin-right:auto;text-align:center}
.section-head.is-center p{margin-left:auto;margin-right:auto}

/* --- cards: 2-up shares the grid rules already defined for 3/4-up ---------- */
.grid-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:700px){.grid-2{grid-template-columns:1fr}}
.sec.bg-dark .card,.sec.bg-brand .card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#c7d0d6}
.sec.bg-dark .card p,.sec.bg-brand .card p{color:#9fb0b8}
.sec.bg-tint .card{background:#fff}

/* --- feature list: denser than cards, reads well beside a split image ------ */
.feature-list .value:last-child{border-bottom:none}
.feature-list.is-compact{margin-top:26px}
.feature-list.is-compact .value{padding:14px 0}
.sec.bg-dark .value,.sec.bg-brand .value{border-bottom-color:rgba(255,255,255,.1)}
.sec.bg-dark .value p,.sec.bg-brand .value p{color:#9fb0b8}

/* --- split: image beside prose. The main antidote to a wall of text. ------- */
.split-media .img-slot{box-shadow:var(--shadow)}
.split-text .section-head{margin-bottom:22px}
.split-text .hero-cta{margin-top:28px}
.split-text .prose p:last-child{margin-bottom:0}

/* --- steps: numbered process, laid out as a grid on wide screens ----------- */
.os-steps.is-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.sec.bg-light .os-step,.sec.bg-tint .os-step{background:#fff;border-color:var(--line)}
.sec.bg-light .os-step span,.sec.bg-tint .os-step span{color:var(--muted)}
.sec.bg-light .os-step h4,.sec.bg-tint .os-step h4{color:var(--ink)}
.os-step .num{font-variant-numeric:tabular-nums}

/* --- stats band ----------------------------------------------------------- */
.stats.is-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:32px;margin-top:0;text-align:center}
.stats.is-band .stat{padding:8px 0}
.sec.bg-light .stat .n,.sec.bg-tint .stat .n{color:var(--ink)}
.sec.bg-light .stat .l,.sec.bg-tint .stat .l{color:var(--muted)}
.sec.bg-brand .stat .n,.sec.bg-brand .stat .l{color:#fff}

/* --- logo wall ------------------------------------------------------------ */
.logo-wall{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;align-items:center}
.logo-cell{display:grid;place-items:center;min-height:78px;padding:16px 20px;border:1px solid var(--line);border-radius:14px;background:#fff}
.logo-cell span{font-family:'Space Grotesk','Inter',sans-serif;font-weight:600;font-size:16px;color:var(--gray);letter-spacing:-.01em;text-align:center;line-height:1.25}
.logo-cell img{max-width:100%;max-height:44px;width:auto;height:auto;object-fit:contain}
.sec.bg-dark .logo-cell,.sec.bg-brand .logo-cell{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.sec.bg-dark .logo-cell span,.sec.bg-brand .logo-cell span{color:#e7edf0}

/* --- testimonials --------------------------------------------------------- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.quotes.is-solo{grid-template-columns:1fr;max-width:820px;margin:0 auto;text-align:center}
.quote{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px}
.quote blockquote{margin:0;font-family:'Space Grotesk','Inter',sans-serif;font-size:clamp(18px,2.4vw,24px);line-height:1.4;letter-spacing:-.01em;color:var(--ink)}
.quote blockquote::before{content:'\201C';color:var(--green);font-size:52px;line-height:0;vertical-align:-14px;margin-right:4px}
.quote figcaption{margin-top:20px;font-size:14px;color:var(--muted);display:flex;flex-direction:column;gap:2px}
.quotes.is-solo figcaption{align-items:center}
.quote figcaption strong{color:var(--ink);font-size:15px}
.sec.bg-dark .quote,.sec.bg-brand .quote{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.sec.bg-dark .quote blockquote,.sec.bg-brand .quote blockquote,.sec.bg-dark .quote figcaption strong,.sec.bg-brand .quote figcaption strong{color:#fff}
.sec.bg-tint .quote{background:#fff}

/* --- FAQ: <details>, so it works with no JavaScript ----------------------- */
.faq{max-width:820px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative;font-family:'Space Grotesk','Inter',sans-serif;font-weight:600;font-size:18px;color:var(--ink)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'';position:absolute;right:8px;top:50%;width:10px;height:10px;border-right:2px solid var(--green);border-bottom:2px solid var(--green);transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.faq-item[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq-item p{padding:0 44px 22px 0;color:var(--muted);font-size:16px;margin:0}
.sec.bg-dark .faq-item{border-bottom-color:rgba(255,255,255,.1)}
.sec.bg-dark .faq-item summary{color:#fff}

/* --- pricing -------------------------------------------------------------- */
.pricing .tier{display:flex;flex-direction:column;align-items:flex-start;position:relative}
.pricing .tier.is-featured{border-color:var(--green);box-shadow:var(--shadow)}
.tier-flag{position:absolute;top:-11px;left:28px;background:linear-gradient(120deg,var(--green),var(--green-dark));color:#fff;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
.tier-price{font-family:'Space Grotesk','Inter',sans-serif;font-size:38px;font-weight:700;letter-spacing:-.03em;margin:6px 0 10px;color:var(--ink)}
.tier-feats{list-style:none;margin:18px 0 24px;padding:0;width:100%}
.tier-feats li{position:relative;padding:9px 0 9px 26px;font-size:15px;color:var(--gray);border-top:1px solid var(--line)}
.tier-feats li::before{content:'';position:absolute;left:2px;top:16px;width:11px;height:6px;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}
.pricing .tier .btn{margin-top:auto}

/* --- gallery -------------------------------------------------------------- */
.gallery-cell .cap{margin-top:12px;font-size:14px;color:var(--muted)}

/* --- prose column: long-form held to a readable measure ------------------- */
.prose-column{max-width:72ch}
.prose-column .prose p{font-size:17px}

/* --- centered statement band --------------------------------------------- */
.banner-inner{text-align:center;max-width:760px;margin:0 auto}
.banner-inner .hero-cta{justify-content:center;margin-top:28px}

/* Block theme resets so full-bleed sections work */
.wp-site-blocks{overflow-x:hidden}
.is-layout-constrained > .alignfull{margin-left:0;margin-right:0}