/* HiGuppy About V5 — one presentation owner for /about-us/. */
body.hg-about-active,
html:has(body.hg-about-active) {
  background: var(--hg-shared-canvas, #fffdf8) !important;
}
body.hg-about-active :is(.page-heading,.breadcrumbs,.et-fse-page-breadcrumbs) { display:none !important; }
body.hg-about-active :is(.page-wrapper,.template-container,.template-content,.content-page,.content-page>.row,.content-page .content,.main-content,.site-main,.wp-block-post-content,.entry-content,main) {
  width:100% !important; max-width:none !important; margin:0 !important; padding-left:0 !important; padding-right:0 !important;
  background:transparent !important;
}
body.hg-about-active .content-page .content { flex:0 0 100% !important; }

.hga5,.hga5 *,.hga5 *::before,.hga5 *::after { box-sizing:border-box; }
.hga5 {
  --hga-ink:#203d32; --hga-muted:#586c62; --hga-green:#285644; --hga-green-dark:#1d4637;
  --hga-terra:#b7472c; --hga-terra-dark:#923821; --hga-line:#d8e2d8; --hga-soft:#eef5ef; --hga-sand:#f7f1e6;
  width:100%; margin:0; padding:0; overflow:hidden; background:var(--hg-shared-canvas,#fffdf8); color:var(--hga-ink);
  font-family:var(--hg-shared-body,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif); font-size:16px; line-height:1.7;
}
.hga5-wrap { width:var(--hg-layout-width,min(1280px,calc(100% - 48px))); max-width:var(--hg-layout-max,1280px); margin-inline:auto; }
.hga5 :is(h1,h2,h3) { margin:0; color:var(--hga-ink); font-family:var(--hg-shared-heading,"Baloo 2",sans-serif); font-weight:750; letter-spacing:-.025em; text-wrap:balance; }
.hga5 h1 { font-size:clamp(42px,4.4vw,64px); line-height:1.02; }
.hga5 h2 { font-size:var(--hg-type-section,clamp(26px,2.3vw,32px)); line-height:1.14; }
.hga5 h3 { font-size:var(--hg-type-subheading,22px); line-height:1.25; }
.hga5 p { margin:0; color:var(--hga-muted); font-size:16px; line-height:1.72; text-wrap:pretty; }
.hga5 a { color:var(--hga-green); }
.hga5 a:focus-visible,.hga5 summary:focus-visible { outline:3px solid #d09a50; outline-offset:3px; }

.hga5-kicker { margin:0 0 10px !important; color:#667a6f !important; font-size:12px !important; font-weight:750 !important; letter-spacing:.12em !important; line-height:1.4 !important; text-transform:uppercase; }
.hga5-lead { max-width:680px; margin-top:18px !important; font-size:18px !important; line-height:1.65 !important; color:#4f655a !important; }
.hga5-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:6px 9px; margin:0 0 18px; color:#6d7d74; font-size:13px; line-height:1.4; }
.hga5-breadcrumb a { color:inherit; text-decoration:none; }
.hga5-breadcrumb a:hover { text-decoration:underline; text-underline-offset:3px; }
.hga5-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.hga5-btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:var(--hg-control-height,44px); padding:10px 16px; border:1px solid transparent; border-radius:var(--hg-control-radius,10px); color:#fff !important; -webkit-text-fill-color:#fff !important; font-size:var(--hg-control-font,14px); font-weight:700; line-height:1.4; text-decoration:none !important; box-shadow:none; }
.hga5-btn--green { background:var(--hga-green); border-color:var(--hga-green); }
.hga5-btn--green:is(:hover,:focus-visible) { background:var(--hga-green-dark); border-color:var(--hga-green-dark); }
.hga5-btn--terra { background:var(--hga-terra); border-color:var(--hga-terra); }
.hga5-btn--terra:is(:hover,:focus-visible) { background:var(--hga-terra-dark); border-color:var(--hga-terra-dark); }
.hga5-btn span { color:#fff !important; -webkit-text-fill-color:#fff !important; }

.hga5-hero { padding:24px 0 18px; background:linear-gradient(120deg,#eef5ef 0%,#fffdf8 68%,#f7f1e6 100%); border-bottom:1px solid #e3e9df; }
.hga5-hero-grid { display:grid; grid-template-columns:minmax(0,1.04fr) minmax(380px,.96fr); gap:clamp(30px,4vw,54px); align-items:center; min-height:520px; }
.hga5-hero-copy { padding:34px 0; }
.hga5-hero-media { position:relative; min-width:0; margin:0; padding:10px; border:1px solid #d6e1d6; border-radius:26px; background:#fff; box-shadow:0 20px 54px rgba(31,69,55,.10); }
.hga5-hero-media img { display:block; width:100%; height:450px; object-fit:cover; border-radius:18px; }
.hga5-hero-media figcaption { position:absolute; left:26px; right:26px; bottom:26px; padding:14px 16px; border:1px solid rgba(255,255,255,.72); border-radius:12px; background:rgba(255,253,248,.94); backdrop-filter:blur(8px); }
.hga5-hero-media figcaption strong,.hga5-hero-media figcaption span { display:block; }
.hga5-hero-media figcaption strong { color:var(--hga-ink); font:700 16px/1.35 var(--hg-shared-body); }
.hga5-hero-media figcaption span { margin-top:3px; color:#5e7067; font:400 13px/1.5 var(--hg-shared-body); }
.hga5-trust { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.hga5-trust span { display:inline-flex; align-items:center; min-height:34px; padding:6px 10px; border:1px solid #cfddd0; border-radius:999px; background:#fffdf9; color:#385348; font-size:13px; font-weight:650; }

.hga5-proof { padding:18px 0 0; }
.hga5-proof-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid var(--hga-line); border-radius:16px; background:#fffdf9; overflow:hidden; }
.hga5-proof article { min-width:0; padding:18px 20px; border-right:1px solid var(--hga-line); }
.hga5-proof article:last-child { border-right:0; }
.hga5-proof strong,.hga5-proof span { display:block; }
.hga5-proof strong { color:var(--hga-ink); font-size:16px; line-height:1.35; }
.hga5-proof span { margin-top:5px; color:#63766c; font-size:13px; line-height:1.5; }

.hga5-section { padding:72px 0; }
.hga5-section--soft { background:#f2f7f1; border-block:1px solid #e2e9df; }
.hga5-section--sand { background:#f7f1e6; border-block:1px solid #e7ddce; }
.hga5-section-head { display:grid; grid-template-columns:minmax(0,.95fr) minmax(320px,.55fr); gap:40px; align-items:end; margin-bottom:30px; }
.hga5-section-head>p { max-width:520px; justify-self:end; }
.hga5-story { display:grid; grid-template-columns:minmax(0,.92fr) minmax(480px,1.08fr); gap:48px; align-items:center; }
.hga5-story-copy p:not(.hga5-kicker)+p { margin-top:14px; }
.hga5-story-copy h2 { margin-bottom:18px; }
.hga5-real-grid { display:grid; grid-template-columns:.86fr 1.14fr; gap:14px; align-items:stretch; }
.hga5-real-grid figure { display:flex; flex-direction:column; margin:0; padding:8px; border:1px solid var(--hga-line); border-radius:16px; background:#fff; }
.hga5-real-grid img { display:block; width:100%; height:330px; border-radius:10px; object-fit:cover; }
.hga5-real-grid figcaption { padding:10px 6px 4px; color:#607168; font-size:12px; line-height:1.55; }

.hga5-process { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.hga5-process article { min-width:0; padding:22px; border:1px solid var(--hga-line); border-radius:14px; background:#fffdf9; }
.hga5-process article>span { display:grid; place-items:center; width:34px; height:34px; margin-bottom:34px; border-radius:10px; background:#e4efe7; color:var(--hga-green); font-size:12px; font-weight:800; }
.hga5-process h3 { font-size:19px; }
.hga5-process p { margin-top:9px; font-size:14px; line-height:1.6; }

.hga5-audience { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.hga5-audience article { display:flex; min-width:0; min-height:300px; flex-direction:column; padding:24px; border:1px solid var(--hga-line); border-radius:16px; background:#fffdf9; }
.hga5-audience-label { width:fit-content; margin-bottom:30px; padding:6px 9px; border-radius:999px; background:#e6f0e8; color:#3b584b; font-size:12px; font-weight:700; }
.hga5-audience h3 { font-size:21px; }
.hga5-audience p { margin-top:10px; font-size:14px; }
.hga5-audience a { display:inline-flex; align-items:center; gap:7px; margin-top:auto; padding-top:18px; color:var(--hga-green); font-size:14px; font-weight:700; text-decoration:none; }
.hga5-audience a:hover { text-decoration:underline; text-underline-offset:3px; }

.hga5-trust-section { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:52px; align-items:start; }
.hga5-trust-section>div:first-child p:last-child { margin-top:14px; }
.hga5-trust-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.hga5-trust-list article { padding:18px; border:1px solid #dfd5c7; border-radius:13px; background:#fffaf2; }
.hga5-trust-list strong,.hga5-trust-list span { display:block; }
.hga5-trust-list strong { color:var(--hga-ink); font-size:15px; }
.hga5-trust-list span { margin-top:5px; color:#66776e; font-size:13px; line-height:1.55; }

.hga5-policy { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:52px; align-items:start; }
.hga5-policy>div:first-child p:last-child { margin-top:14px; }
.hga5-policy-links { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.hga5-policy-links a { display:flex; flex-direction:column; min-height:116px; padding:17px; border:1px solid var(--hga-line); border-radius:13px; background:#fffdf9; text-decoration:none; }
.hga5-policy-links a:is(:hover,:focus-visible) { border-color:#a8c0ab; background:#f4f8f2; }
.hga5-policy-links strong,.hga5-policy-links span { display:block; }
.hga5-policy-links strong { color:var(--hga-ink); font-size:15px; }
.hga5-policy-links span { margin-top:5px; color:#64766c; font-size:13px; line-height:1.55; }

.hga5-faq-layout { display:grid; grid-template-columns:minmax(280px,.64fr) minmax(0,1.36fr); gap:50px; align-items:start; }
.hga5-faq-intro > p:last-of-type { margin-top:14px; }
.hga5-faq-media { margin:20px 0 0; overflow:hidden; border:1px solid #cdddcf; border-radius:12px; }
.hga5-faq-media img { display:block; width:100%; height:auto; aspect-ratio:2 / 1; object-fit:cover; }
.hga5-faq details { margin:0 0 9px; border:1px solid #cdddcf; border-radius:11px; background:#fffdf9; overflow:hidden; }
.hga5-faq summary { position:relative; min-height:54px; padding:15px 52px 15px 17px; color:var(--hga-ink); font-size:15px; font-weight:700; line-height:1.55; cursor:pointer; list-style:none; }
.hga5-faq summary::-webkit-details-marker { display:none; }
.hga5-faq summary::after { content:'+'; position:absolute; top:50%; right:15px; display:grid; place-items:center; width:25px; height:25px; transform:translateY(-50%); border-radius:50%; background:var(--hga-green); color:#fff; font-size:18px; line-height:1; }
.hga5-faq details[open] summary::after { content:'−'; }
.hga5-faq details p { padding:0 17px 17px; font-size:14px; line-height:1.65; }

.hga5-cta { padding:24px 0 50px; }
.hga5-cta-inner { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:center; padding:28px 30px; border:1px solid var(--hga-line); border-radius:18px; background:linear-gradient(110deg,#eaf3ec,#f9f4e9); }
.hga5-cta h2 { max-width:700px; }
.hga5-cta p:not(.hga5-kicker) { max-width:720px; margin-top:10px; }
.hga5-cta .hga5-actions { margin-top:0; justify-content:flex-end; }

@media(max-width:1024px) {
  .hga5-hero-grid { grid-template-columns:minmax(0,1fr) minmax(330px,.8fr); gap:26px; min-height:0; }
  .hga5-hero-media img { height:390px; }
  .hga5-proof-grid,.hga5-process { grid-template-columns:1fr 1fr; }
  .hga5-proof article:nth-child(2) { border-right:0; }
  .hga5-proof article:nth-child(-n+2) { border-bottom:1px solid var(--hga-line); }
  .hga5-story { grid-template-columns:1fr; }
  .hga5-real-grid { max-width:760px; }
  .hga5-section-head,.hga5-trust-section,.hga5-policy { grid-template-columns:1fr; gap:24px; }
  .hga5-section-head>p { justify-self:start; }
  .hga5-audience { grid-template-columns:1fr 1fr; }
  .hga5-audience article:last-child { grid-column:1/-1; min-height:240px; }
}
@media(max-width:760px) {
  .hga5-hero { padding-top:14px; }
  .hga5-hero-grid { grid-template-columns:1fr; }
  .hga5-hero-copy { padding:12px 0 2px; }
  .hga5-hero h1 { font-size:clamp(36px,9vw,48px); }
  .hga5-hero-media { margin-top:6px; }
  .hga5-hero-media img { height:330px; }
  .hga5-section { padding:54px 0; }
  .hga5-audience { grid-template-columns:1fr; }
  .hga5-audience article:last-child { grid-column:auto; }
  .hga5-faq-layout { grid-template-columns:1fr; gap:24px; }
  .hga5-cta-inner { grid-template-columns:1fr; padding:24px; }
  .hga5-cta .hga5-actions { justify-content:flex-start; }
}
@media(max-width:600px) {
  .hga5-breadcrumb { margin-bottom:12px; }
  .hga5-lead { font-size:17px !important; }
  .hga5-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; gap:8px; }
  .hga5-btn { width:100%; min-width:0; padding-inline:10px; }
  .hga5-trust { display:grid; grid-template-columns:1fr 1fr; }
  .hga5-trust span { justify-content:center; text-align:center; min-height:42px; border-radius:10px; }
  .hga5-hero-media { padding:7px; border-radius:20px; }
  .hga5-hero-media img { height:265px; border-radius:14px; }
  .hga5-hero-media figcaption { left:16px; right:16px; bottom:16px; padding:11px; }
  .hga5-hero-media figcaption span { display:none; }
  .hga5-proof-grid { grid-template-columns:1fr 1fr; border-radius:13px; }
  .hga5-proof article { padding:14px; }
  .hga5-proof strong { font-size:14px; }
  .hga5-proof span { font-size:12px; }
  .hga5-real-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .hga5-real-grid figure { padding:5px; border-radius:12px; }
  .hga5-real-grid img { height:220px; }
  .hga5-real-grid figcaption { font-size:11px; padding:7px 3px 3px; }
  .hga5-process { grid-template-columns:1fr; }
  .hga5-process article>span { margin-bottom:20px; }
  .hga5-trust-list,.hga5-policy-links { grid-template-columns:1fr; }
  .hga5-policy-links a { min-height:0; }
  .hga5-cta { padding-bottom:32px; }
  .hga5-cta-inner { padding:20px; border-radius:15px; }
  .hga5-cta .hga5-actions { grid-template-columns:1fr; }
}
@media(max-width:380px) {
  .hga5-actions { grid-template-columns:1fr; }
  .hga5-real-grid { grid-template-columns:1fr; }
  .hga5-real-grid img { height:260px; }
}
@media(prefers-reduced-motion:reduce) { .hga5 * { scroll-behavior:auto !important; transition:none !important; } }

/* Final About interaction contract — beat legacy site-wide anchor color rules. */
body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn,
body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn:hover,
body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn:focus-visible,
body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn:visited,
body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn span {
  color:#fff !important; -webkit-text-fill-color:#fff !important;
}
@media(max-width:600px) {
  body.hg-about-active .hga5 .hga5-actions { grid-template-columns:1fr !important; }
  body.hg-about-active .hga5 .hga5-btn { min-height:var(--hg-control-height,44px) !important; height:auto !important; }
}

/* About is declared before the later Natural V2 layer. For important rules,
   earlier layers own the component contract and generic route rules cannot
   repaint deep-green/terra actions. */
@layer hg-about, hg-natural-v2;
@layer hg-about {
  body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn,
  body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn:is(:hover,:focus-visible,:visited),
  body.hg-about-active.higuppy-site-shell .hga5 a.hga5-btn span {
    color:#fff !important; -webkit-text-fill-color:#fff !important;
  }
}
