/*
Theme Name:   Astra Child
Theme URI:    https://urbanhydrospace.com
Description:  Child theme for Urban Hydro Space. Holds the custom site footer that previously lived in Code Snippets id 9, plus the small layout fixes that went with it.
Author:       Urban Hydro Space
Template:     astra
Version:      1.0.0
Text Domain:  astra-child
*/

/* ------------------------------------------------------------------
   Mobile sidebar clearance.
   Carried over from snippet 9. Nothing to do with the footer itself,
   but the footer needs the sidebar to have cleared before it starts.
   ------------------------------------------------------------------ */
@media (max-width: 768px) {
  #secondary.widget-area,
  .ast-right-sidebar #secondary,
  .ast-left-sidebar #secondary { float: none !important; width: 100% !important; clear: both !important; }
  .uhs-ft { clear: both !important; position: relative !important; z-index: 1 !important; }
}

/* ------------------------------------------------------------------ FOOTER */
.uhs-ft{background:#1B2E1E;color:rgba(255,255,255,.7);font-family:'DM Sans',system-ui,sans-serif;padding:4rem 2rem 0;width:100%;box-sizing:border-box}
.uhs-ft-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr 1.3fr;gap:2.5rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.08)}
.uhs-ft-logo{font-family:'Playfair Display',Georgia,serif;font-size:1.3rem;font-weight:700;color:#fff;text-decoration:none;display:flex;align-items:center;gap:.6rem;margin-bottom:1rem}
.uhs-ft-logo-icon{width:32px;height:32px;background:rgba(255,255,255,.1);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.uhs-ft-brand p{font-size:.85rem;line-height:1.75;color:rgba(255,255,255,.6);margin-bottom:1.2rem;font-weight:400}
.uhs-ft-email{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:rgba(255,255,255,.58);text-decoration:none;transition:color .2s}
.uhs-ft-email:hover{color:#D4E8D8}
.uhs-ft-col h4{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#7AAE87;margin-bottom:1.2rem;margin-top:0}
.uhs-ft-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.6rem}
.uhs-ft-col ul li a{font-size:.88rem;color:rgba(255,255,255,.6);text-decoration:none;transition:color .2s;font-weight:400}
.uhs-ft-col ul li a:hover{color:#D4E8D8}
.uhs-ft-col.uhs-ft-tools ul li a{color:rgba(212,232,216,.68)}
.uhs-ft-col.uhs-ft-tools ul li a:hover{color:#D4E8D8}
.uhs-ft-nl p{font-size:.82rem;color:rgba(255,255,255,.58);line-height:1.7;margin-bottom:1rem;font-weight:400}
.uhs-ft-note{font-size:.72rem;color:rgba(255,255,255,.45);line-height:1.5;display:block;margin-top:.6rem}
.uhs-ft-note a{color:rgba(255,255,255,.55);text-decoration:underline}
.uhs-ft-jump{display:inline-block;background:#4A7A55;color:#fff;border-radius:8px;padding:.65rem 1.1rem;font-size:.85rem;font-weight:500;text-decoration:none;transition:background .2s}
.uhs-ft-jump:hover{background:#2d5c3a;color:#fff}

/* Keyboard focus. Every footer link was previously reliant on the browser
   default outline, which is invisible against #1B2E1E on several browsers. */
.uhs-ft a:focus-visible{outline:2px solid #7AAE87;outline-offset:3px;border-radius:3px}

/* WPForms restyle, scoped to the footer column only */
.uhs-ft-formwrap .wpforms-container{margin:0 !important}
.uhs-ft-formwrap .wpforms-form{width:100% !important}
.uhs-ft-formwrap .wpforms-field{padding:0 0 .6rem !important;margin:0 !important}
.uhs-ft-formwrap .wpforms-field-row{display:flex !important;flex-direction:column !important;gap:.6rem !important;width:100% !important;max-width:100% !important}
.uhs-ft-formwrap .wpforms-one-half,
.uhs-ft-formwrap .wpforms-first,
.uhs-ft-formwrap .wpforms-field-row-block{width:100% !important;max-width:100% !important;margin:0 !important;float:none !important}
/* Footer collects email only. Name is still collected by the same form on the
   homepage, where there is room for it and the visitor has more context. */
.uhs-ft-formwrap #wpforms-3982-field_1-container{display:none !important}
.uhs-ft-formwrap .wpforms-field-sublabel{display:none !important}
.uhs-ft-formwrap .wpforms-field-hp{display:none !important;visibility:hidden !important;position:absolute !important;left:-9999px !important}
.uhs-ft-formwrap .wpforms-field-label{color:rgba(255,255,255,.78) !important;font-size:.78rem !important;font-weight:500 !important;margin:0 0 .3rem !important;display:block !important}
.uhs-ft-formwrap input[type=text],
.uhs-ft-formwrap input[type=email]{background:rgba(255,255,255,.08) !important;border:1px solid rgba(255,255,255,.15) !important;border-radius:8px !important;padding:.65rem .9rem !important;color:#fff !important;font-family:inherit !important;font-size:.85rem !important;width:100% !important;max-width:100% !important;box-sizing:border-box !important}
.uhs-ft-formwrap input[type=text]::placeholder,
.uhs-ft-formwrap input[type=email]::placeholder{color:rgba(255,255,255,.35) !important}
.uhs-ft-formwrap input[type=text]:focus,
.uhs-ft-formwrap input[type=email]:focus{border-color:#7AAE87 !important;outline:none !important;box-shadow:0 0 0 3px rgba(122,174,135,.2) !important}
.uhs-ft-formwrap button[type=submit],
.uhs-ft-formwrap .wpforms-submit{background:#4A7A55 !important;color:#fff !important;border:none !important;border-radius:8px !important;padding:.65rem !important;font-family:inherit !important;font-size:.85rem !important;font-weight:500 !important;cursor:pointer !important;width:100% !important;transition:background .2s !important;margin-top:.2rem !important}
.uhs-ft-formwrap button[type=submit]:hover,
.uhs-ft-formwrap .wpforms-submit:hover{background:#2d5c3a !important}
.uhs-ft-formwrap .wpforms-error{color:#ffb3b3 !important;font-size:.72rem !important;margin-top:.25rem !important}
.uhs-ft-formwrap .wpforms-confirmation-container-full{background:rgba(212,232,216,.12) !important;color:#D4E8D8 !important;border:1px solid rgba(212,232,216,.25) !important;border-radius:8px !important;padding:1rem !important;font-size:.85rem !important;text-align:center !important}
.uhs-ft-bottom{max-width:1100px;margin:0 auto;padding:1.5rem 0;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.uhs-ft-copy{font-size:.78rem;color:rgba(255,255,255,.5)}
.uhs-ft-copy a{color:rgba(255,255,255,.55);text-decoration:none}
.uhs-ft-copy a:hover{color:#7AAE87}
.uhs-ft-aff{font-size:.72rem;color:rgba(255,255,255,.45);max-width:500px;text-align:right;line-height:1.5}
.uhs-ft-aff a{color:rgba(255,255,255,.55);text-decoration:underline}
@media(max-width:900px){
  .uhs-ft-grid{grid-template-columns:1fr 1fr;gap:2rem}
  .uhs-ft-brand{grid-column:1/-1}
}
@media(max-width:560px){
  .uhs-ft-grid{grid-template-columns:1fr}
  .uhs-ft-bottom{flex-direction:column;align-items:flex-start}
  .uhs-ft-aff{text-align:left}
}

/* ==================================================================
   READING MEASURE

   Single posts run a right sidebar inside a 1200px container, which
   leaves a text column near 860px. At 16px that is roughly 108
   characters per line, about half again the comfortable 65 to 75.
   Long lines lose the reader at the line return, and this site averages
   3,481 words a post.

   Scoped to running text only. Tables, images, callout boxes and the
   table of contents keep the full column width, because those are
   scanned rather than read line by line.
   ================================================================== */
.single-post .entry-content > p,
.single-post .entry-content > ul,
.single-post .entry-content > ol,
.single-post .entry-content .schema-faq-answer > p,
.single-post .entry-content .schema-faq-answer {
  max-width: 68ch;
}

/* Balances the ragged right edge without hyphenating. */
.single-post .entry-content > p { text-wrap: pretty; }

/* Stops a single word being left alone on a heading's last line. */
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4,
.entry-title, .site-title, .uhs-ft-col h4 { text-wrap: balance; }

/* Table of contents links used to jump instantly. The header already sets
   scroll-margin-top: 90px so the sticky bar does not cover the target. */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ==================================================================
   CALLOUT CONTRAST

   All seven label colours in style-guide.md failed WCAG AA, measured
   with the impeccable detector on 30 August 2026. Worst was the Note
   label at 2.55:1 against its cream background, where AA wants 4.5:1.
   None qualify as large text: the labels are 16.8px and 17.6px bold,
   under the 18.66px threshold.

   The colours live in inline styles on all 97 published posts, so
   these overrides need !important. That is the whole point: one file
   corrects every post at once instead of editing 97 bodies.

   Each replacement is the same hue, darkened until it clears 4.5:1.
   ================================================================== */

/* Key Takeaways, #5a9e3a on #f0f7e6, was 3.00:1, now 4.57:1 */
.entry-content div[style*="#f0f7e6"] strong[style*="#5a9e3a"],
.entry-content div[style*="f0f7e6"] > strong { color: #477c2d !important; }

/* Pro tip, #1e88e5 on #e8f4fd, was 3.29:1, now 4.58:1 */
.entry-content div[style*="#e8f4fd"] strong[style*="#1e88e5"],
.entry-content div[style*="e8f4fd"] > strong { color: #1870be !important; }

/* Warning, #e53935 on #fff3f3, was 3.90:1, now 4.53:1 */
.entry-content div[style*="#fff3f3"] strong[style*="#e53935"],
.entry-content div[style*="fff3f3"] > strong { color: #d23430 !important; }

/* Note, #f57c00 on #fff8e1, was 2.55:1, now 4.54:1. The worst on the site. */
.entry-content div[style*="#fff8e1"] strong[style*="#f57c00"],
.entry-content div[style*="fff8e1"] > strong { color: #b25a00 !important; }

/* Further reading, #4a90e2 on #eef6ff, was 3.02:1, now 4.60:1 */
.entry-content div[style*="#eef6ff"] strong[style*="#4a90e2"],
.entry-content div[style*="eef6ff"] > strong { color: #3a71b2 !important; }

/* Read time and last updated line, #888 on white, was 3.54:1, now 4.54:1 */
.entry-content p[style*="#888"] { color: #767676 !important; }
.entry-content small[style*="#888"] { color: #767676 !important; }

/* Sign-off, #5a9e3a on white, was 3.29:1, now 4.52:1 */
.entry-content p[style*="#5a9e3a"] { color: #4b8430 !important; }

/* Read next and helpful reference links inside grey boxes */
.entry-content a[style*="#5a9e3a"] { color: #4b8430 !important; }

/* ==================================================================
   [2026-08-30] NEWSLETTER BAND vs FOOTER

   Both bands were #1B2E1E. Identical hex, stacked directly, so they
   read as one slab with an unexplained white stripe running through
   it.

   The stripe was Astra's own #primary { margin: 4em 0 }. On every
   other page that is correct breathing room before the footer. On the
   homepage it falls between two full-bleed dark bands, where it looks
   like a rendering fault rather than spacing.

   Fix is a real tonal step, then let the two bands meet:
     newsletter  #1B2E1E -> #1F3A26   lighter, it is the call to action
     footer      #1B2E1E -> #122016   darker, it is the anchor
   Perceptual distance dE 13.7, so the step is measured, not guessed.

   Every text colour on both bands was re-measured against its new
   background before this shipped. Nothing fell below 4.5:1, and the
   footer improved across the board because its ground got darker.
   ================================================================== */

/* --- the white stripe. Homepage only: other pages still want the 4em --- */
.home #primary { margin-bottom: 0; }
.home #content > .ast-container { padding-bottom: 0; }

/* --- newsletter band, lighter.
       The ID selector is deliberate. The widget's own CSS is inline in
       the body, so it loads after this file and wins any tie. --- */

/* "Weekly tips" tag: 5.65:1 on the old ground, 4.87:1 on the new. Passes. */

/* Fine print was rgba(255,255,255,.40), which computes to 3.36:1 here.
   It was already failing at 3.59:1 before this change, so it is raised
   rather than carried over. */

/* The centre divider loses a little definition on a lighter ground. */
#newsletter .uhs-nl-right { border-left-color: rgba(255,255,255,.10); }

/* --- SUBMIT button.
       White on #7AAE87 measures 2.55:1. That is the same number as the
       Note callout fixed earlier today, on the most important button on
       the site. Keeping the bright fill and going to deep forest text
       gives 5.65:1, and reads stronger against a dark band than the
       muted green alternative would. --- */

/* --- footer, darker, and meeting the band above it. --- */
.uhs-ft {
  background: #122016;
  border-top: 1px solid rgba(122,174,135,.16);
  padding-top: 3.25rem;
}

/* Small print sat at rgba(255,255,255,.45) = 4.40:1 on the new ground.
   Just short, so both are raised to clear it. */
.uhs-ft-aff,
.uhs-ft-note { color: rgba(255,255,255,.52); }

/* Force white text on the green Amazon CTA buttons regardless of :link/:visited/:hover/:active state. Inline style="color: #fff" cannot set :visited, so a visited link fell back to the browser default visited-link color here, which had poor contrast against the #5a9e3a background. Scoped to this class only. Added 2 September 2026. */
.uhs-green-btn,
.uhs-green-btn:link,
.uhs-green-btn:visited,
.uhs-green-btn:hover,
.uhs-green-btn:active {
  color: #fff !important;
}