/*
Theme Name: Hydrinity
Theme URI: https://shophydrinity.com
Description: Original clinical-luxury child theme for Hydrinity (Flatsome parent). Navy + cream + rose-clay, Playfair Display + Inter. Built for shophydrinity.com.
Author: Simon Painter
Template: flatsome
Version: 1.7
*/

:root{
  --hy-navy:#14294b; --hy-navy-deep:#111c34; --hy-cream:#faf6f1; --hy-clay:#c26d65;
  --hy-clay-dark:#a85950; --hy-gold:#d7ac76; --hy-ink:#2a2f36; --hy-line:#ecdfd8; --hy-blush:#f3e1da;
}

/* ---------- Typography ---------- */
body,.stat-number,input,select,textarea,button,.button{font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
body{color:var(--hy-ink);font-size:16px;line-height:1.65;}
h1,h2,h3,h4,h5,.is-serif,.hy-serif,.heading-font,blockquote{font-family:"Playfair Display",Georgia,"Times New Roman",serif !important;color:var(--hy-navy);font-weight:600;letter-spacing:-.01em;line-height:1.15;}
h1{font-size:2.8rem;} h2{font-size:2.1rem;}
.uppercase,.nav-uppercase>li>a,.label,.hy-eyebrow{font-family:"Inter",sans-serif !important;text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;font-weight:600;}
a{color:var(--hy-navy);} a:hover{color:var(--hy-clay);}

/* ---------- Header ---------- */
.header-main{min-height:78px;}
#logo a,#logo{font-family:"Playfair Display",serif !important;font-weight:700;font-size:1.75rem;letter-spacing:.02em;color:var(--hy-navy) !important;text-transform:uppercase;}
.header:not(.transparent) #logo a{color:var(--hy-navy) !important;}
.header-nav a{color:var(--hy-navy) !important;}
.top-bar{background:var(--hy-navy) !important;} .top-bar,.top-bar a{color:#f4ece2 !important;letter-spacing:.14em;font-size:.72rem;text-transform:uppercase;}
.header-top{border-bottom:1px solid var(--hy-line);}

/* ---------- Buttons (pill) ---------- */
.button,button,input[type=submit],.add_to_cart_button,.single_add_to_cart_button{
  border-radius:999px !important;text-transform:none;letter-spacing:.02em;font-weight:600;font-family:"Inter",sans-serif !important;}
.button.primary,.button.checkout,button.primary,.single_add_to_cart_button,.add_to_cart_button{
  background-color:var(--hy-navy) !important;border-color:var(--hy-navy) !important;color:#fff !important;}
.button.primary:hover,.single_add_to_cart_button:hover,.add_to_cart_button:hover{background-color:var(--hy-clay) !important;border-color:var(--hy-clay) !important;}
.button.secondary,.button.is-outline{color:var(--hy-navy) !important;border-color:var(--hy-navy) !important;}
.button.is-outline:hover{background:var(--hy-navy) !important;color:#fff !important;}

/* ---------- Product cards ---------- */
.product-small .box-text{padding-top:.6em;}
.product-title,.product-small .name a,.woocommerce-loop-product__title{font-family:"Inter",sans-serif !important;font-weight:600;color:var(--hy-navy) !important;font-size:.98rem;letter-spacing:0;}
.price,.woocommerce-Price-amount,.amount{color:var(--hy-navy);font-weight:600;}
.star-rating:before,.star-rating span:before,.woocommerce .star-rating span:before{color:var(--hy-gold) !important;}
.box-image img{transition:transform .5s ease;}
.col-inner:hover .box-image img{transform:scale(1.04);}
ul.products li.product,.product-small{background:#fff;}
.badge-inner{background:var(--hy-clay);color:#fff;}
.badge.on-sale .badge-inner{background:var(--hy-navy);}

/* ---------- Sections / bands ---------- */
.hy-cream,.section.hy-cream{background-color:var(--hy-cream) !important;}
.hy-navy-band{background-color:var(--hy-navy) !important;}
.hy-navy-band, .hy-navy-band h1,.hy-navy-band h2,.hy-navy-band h3,.hy-navy-band p{color:#f4ece2 !important;}
.hy-navy-band h1,.hy-navy-band h2,.hy-navy-band h3{color:#fff !important;}
.hy-eyebrow{color:var(--hy-clay);display:block;margin-bottom:.5em;}
.hy-navy-band .hy-eyebrow{color:var(--hy-gold);}
.hy-rule{width:56px;height:2px;background:var(--hy-clay);margin:0 auto 1.2em;border:0;}

/* ---------- Trust row ---------- */
.hy-trust .icon-box-img svg,.hy-trust .icon-box .icon svg{stroke:var(--hy-navy);}
.hy-trust .icon-box-text p{margin:0;font-size:.9rem;}

/* ---------- Accordion (FAQ) ---------- */
.accordion-title{font-family:"Playfair Display",serif !important;color:var(--hy-navy);font-size:1.05rem;font-weight:600;border-bottom:1px solid var(--hy-line);}
.accordion-title.active{color:var(--hy-clay);}

/* ---------- Footer ---------- */
.footer-1,.footer-2,footer#footer .footer-wrapper,.absolute-footer{background-color:var(--hy-navy-deep) !important;}
#footer,.footer-1,.footer-2{color:#c8cfdd;}
#footer h1,#footer h2,#footer h3,#footer h4,#footer .widget-title{color:#fff !important;}
#footer a{color:#c8cfdd !important;} #footer a:hover{color:var(--hy-gold) !important;}
.absolute-footer{color:#8892a6;}

/* ---------- Misc ---------- */
.page-title{background-color:var(--hy-cream) !important;}
.page-title-inner{background-color:transparent !important;}
mark,.highlight{background:transparent;color:var(--hy-clay);}

.hy-blush,.section.hy-blush{background-color:var(--hy-blush) !important;}

/* ---------- FULL-BLEED 1600px content width ---------- */
.home #content .row.row-main{max-width:100%!important;width:100%!important;margin-left:0!important;margin-right:0!important;}
.home #content .row.row-main > .col{padding-left:0!important;padding-right:0!important;width:100%!important;max-width:100%!important;}
.home #content .row.row-main > .col > .col-inner{padding-left:0!important;padding-right:0!important;}
.home #content .section > .section-content{padding-left:clamp(24px,5vw,80px)!important;padding-right:clamp(24px,5vw,80px)!important;box-sizing:border-box;}
.home #content .section .row{max-width:1600px!important;margin-left:auto!important;margin-right:auto!important;}
body:not(.home) #content .row.row-main{max-width:1600px!important;}
@media(max-width:849px){
  .section,.row,.row-collapse{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;transform:none!important;}
  .section > .section-content{padding-left:16px!important;padding-right:16px!important;box-sizing:border-box;}
}

/* ---------- Outline button fix: transparent bg so text is visible ---------- */
.button.primary.is-outline{background:transparent!important;color:var(--hy-navy)!important;}
.button.primary.is-outline:hover{background:var(--hy-navy)!important;color:#fff!important;}
/* ============================================================
   HYDRINITY POLISH v1.3 (2026-07-28)
   Type system, element sizing, spacing rhythm, category tiles,
   sticky header, footer columns, newsletter form.
   ============================================================ */

/* 1. TYPE SYSTEM: Inter for UI/body, Playfair stays on headings ---- */
body,
button, input, select, textarea, optgroup,
.nav, .nav a, .header-nav a, ul.nav > li > a, .menu a, .header a,
p, li, td, th, dd, dt, blockquote, label,
.widget, .widget a, #footer, .absolute-footer, .hy-footer,
.woocommerce-Price-amount, .price, .amount,
.woocommerce-loop-product__title, .cart_totals, .checkout,
.hy-eyebrow, .cart-item {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
}
h1, h2, h3, h4, h5, .heading-font,
.entry-title, .product-title, .title-inner, .box-category .name {
  font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
}
body { font-size: 16px; line-height: 1.65; color: #2b3552; }
.hy-eyebrow { font-weight: 600; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: #c26d65; }

/* 2. BUTTONS: right-sized + consistent (were 20.8px / 18.4px) ------- */
.button, a.button,
.button.is-large, .button.is-larger,
.add_to_cart_button, .single_add_to_cart_button,
button[type="submit"], input[type="submit"] {
  font-family: 'Inter', sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  line-height: 1.1 !important;
  padding: 15px 30px !important;
  min-height: 0 !important;
  text-transform: none !important;
}
.hy-cream .button, .banner .button { font-size: 15px !important; padding: 16px 34px !important; }
.button.is-outline { border-width: 1.5px; }

/* 3. HEADINGS: responsive scale, no mobile stacking --------------- */
h1 { font-size: clamp(2.1rem, 1.25rem + 2.7vw, 3.15rem) !important; line-height: 1.12 !important; letter-spacing: -.012em; }
h2 { font-size: clamp(1.65rem, 1.15rem + 1.7vw, 2.3rem) !important; line-height: 1.18 !important; }
h3 { font-size: clamp(1.2rem, 1rem + .6vw, 1.5rem) !important; line-height: 1.25 !important; }
.hy-cream p, .banner p { font-size: clamp(1rem, .96rem + .3vw, 1.12rem) !important; line-height: 1.6; }

/* 4. SECTION SPACING RHYTHM: one scale (was 34/60/64/66/72/74/76) -- */
#content .section { padding-top: clamp(52px, 6vw, 88px) !important; padding-bottom: clamp(52px, 6vw, 88px) !important; }
@media (max-width: 849px){
  .hy-cream.section { min-height: 0 !important; height: auto !important; }
  .hy-cream .col + .col { padding-top: 8px; }
}

/* 5. CATEGORY TILES: square boxes, product fully visible ----------- */
.box-category .box-image .image-cover { padding-top: 100% !important; background: #faf6f1; border-radius: 12px; overflow: hidden; }
.box-category .box-image img, .box-category .image-cover img { object-fit: contain !important; padding: 12%; }
.box-category .box-text { padding-top: 14px; text-align: center; }
.box-category .box-text .name a { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 17px; color: #14294b; }

/* 6. STICKY HEADER: solid bg, constrained logo, no collision ------- */
.header-main .logo img, .header-logo img { max-height: 54px; width: auto; height: auto; }
.stuck .header-main, .header-wrapper.stuck, .stuck .header-inner, .stuck { background: #ffffff !important; }
.stuck { box-shadow: 0 2px 16px rgba(20,41,75,.08); }
.stuck .header-main .logo img { max-height: 42px; }

/* 7. FOOTER columns (above the copyright bar) --------------------- */
.hy-footer { background: #0f1a30; color: #cdd6e6; padding: clamp(48px,6vw,76px) 0 clamp(34px,4vw,50px); }
.hy-footer .container { max-width: 1600px; }
.hy-footer-grid { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1.2fr; gap: 40px; align-items: start; }
.hy-footer-word { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 23px; letter-spacing: .16em; color: #fff; margin-bottom: 14px; }
.hy-footer-brand p { font-size: 14px; line-height: 1.75; color: #9fb0c9; max-width: 36ch; margin: 0; }
.hy-footer-col h4 { font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #d7ac76; margin: 3px 0 15px; }
.hy-footer-col a, .hy-footer-note { display: block; font-size: 14.5px; line-height: 2.05; color: #cdd6e6; text-decoration: none; }
.hy-footer-col a:hover { color: #fff; }
.hy-footer-note { color: #8798b4; }
@media (max-width: 849px){ .hy-footer-grid { grid-template-columns: 1fr 1fr; gap: 28px 20px; } .hy-footer-brand { grid-column: 1 / -1; } }

/* 8. NEWSLETTER signup form -------------------------------------- */
.hy-news { display: flex; gap: 10px; max-width: 470px; margin: 24px auto 0; flex-wrap: wrap; justify-content: center; }
.hy-news input[type=email] { flex: 1 1 240px; min-width: 220px; height: 52px; padding: 0 22px; border: 1px solid rgba(255,255,255,.28); background: rgba(255,255,255,.06); color: #fff; border-radius: 999px; font-size: 15px; }
.hy-news input::placeholder { color: rgba(255,255,255,.55); }
.hy-news input:focus { outline: none; border-color: #d7ac76; background: rgba(255,255,255,.1); }
.hy-news button { height: 52px; padding: 0 30px; border: 0; border-radius: 999px; background: #d7ac76; color: #14294b; font-family: 'Inter',sans-serif; font-weight: 700; font-size: 14.5px !important; letter-spacing: .03em; cursor: pointer; }
.hy-news button:hover { background: #e6c088; }
.hy-news-msg { flex-basis: 100%; text-align: center; font-size: 13.5px; color: #d7ac76; min-height: 18px; margin-top: 6px; }

/* ============================================================
   HYDRINITY POLISH v1.4 (2026-07-28) — verification fixes
   ============================================================ */

/* A. Remaining Lato holdouts -> Inter (FAQ answers, quick-view, dropdowns) */
.accordion-inner, .accordion-inner *, .accordion-title,
.quick-view, .nav-dropdown a, .nav-dropdown li a,
.box-text, .box-text *, .product-small .name a, .cart-icon strong {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif !important;
}
/* keep product/category titles serif */
.box-category .box-text .name a, .product-title, .product-small .name a.woocommerce-loop-product__link {
  font-family: 'Playfair Display', Georgia, serif !important;
}

/* B. Footer: columns ABOVE the copyright bar + continuous navy (no white gaps) */
#footer { display: flex; flex-direction: column; background: #0f1a30; }
#footer .hy-footer { order: 1; }
#footer .absolute-footer { order: 2; background: #0b1526 !important; border-top: 1px solid rgba(255,255,255,.06); }
#footer .back-to-top { order: 3; }
/* kill any gap between the last page section and the footer */
#main, #content { margin-bottom: 0 !important; }
.hy-navy-band { margin-bottom: 0 !important; }

/* ============================================================
   HYDRINITY POLISH v1.5 (2026-07-28) — final verification fixes
   ============================================================ */

/* A. Shop / category: remove the empty sidebar column, full-width products
   (theme_mod route doesn't take on this build; hide the column + widen content) */
.category-page-row > .col.large-3 { display: none !important; }
.category-page-row > .col.large-9 { max-width: 100% !important; flex-basis: 100% !important; width: 100% !important; }
#shop-sidebar { display: none !important; }

/* B. Close the 30px white strip between the last section and the footer */
#content { padding-bottom: 0 !important; }

/* C. Mobile: keep the wordmark from getting wide on small phones */
@media (max-width: 549px){
  .header-logo img, .logo img { max-width: 168px !important; }
}

/* ============================================================
   HYDRINITY POLISH v1.6 (2026-07-28) — footer seam
   ============================================================ */
/* The homepage content column carries a 30px bottom gutter that showed as a
   white seam between the last full-bleed (navy) section and the footer. */
.home .row-main > .col,
.home .content-area .row-main > .col.large-12 { padding-bottom: 0 !important; }

/* ============================================================
   HYDRINITY POLISH v1.7 (2026-09-14) — PDP quantity/CTA pairing,
   trust line, share icon cleanup
   ============================================================ */

/* 1. Quantity stepper: pill container, thin navy border, same height
   as the Add to Cart button, no individual boxed borders on the
   plus/minus inputs. Real markup on this build is
   <div class="ux-quantity quantity buttons_added"> with
   input.minus / input.qty / input.plus inside. */
.quantity.ux-quantity{
  display:inline-flex;align-items:stretch;height:48px;box-sizing:border-box;
  border:1px solid var(--hy-line);border-radius:999px;overflow:hidden;
  background:#fff;vertical-align:middle;margin-right:10px;
}
.quantity.ux-quantity .qty{
  border:0!important;box-shadow:none!important;background:transparent!important;
  width:48px;height:46px!important;line-height:46px!important;padding:0!important;
  text-align:center;font-family:'Inter',sans-serif;font-weight:600;color:var(--hy-navy);
}
.quantity.ux-quantity .minus,.quantity.ux-quantity .plus{
  border:0!important;box-shadow:none!important;background:transparent!important;border-radius:0!important;
  width:40px;height:46px!important;color:var(--hy-navy);font-size:13px;
}
.quantity.ux-quantity .minus:hover,.quantity.ux-quantity .plus:hover{
  background:var(--hy-blush)!important;color:var(--hy-clay)!important;
}
form.cart .single_add_to_cart_button{
  height:48px!important;box-sizing:border-box;display:inline-flex!important;
  align-items:center;justify-content:center;vertical-align:middle;
}

/* 2. Trust line under Add to Cart (echoed via woocommerce_single_product_summary @35) */
.hydrinity-trust-line{
  font-family:'Inter',sans-serif;font-size:.72rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--hy-clay);
  margin:16px 0 0;
}

/* 3. Share icons: no clean Flatsome filter to drop a single network was
   found in the child theme's reach, so LinkedIn is hidden with a scoped
   CSS rule limited to the PDP share row (does not touch the header
   follow-icons block). Remaining icons restyled as navy/clay outline
   circles instead of the default flat Flatsome fill. */
.share-icons.social-icons a.linkedin{display:none!important;}
.share-icons.social-icons .icon.circle.is-outline{
  border:1.5px solid var(--hy-navy)!important;color:var(--hy-navy)!important;
  background:transparent!important;
  transition:background .25s ease,color .25s ease,border-color .25s ease;
}
.share-icons.social-icons .icon.circle.is-outline:hover{
  background:var(--hy-navy)!important;border-color:var(--hy-navy)!important;color:#fff!important;
}
.share-icons.social-icons .icon.circle.is-outline.pinterest:hover,
.share-icons.social-icons .icon.circle.is-outline.email:hover{
  background:var(--hy-clay)!important;border-color:var(--hy-clay)!important;
}
