/*
Theme Name: Xpress First Child
Theme URI: https://xpressfirst.com
Description: Code-first block child theme for Xpress First Pte Ltd (Singapore official distributor of FutureVita premium health and wellness products). Config-driven; provisioning engine in inc/provision.php. Deploys to Hostinger via MCP, no SSH.
Author: WarelyEcom
Template: twentytwentyfive
Version: 1.0.2
Requires at least: 6.6
Requires PHP: 8.0
Text Domain: xpressfirst-child
*/

:root{
  --ss-ink:#0C3A3F; --ss-graphite:#0E4A50; --ss-cyan:#2FB67D; --ss-cyan-deep:#1F8F62;
  --ss-gold:#C9A24B; --ss-silver:#9FB2B4; --ss-cloud:#F3F8F7; --ss-white:#fff; --ss-body:#37474A;
  --ss-shadow:0 18px 44px -26px rgba(12,58,63,.5); --ss-radius:14px;
}
body{ background:var(--ss-white); color:var(--ss-body); }
.wp-site-blocks{ overflow-x:clip; }

/* sections */
.ss-section{ padding:clamp(3rem,7vw,6rem) 1.5rem; }
.ss-wrap{ max-width:1240px; margin-inline:auto; }
.ss-narrow{ max-width:780px; margin-inline:auto; }
.ss-center{ text-align:center; }
.ss-eyebrow{ display:inline-block; font-weight:700; letter-spacing:.22em; text-transform:uppercase; font-size:.78rem; color:var(--ss-cyan-deep); margin:0 0 .9rem; }
.ss-h{ font-family:"Fraunces","Manrope",serif; font-weight:700; color:var(--ss-ink); line-height:1.12; margin:0 0 1rem; }
.ss-h--xl{ font-size:clamp(2rem,3.6vw,2.9rem); }
.ss-lead{ font-size:1.12rem; color:#566f72; max-width:62ch; }
.ss-center .ss-lead{ margin-inline:auto; }
.ss-rule{ width:64px; height:3px; background:var(--ss-gold); border:0; margin:1.1rem 0; border-radius:2px; }
.ss-center .ss-rule{ margin-inline:auto; }

/* buttons */
.ss-btn{ display:inline-flex; align-items:center; gap:.5rem; cursor:pointer; font-weight:700; font-size:1rem; padding:.9rem 1.9rem; border-radius:8px; text-decoration:none; transition:transform .15s,background .2s,color .2s; }
.ss-btn--cyan{ background:var(--ss-cyan); color:var(--ss-white); box-shadow:var(--ss-shadow); }
.ss-btn--cyan:hover{ background:var(--ss-white); color:var(--ss-ink); transform:translateY(-2px); }
.ss-btn--ghost{ background:transparent; color:var(--ss-white); border:2px solid rgba(255,255,255,.5); }
.ss-btn--ghost:hover{ background:var(--ss-white); color:var(--ss-ink); }
.ss-btn--dark{ background:var(--ss-ink); color:var(--ss-white); box-shadow:var(--ss-shadow); }
.ss-btn--dark:hover{ background:var(--ss-gold); color:var(--ss-ink); transform:translateY(-2px); }
.ss-btn--gold{ background:var(--ss-gold); color:var(--ss-ink); box-shadow:var(--ss-shadow); }
.ss-btn--gold:hover{ background:var(--ss-white); color:var(--ss-ink); transform:translateY(-2px); }

/* header */
.ss-header{ position:sticky; top:0; z-index:100; background:var(--ss-ink); }
.ss-header .wp-block-site-title a{ text-decoration:none; color:var(--ss-white); font-family:"Fraunces","Manrope",serif; font-weight:700; letter-spacing:.01em; }
.ss-header .wp-block-navigation{ font-weight:600; }
.ss-header .wp-block-navigation a{ color:#DCE7E6; }
.ss-header .wp-block-navigation a:hover{ color:var(--ss-gold); }
.ss-brand-cn{ color:var(--ss-gold); font-weight:700; font-size:.72rem; letter-spacing:.28em; text-transform:uppercase; line-height:1; }

/* hero */
.ss-hero{ position:relative; color:var(--ss-white); padding:clamp(4.5rem,12vw,8rem) 1.5rem; min-height:82vh; display:flex; flex-direction:column; justify-content:center;
  background:linear-gradient(105deg, rgba(10,52,57,.95) 0%, rgba(10,52,57,.78) 52%, rgba(10,52,57,.42) 100%), url(assets/img/hero.jpg) center/cover no-repeat; overflow:hidden; }
.ss-hero-inner{ max-width:1240px; margin-inline:auto; width:100%; }
.ss-hero-eyebrow{ color:var(--ss-gold); font-weight:700; letter-spacing:.22em; text-transform:uppercase; font-size:.82rem; }
.ss-hero h1{ font-family:"Fraunces","Manrope",serif; font-weight:700; color:var(--ss-white); font-size:clamp(2.5rem,6.2vw,4.5rem); line-height:1.05; margin:.6rem 0 1rem; max-width:17ch; }
.ss-hero p{ font-size:clamp(1.05rem,2vw,1.3rem); color:#D5E2E1; max-width:48ch; margin:0 0 2rem; }
.ss-hero-cta{ display:flex; gap:1rem; flex-wrap:wrap; }
.ss-hero-strip{ margin-top:2.6rem; display:flex; gap:1.8rem; flex-wrap:wrap; color:#A9bfbe; font-weight:600; font-size:.92rem; }
.ss-hero-strip span{ display:inline-flex; align-items:center; gap:.45rem; }
.ss-hero-strip b{ color:var(--ss-white); }

/* trust bar */
.ss-trust{ background:var(--ss-graphite); color:#EAF2F1; }
.ss-trust .ss-wrap{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; padding:1.5rem; }
.ss-trust-item{ display:flex; align-items:center; gap:.7rem; justify-content:center; font-weight:600; font-size:.98rem; }
.ss-trust-item svg{ color:var(--ss-gold); flex:0 0 auto; }

/* products grid */
.ss-pkgs{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; margin-top:2.6rem; max-width:880px; margin-inline:auto; }
.ss-pkg{ background:var(--ss-white); border:1px solid #E1ECEA; border-radius:var(--ss-radius); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--ss-shadow); transition:transform .18s,box-shadow .18s; }
.ss-pkg:hover{ transform:translateY(-5px); box-shadow:0 28px 54px -28px rgba(12,58,63,.55); }
.ss-pkg-img{ position:relative; aspect-ratio:16/11; overflow:hidden; background:var(--ss-cloud); }
.ss-pkg-img img{ display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.ss-pkg:hover .ss-pkg-img img{ transform:scale(1.06); }
.ss-pkg-body{ padding:1.3rem 1.4rem 1.6rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.ss-pkg-body h3{ font-family:"Fraunces","Manrope",serif; font-size:1.28rem; color:var(--ss-ink); margin:0; }
.ss-pkg-body p{ margin:0; color:#5d7174; font-size:.95rem; flex:1; }
.ss-price{ font-family:"Manrope",sans-serif; font-weight:800; color:var(--ss-ink); font-size:1.5rem; }
.ss-price small{ font-size:.8rem; font-weight:600; color:#8aa0a2; }
.ss-pkg .ss-btn{ width:100%; justify-content:center; padding:.75rem 1rem; font-size:.95rem; margin-top:.4rem; }
/* WooCommerce add-to-cart rendered inside a product card */
.ss-buy{ margin-top:.4rem; }
.ss-buy .button,.ss-buy a.button,.ss-buy .added_to_cart{ display:block; width:100%; text-align:center; box-sizing:border-box; }
.ss-buy .added_to_cart{ margin-top:.5rem; font-weight:700; }

/* process steps */
.ss-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; margin-top:2.6rem; }
.ss-step{ position:relative; padding:1.6rem 1.3rem; background:var(--ss-cloud); border-radius:var(--ss-radius); }
.ss-step-n{ font-family:"Manrope",sans-serif; font-weight:800; font-size:2.4rem; color:var(--ss-cyan); line-height:1; }
.ss-step h3{ font-family:"Fraunces","Manrope",serif; font-size:1.1rem; color:var(--ss-ink); margin:.5rem 0 .35rem; }
.ss-step p{ margin:0; color:#5d7174; font-size:.94rem; }

/* why us (dark band) */
.ss-why{ background:var(--ss-ink); color:#EAF2F1; }
.ss-why h2{ color:var(--ss-white); }
.ss-why .ss-eyebrow{ color:var(--ss-gold); }
.ss-why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; margin-top:2.6rem; }
.ss-why-card{ background:var(--ss-graphite); border-radius:var(--ss-radius); padding:1.8rem 1.4rem; text-align:center; }
.ss-why-ico{ width:56px; height:56px; border-radius:14px; background:rgba(47,182,125,.16); color:var(--ss-cyan); display:grid; place-items:center; margin:0 auto 1rem; }
.ss-why-card h3{ font-family:"Fraunces","Manrope",serif; color:var(--ss-white); font-size:1.12rem; margin:0 0 .4rem; }
.ss-why-card p{ margin:0; color:#A9bfbe; font-size:.94rem; }

/* about split */
.ss-split{ display:grid; grid-template-columns:1fr 1fr; gap:2.6rem; align-items:center; }
.ss-split-media img{ width:100%; height:100%; max-height:460px; object-fit:cover; border-radius:var(--ss-radius); box-shadow:var(--ss-shadow); display:block; }

/* gallery */
.ss-gallery{ display:grid; grid-template-columns:repeat(4,1fr); gap:.9rem; margin-top:2.4rem; }
.ss-gtile{ aspect-ratio:1; border-radius:12px; overflow:hidden; background:var(--ss-cloud); }
.ss-gtile img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s; }
.ss-gtile:hover img{ transform:scale(1.08); }

/* testimonials */
.ss-quotes{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:2.4rem; }
.ss-quote{ background:var(--ss-white); border:1px solid #E1ECEA; border-radius:var(--ss-radius); padding:1.7rem 1.5rem; box-shadow:var(--ss-shadow); }
.ss-stars{ color:var(--ss-gold); letter-spacing:2px; font-size:1.05rem; margin-bottom:.7rem; }
.ss-quote p{ font-style:italic; color:#3d5154; margin:0 0 1rem; }
.ss-quote .who{ font-family:"Manrope",sans-serif; font-weight:700; color:var(--ss-ink); font-size:.95rem; }

/* location */
.ss-loc{ background:var(--ss-graphite); color:#EAF2F1; }
.ss-loc .ss-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; align-items:center; padding:clamp(2.5rem,5vw,4rem) 1.5rem; }
.ss-loc h2{ color:var(--ss-white); }
.ss-loc .ss-eyebrow{ color:var(--ss-gold); }
.ss-loc-list{ list-style:none; padding:0; margin:1.2rem 0 0; display:flex; flex-direction:column; gap:.9rem; font-size:1.05rem; }
.ss-loc-list li{ display:flex; gap:.8rem; align-items:flex-start; }
.ss-loc-list svg{ color:var(--ss-gold); flex:0 0 auto; margin-top:.15rem; }

/* cta band */
.ss-cta{ position:relative; color:var(--ss-white); text-align:center; background:linear-gradient(rgba(10,52,57,.9),rgba(10,52,57,.93)),url(assets/img/botanical.jpg) center/cover no-repeat; }
.ss-cta h2{ color:var(--ss-white); }
.ss-cta .ss-lead{ color:#D5E2E1; }

/* disclaimer */
.ss-disclaimer{ background:var(--ss-cloud); color:#5d7174; font-size:.86rem; line-height:1.6; }
.ss-disclaimer .ss-wrap{ padding:1.4rem 1.5rem; max-width:1040px; }

/* footer */
.ss-footer{ background:var(--ss-ink); color:#C9D8D7; }
.ss-footer a{ color:#C9D8D7; text-decoration:none; }
.ss-footer a:hover{ color:var(--ss-gold); }
.ss-footer h3{ color:var(--ss-white); }
.ss-footer .ss-foot-note{ color:#8aa0a2; }

/* WooCommerce */
.woocommerce ul.products li.product .price, .woocommerce div.product p.price{ color:var(--ss-ink) !important; font-weight:800; }
.woocommerce span.onsale{ background:var(--ss-cyan); color:var(--ss-white); }
.woocommerce a.button,.woocommerce button.button,.woocommerce #respond input#submit,.woocommerce .button.alt,.wc-block-components-button{
  background-color:var(--ss-cyan) !important; color:#fff !important; border-radius:8px !important; font-weight:700 !important; }
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button.alt:hover{ background-color:var(--ss-ink) !important; color:#fff !important; }
.home .wp-block-post-title,.page .wp-block-post-title{ display:none !important; }

/* responsive */
@media (max-width:960px){
  .ss-steps,.ss-why-grid{ grid-template-columns:repeat(2,1fr); }
  .ss-quotes{ grid-template-columns:1fr; }
  .ss-trust .ss-wrap{ grid-template-columns:repeat(2,1fr); }
  .ss-loc .ss-wrap,.ss-split{ grid-template-columns:1fr; }
  .ss-gallery{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:560px){
  .ss-pkgs,.ss-steps,.ss-why-grid,.ss-trust .ss-wrap{ grid-template-columns:1fr; }
  .ss-gallery{ grid-template-columns:repeat(2,1fr); }
}

/* Remove TT5 default block-gap between sticky header and first section (and above footer) */
.wp-site-blocks > main, .wp-site-blocks > footer{ margin-block-start:0 !important; }

/* ---- UX / mobile / a11y polish pass ---- */
html{ scroll-behavior:smooth; }
img{ max-width:100%; height:auto; }
a:focus-visible,button:focus-visible,summary:focus-visible,.ss-btn:focus-visible,.rx-btn:focus-visible,.wp-element-button:focus-visible{ outline:3px solid var(--ss-cyan,var(--rx-gold,#C9A84C)); outline-offset:3px; }
.wpcf7 label{ display:block; font-weight:600; font-size:.92rem; margin:.2rem 0 .9rem; color:inherit; }
.wpcf7 input[type=text],.wpcf7 input[type=email],.wpcf7 input[type=tel],.wpcf7 input[type=number],.wpcf7 input[type=date],.wpcf7 textarea{ width:100%; margin-top:.35rem; padding:.7rem .85rem; border:1px solid rgba(0,0,0,.18); border-radius:8px; font:inherit; box-sizing:border-box; background:#fff; color:#222; }
.wpcf7 textarea{ min-height:120px; }
.wpcf7 input:focus,.wpcf7 textarea:focus{ outline:2px solid var(--ss-cyan,var(--rx-gold,#C9A84C)); border-color:transparent; }
.wpcf7 .wpcf7-submit{ cursor:pointer; border:0; color:#fff; background:var(--ss-cyan,var(--rx-red,#5C1A1A)); font-weight:700; padding:.8rem 1.8rem; border-radius:999px; margin-top:.5rem; width:auto; }
.wpcf7 .wpcf7-submit:hover{ filter:brightness(.93); }
@media (max-width:600px){
  .ss-hero,.rx-hero{ min-height:auto !important; padding-top:3.2rem !important; padding-bottom:3.4rem !important; }
  .ss-hero h1,.rx-hero-title{ font-size:clamp(2rem,9vw,2.8rem) !important; }
  .ss-hero-cta,.rx-hero-cta{ flex-direction:column; align-items:stretch; }
  .ss-hero-cta .ss-btn,.rx-hero-cta .rx-btn{ width:100%; justify-content:center; }
}
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } *{ transition:none !important; animation:none !important; } }