/* ============================================================================
   HOMES & FLOORS — HOMEPAGE v2 DESIGN SYSTEM  (production, cached external CSS)
   ----------------------------------------------------------------------------
   ONE cached stylesheet for the rebuilt homepage. Everything is scoped under
   .hfv2-page and tokens live on .hfv2-page, so this file CANNOT override any
   existing site CSS (no global leakage, no clobbering). Mobile-first responsive.
   Served once, long-cached (versioned by filemtime in hf-home-v2.php) — replaces
   the ~1.37 MB of per-page inline <style>. Tokens extracted 1:1 from the live site.
   ========================================================================== */

.hfv2-page{
 --navy:#122B4C;--navy-deep:#0a1f3a;--green:#4ad55d;--green-ink:#072617;--green-text:#237a3a;
 --ink:#182033;--body:#59616b;--bg-light:#eef2f7;
 --r-card:16px;--r-lg:22px;--r-pill:999px;
 --shadow:0 12px 32px rgba(16,35,61,.10);--glow:0 8px 24px rgba(74,213,93,.30);
 --font:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
 font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;
}
.hfv2-page *{box-sizing:border-box}
.hfv2-page img{display:block;max-width:100%}
.hfv2-wrap{width:min(1180px,92vw);margin-inline:auto}
.hfv2-sec{padding:clamp(48px,7vw,96px) 0}
.hfv2-sec--light{background:var(--bg-light)}
.hfv2-sec--dark{background:var(--navy-deep,#0a1f3a);color:#fff}
.hfv2-eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--green-text);font-size:13px;font-weight:600;letter-spacing:3px;text-transform:uppercase}
.hfv2-eyebrow::before{content:"";width:28px;height:2px;background:currentColor}
.hfv2-sec--dark .hfv2-eyebrow,.hfv2-feat .hfv2-eyebrow,.hfv2-faq .hfv2-eyebrow{color:var(--green)}
.hfv2-h2{font-size:clamp(28px,4vw,46px);font-weight:800;letter-spacing:-.5px;line-height:1.05;margin:0}
.hfv2-lead{font-size:clamp(15px,1.3vw,18px);line-height:1.55;color:var(--body)}
.hfv2-sec--dark .hfv2-lead,.hfv2-cta .hfv2-lead{color:rgba(255,255,255,.85)}
.hfv2-center{text-align:center;max-width:640px;margin-inline:auto}
.hfv2-ul{width:54px;height:3px;background:var(--green);border-radius:var(--r-pill);margin:14px auto 0}

/* Buttons */
.hfv2-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:14px 26px;font-size:13px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;border-radius:var(--r-pill);border:2px solid transparent;text-decoration:none;cursor:pointer;transition:transform .15s,filter .15s,background .18s,color .18s}
.hfv2-btn:hover{transform:translateY(-1px);filter:brightness(1.04)}
.hfv2-btn--green{background:var(--green,#4ad55d);color:var(--green-ink,#072617);box-shadow:var(--glow,0 8px 24px rgba(74,213,93,.3))}
.hfv2-btn--navy{background:var(--navy);color:#fff;border-radius:12px}
.hfv2-btn--light{background:#fff;color:var(--navy)}
.hfv2-btn--ghost{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.85)}
.hfv2-btn--outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.hfv2-btn--outline:hover{background:var(--navy);color:#fff}
.hfv2-page a:focus-visible,.hfv2-page button:focus-visible,.hfv2-page summary:focus-visible{outline:3px solid var(--green);outline-offset:3px}

/* 1 HERO */
.hfv2-hero{position:relative;display:flex;align-items:center;min-height:clamp(560px,78vh,720px);padding:clamp(40px,5vw,72px);color:#fff;background:#0a1f3a center/cover no-repeat;overflow:hidden}
.hfv2-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(95deg,rgba(7,17,31,.93) 0%,rgba(7,17,31,.85) 30%,rgba(7,17,31,.55) 52%,rgba(7,17,31,.18) 74%,rgba(7,17,31,.03) 100%)}
.hfv2-hero__card{position:relative;width:min(560px,54%);padding:0}
.hfv2-hero__card .hfv2-eyebrow{margin-bottom:6px}
.hfv2-hero__card h1{font-size:clamp(42px,6.4vw,82px);font-weight:800;line-height:1.0;letter-spacing:-2px;margin:14px 0 16px;text-shadow:0 2px 40px rgba(0,0,0,.45)}
.hfv2-hero__card .hfv2-lead{color:rgba(255,255,255,.92);max-width:430px;margin-bottom:30px;text-shadow:0 1px 18px rgba(0,0,0,.45)}
.hfv2-hero__btns{display:flex;flex-wrap:wrap;gap:14px}
.hfv2-hero__nav{position:absolute;left:clamp(40px,5vw,72px);bottom:clamp(26px,4vh,40px);z-index:3;display:flex;align-items:center;gap:clamp(14px,1.6vw,22px)}
.hfv2-hero__arws{display:flex;gap:10px}
.hfv2-hero__arw{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);color:#fff;font-size:20px;cursor:pointer;transition:background .18s,border-color .18s,transform .18s}
.hfv2-hero__arw:hover{background:rgba(255,255,255,.18);border-color:#fff;transform:translateY(-1px)}
.hfv2-hero__arw:active{transform:translateY(0)}
.hfv2-hero__dots{display:flex;align-items:center;gap:9px}
.hfv2-hero__dots span{position:relative;width:24px;height:26px;cursor:pointer;transition:width .3s}
.hfv2-hero__dots span::before{content:"";position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:4px;border-radius:9px;background:rgba(255,255,255,.3);transition:background .25s}
.hfv2-hero__dots span:hover::before{background:rgba(255,255,255,.6)}
.hfv2-hero__dots .on{width:46px}
.hfv2-hero__dots .on::after{content:"";position:absolute;left:0;top:50%;width:100%;height:4px;border-radius:9px;background:var(--green);transform:translateY(-50%) scaleX(0);transform-origin:left;box-shadow:0 0 10px rgba(74,213,93,.5);animation:hfv2heroFill 6s linear forwards}
.hfv2-hero:hover .hfv2-hero__dots .on::after{animation-play-state:paused}
@keyframes hfv2heroFill{from{transform:translateY(-50%) scaleX(0)}to{transform:translateY(-50%) scaleX(1)}}
@keyframes hfv2heroFillY{from{transform:translateX(-50%) scaleY(0)}to{transform:translateX(-50%) scaleY(1)}}
.hfv2-hero .hfv2-btn--green{background:linear-gradient(135deg,#57e06b 0%,#37c34c 100%);box-shadow:0 14px 34px -10px rgba(74,213,93,.6);border-color:transparent}
.hfv2-hero .hfv2-btn--green:hover{box-shadow:0 18px 44px -10px rgba(74,213,93,.78)}
.hfv2-hero .hfv2-btn--ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.5)}
.hfv2-hero .hfv2-btn--ghost:hover{background:rgba(255,255,255,.16);border-color:#fff}
.hfv2-htrust{background:#0c2444}
.hfv2-htrust .hfv2-wrap{display:grid;grid-template-columns:repeat(3,1fr)}
.hfv2-hti{display:flex;align-items:center;gap:13px;padding:20px;border-left:1px solid rgba(255,255,255,.07)}
.hfv2-hti:first-child{border-left:0}
.hfv2-hti{text-decoration:none}
.hfv2-hti__ic{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(74,213,93,.14)}
.hfv2-hti__ic i{font-size:21px;color:var(--green)}
.hfv2-hti__ic .hfv2-lg{width:24px;height:24px}
.hfv2-hti--brand .hfv2-hti__ic{background:#fff;transition:transform .18s}
.hfv2-hti--brand:hover .hfv2-hti__ic{transform:scale(1.06)}
.hfv2-hti b{display:block;color:#fff;font-size:15px;font-weight:600}
.hfv2-hti small{color:rgba(255,255,255,.62);font-size:12px}

/* 2 DISCOVER */
.hfv2-tabs{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:26px 0 30px}
.hfv2-tab{min-height:48px;padding:13px 22px;font-size:12px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;border-radius:var(--r-pill);background:#fff;color:var(--navy);border:1.5px solid rgba(18,43,76,.3);cursor:pointer}
.hfv2-tab[aria-selected="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.hfv2-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hfv2-ccard{display:flex;flex-direction:column;background:#fff;border:1px solid rgba(18,43,76,.08);border-radius:18px;overflow:hidden;text-decoration:none;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}
.hfv2-ccard:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(16,35,61,.18)}
.hfv2-ccard__m{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:18px 18px 0 0;transform:translateZ(0)}
.hfv2-ccard__m img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.hfv2-ccard:hover .hfv2-ccard__m img{transform:scale(1.06)}
.hfv2-badge{position:absolute;top:14px;left:14px;display:inline-flex;align-items:center;gap:6px;background:rgba(10,31,58,.92);color:#fff;font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;padding:7px 12px;border-radius:var(--r-pill)}
.hfv2-badge i{color:var(--green)}
.hfv2-ccard__b{display:flex;flex-direction:column;flex:1;padding:22px}
.hfv2-ccard__k{color:var(--green-text);font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px}
.hfv2-ccard__t{color:var(--navy);font-size:22px;font-weight:700;margin-bottom:9px}
.hfv2-ccard__d{color:var(--body);font-size:14px;line-height:1.5;margin-bottom:14px}
.hfv2-ccard__cue{display:inline-flex;align-items:center;gap:7px;color:#3a4658;font-size:12.5px;margin-bottom:18px}
.hfv2-ccard__cue i{color:var(--green-text)}
.hfv2-ccard__cta{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 20px;font-size:12.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;border-radius:var(--r-pill);background:transparent;color:var(--navy);border:2px solid var(--navy);transition:background .18s,color .18s}
.hfv2-ccard:hover .hfv2-ccard__cta{background:var(--green);color:var(--green-ink);border-color:var(--green)}
/* Discover = compact category navigator (all categories as image tiles) */
.hfv2-disc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.hfv2-disc-tile{position:relative;display:block;aspect-ratio:4/3;border-radius:14px;overflow:hidden;text-decoration:none;background:var(--navy-deep);box-shadow:0 10px 26px rgba(16,35,61,.1)}
.hfv2-disc-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .45s}
.hfv2-disc-tile:hover img{transform:scale(1.07)}
.hfv2-disc-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,20,36,0) 42%,rgba(7,20,36,.85) 100%)}
.hfv2-disc-tile__name{position:absolute;left:16px;right:14px;bottom:13px;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:8px;color:#fff;font:700 15px/1.2 var(--font)}
.hfv2-disc-tile__name i{flex:none;color:var(--green);font-size:18px;transition:transform .18s}
.hfv2-disc-tile:hover .hfv2-disc-tile__name i{transform:translateX(3px)}
.hfv2-disc-tile:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.hfv2-disc-tile--plain::after{background:linear-gradient(160deg,#1e3d68,#0a1f3d)}
.hfv2-disc-tile--plain .hfv2-disc-tile__name{inset:0;left:14px;right:14px;justify-content:center;align-items:center;text-align:center}

/* 3 SAMPLE-FIRST */
.hfv2-sample__grid{display:grid;grid-template-columns:1fr 1.05fr;gap:36px;align-items:center}
.hfv2-sample__media{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:340px}
.hfv2-sample__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hfv2-sample__badge{position:absolute;top:16px;left:16px;background:var(--green,#4ad55d);color:var(--green-ink,#072617);font-size:13px;font-weight:800;padding:8px 16px;border-radius:var(--r-pill);box-shadow:0 10px 24px -8px rgba(74,213,93,.55)}
.hfv2-sample__h{font-size:clamp(26px,3vw,40px);font-weight:800;line-height:1.08;letter-spacing:-.5px;margin:12px 0}
.hfv2-sample .hfv2-lead{margin-bottom:24px}
.hfv2-sample{padding:clamp(34px,4.4vw,58px) 0}
.hfv2-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}
.hfv2-step{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:5px;background:linear-gradient(160deg,rgba(255,255,255,.1) 0%,rgba(255,255,255,.04) 100%);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:18px 18px 20px;box-shadow:0 18px 40px -22px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.09);transition:transform .2s,border-color .2s,box-shadow .2s}
.hfv2-step:hover{transform:translateY(-4px);border-color:rgba(74,213,93,.5);box-shadow:0 26px 54px -22px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.12)}
.hfv2-step__n{grid-column:1;grid-row:1 / 3;align-self:center;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,#57e06b 0%,#37c34c 100%);color:var(--green-ink);font-weight:800;font-size:17px;box-shadow:0 8px 20px -4px rgba(74,213,93,.55)}
.hfv2-step b{grid-column:2;align-self:end;display:block;color:#fff;font-size:15.5px;line-height:1.2}
.hfv2-step span{grid-column:2;align-self:start;color:rgba(255,255,255,.74);font-size:13px;line-height:1.5}

/* 4/6/8 FEATURE (spotlight + carousel + product card replica) */
.hfv2-feat{padding:0 0 clamp(48px,7vw,90px);background:#fff}
.hfv2-spot{position:relative;min-height:clamp(420px,50vw,600px);overflow:hidden;display:flex;align-items:flex-end}
.hfv2-spot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hfv2-spot__card{position:relative;width:clamp(300px,38%,440px);background:linear-gradient(180deg,rgba(248,250,253,.93) 0%,rgba(252,253,255,.98) 60%,#fff 100%);border-top:4px solid var(--green);border-radius:0 18px 0 0;padding:clamp(26px,2.6vw,40px) clamp(26px,2.6vw,40px) clamp(32px,3.4vw,48px);display:flex;flex-direction:column;gap:14px}
.hfv2-spot__ey{color:var(--green-text);font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase}
.hfv2-spot__h{margin:0;color:var(--navy);font-size:clamp(32px,4vw,52px);font-weight:800;line-height:1.02;letter-spacing:-1px}
.hfv2-spot__p{margin:0;color:#3f4858;font-size:14px;line-height:1.6}
.hfv2-spot__card .hfv2-btn{align-self:flex-start}
.hfv2-feat__head{text-align:center;max-width:860px;margin:clamp(20px,2.4vw,34px) auto clamp(24px,3vw,34px)}
.hfv2-kicker{display:inline-flex;align-items:center;gap:10px;color:var(--green-text);font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;margin-bottom:12px}
.hfv2-kicker::before{content:"";width:28px;height:2px;background:currentColor}
.hfv2-feat__h{color:var(--navy);font-size:clamp(28px,4vw,46px);font-weight:800;letter-spacing:-.5px;margin:0}
.hfv2-feat__sub{color:var(--body);font-size:15px;margin-top:8px}
.hfv2-carousel{position:relative}
.hfv2-carousel__arw{position:absolute;top:32%;z-index:4;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid rgba(18,43,76,.12);box-shadow:0 10px 22px rgba(16,35,61,.18);color:var(--navy);cursor:pointer;font-size:20px}
.hfv2-carousel__arw.l{left:-10px}.hfv2-carousel__arw.r{right:-10px}
.hfv2-pgrid{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px 0 16px}
.hfv2-pgrid::-webkit-scrollbar{display:none}
.hfv2-pcard{position:relative;display:flex;flex-direction:column;flex:0 0 calc((100% - 54px)/4);scroll-snap-align:start;background:#fff;border:1px solid rgba(18,43,76,.08);border-radius:16px;overflow:hidden;box-shadow:none;transition:transform .2s,box-shadow .2s}
.hfv2-pcard:hover{transform:translateY(-5px);box-shadow:0 10px 24px rgba(16,35,61,.1)}
.hfv2-pcard__m{position:relative;aspect-ratio:1/1;overflow:hidden;background:#e7ecf3;border-radius:16px 16px 0 0;transform:translateZ(0)}
.hfv2-pcard__m img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.hfv2-pcard:hover .hfv2-pcard__m img{transform:scale(1.05)}
.hfv2-pcard__dots{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;gap:5px}
.hfv2-pcard__dots span{width:7px;height:7px;border-radius:var(--r-pill);background:rgba(255,255,255,.6);cursor:pointer}
.hfv2-pcard__dots .on{width:17px;background:#fff}
.hfv2-pcard__bag{position:absolute;right:13px;bottom:13px;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:linear-gradient(160deg,#1e3d68 0%,#0a1f3d 100%);color:#fff;text-decoration:none;border:1.5px solid rgba(74,213,93,.55);box-shadow:0 12px 28px rgba(10,31,58,.45),0 2px 5px rgba(10,31,58,.3),inset 0 1px 1px rgba(255,255,255,.22);font-size:22px;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease}
.hfv2-pcard__bag::after{content:"";position:absolute;inset:5px;border-radius:50%;border:1px solid rgba(255,255,255,.14);pointer-events:none}
.hfv2-pcard__bag:hover,.hfv2-pcard__bag:focus-visible{background:linear-gradient(160deg,#5fe072 0%,#3cc551 100%);border-color:var(--green);color:var(--green-ink);transform:translateY(-2px) scale(1.08);box-shadow:0 16px 34px rgba(74,213,93,.5)}
.hfv2-pcard__bag:active{transform:scale(.95)}
.hfv2-pcard__b{display:flex;flex-direction:column;flex:1;padding:16px}
.hfv2-pcard__meta{color:var(--green-text);font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}
.hfv2-pcard__t{color:var(--navy);font-size:14.5px;font-weight:700;line-height:1.3;margin-bottom:11px;min-height:38px}
.hfv2-pcard__s{display:inline-flex;align-items:center;gap:7px;color:#3a4658;font-size:12px;margin-bottom:14px}
.hfv2-pcard__s::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green-text)}
.hfv2-pcard__v{margin-top:auto;display:inline-flex;align-items:center;gap:9px;color:var(--green-text);font-size:11.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;text-decoration:none}
.hfv2-pcard__v .c{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:2px solid var(--green-text);font-size:14px}

/* 5 WHY */
.hfv2-why__grid{display:grid;grid-template-columns:.9fr 1fr;gap:40px;align-items:center}
.hfv2-why__media{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:440px}
.hfv2-why__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hfv2-why__rating{position:absolute;top:18px;left:18px;background:#fff;border-radius:12px;padding:10px 15px;box-shadow:0 10px 24px rgba(0,0,0,.28)}
.hfv2-why__rating .st{color:var(--green-text);letter-spacing:1px}
.hfv2-why__rating small{display:block;color:var(--navy);font-size:12px;font-weight:600}
.hfv2-why__corner{position:absolute;right:0;bottom:0;width:70px;height:70px;background:var(--green);clip-path:polygon(100% 0,100% 100%,0 100%)}
.hfv2-why__h{font-size:clamp(30px,3.6vw,46px);font-weight:800;color:#fff;letter-spacing:-.5px;line-height:1.06;margin:16px 0 20px}
.hfv2-why__h .g{color:var(--green)}
.hfv2-checks{list-style:none;display:flex;flex-direction:column;gap:14px;margin:0 0 24px;padding:0}
.hfv2-checks li{display:flex;gap:11px;align-items:flex-start;color:rgba(255,255,255,.9);font-size:15px;line-height:1.45}
.hfv2-checks .ic{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(74,213,93,.18);color:var(--green);font-size:14px;margin-top:2px}
.hfv2-checks .g{color:var(--green);font-weight:600}
.hfv2-wstats{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-bottom:26px}
.hfv2-wstat{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:14px 16px}
.hfv2-wstat .ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:rgba(74,213,93,.16);color:var(--green);font-size:19px}
.hfv2-wstat b{display:block;color:#fff;font-size:17px;font-weight:700}
.hfv2-wstat small{color:rgba(255,255,255,.7);font-size:12px}

/* 7 REVIEWS */
.hfv2-rv__trust{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 24px;margin:24px 0 4px}
.hfv2-rv__tg{display:inline-flex;align-items:center;gap:10px}
.hfv2-rv__tg .lg{display:inline-flex;align-items:center;gap:6px;color:var(--navy);font-size:15px;font-weight:700}
.hfv2-rv__tg .lg .tp{color:var(--green-text)}
.hfv2-rv__tg .st{color:var(--green-text);letter-spacing:1.5px}
.hfv2-rv__tg .sc{color:var(--navy);font-weight:800}
.hfv2-rv__vd{width:1px;height:22px;background:rgba(18,43,76,.18)}
.hfv2-rv__tabs{display:flex;justify-content:center;gap:28px;border-bottom:1px solid rgba(18,43,76,.12);max-width:540px;margin:22px auto 0}
.hfv2-rv__tab{background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding:12px 2px;color:#8a93a0;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;cursor:pointer}
.hfv2-rv__tab[aria-selected="true"]{color:var(--navy);border-bottom-color:var(--green)}
.hfv2-rv__slider{position:relative;margin-top:32px;padding:0 34px}
.hfv2-rv__arw{position:absolute;top:42%;z-index:3;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid rgba(18,43,76,.12);box-shadow:0 10px 24px rgba(16,35,61,.16);color:var(--navy);cursor:pointer;font-size:20px;transition:background .18s,color .18s}
.hfv2-rv__arw:hover{background:var(--navy);color:#fff}
.hfv2-rv__arw.l{left:-6px}.hfv2-rv__arw.r{right:-6px}
.hfv2-rv__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.hfv2-rcard{position:relative;background:#fff;border-radius:18px;padding:24px 22px 22px;box-shadow:var(--shadow);border:1px solid rgba(18,43,76,.05);overflow:hidden;transition:transform .2s,box-shadow .2s}
.hfv2-rcard:hover{transform:translateY(-4px);box-shadow:0 22px 46px rgba(16,35,61,.16)}
.hfv2-rcard__q{position:absolute;top:10px;right:18px;color:rgba(18,43,76,.06);font-size:58px;font-family:Georgia,serif}
.hfv2-rcard__top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.hfv2-rcard__avw{position:relative;flex:none}
.hfv2-rcard__av{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;color:#fff;font-weight:700;font-size:17px}
.hfv2-av-g{background:var(--green-text)}.hfv2-av-n{background:var(--navy)}.hfv2-av-p{background:#6d3bd1}
.hfv2-rcard__vf{position:absolute;right:-2px;bottom:-2px;display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:var(--green);color:var(--green-ink);font-size:11px;border:2px solid #fff}
.hfv2-rcard__name{color:var(--navy);font-size:15px;font-weight:700}
.hfv2-rcard__date{color:#5d6674;font-size:12px}
.hfv2-rcard__src{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700}
.hfv2-src-tp{color:var(--green-text)}.hfv2-src-g{color:#3a4658}
.hfv2-rcard__stars{color:var(--green-text);letter-spacing:2px;margin-bottom:10px}
.hfv2-rcard__txt{color:var(--body);font-size:13.5px;line-height:1.55}
/* Real brand logos + clickable Trustpilot/Google */
.hfv2-lg{display:inline-block;vertical-align:middle;flex:none}
.hfv2-wstat{text-decoration:none}
.hfv2-wstat .ic--brand{background:#fff}
.hfv2-wstat .ic .hfv2-lg{width:20px;height:20px}
.hfv2-wstat[href]:hover{border-color:rgba(74,213,93,.4)}
.hfv2-rv__tg{text-decoration:none}
.hfv2-rv__tg .lg .hfv2-lg{width:18px;height:18px}
.hfv2-rcard__src{text-decoration:none}
.hfv2-rcard__src .hfv2-lg{width:14px;height:14px}
.hfv2-rv__more{display:flex;justify-content:center;margin-top:30px}
/* Reviews — dark navy variant */
.hfv2-reviews{padding:clamp(32px,4.5vw,56px) 0}
.hfv2-reviews .hfv2-rv__tg .lg{color:#fff}
.hfv2-reviews .hfv2-rv__tg .sc{color:#fff}
.hfv2-reviews .hfv2-rv__tg .st{color:var(--green)}
.hfv2-reviews .hfv2-rv__vd{background:rgba(255,255,255,.22)}
.hfv2-reviews .hfv2-rv__tabs{border-bottom-color:rgba(255,255,255,.16)}
.hfv2-reviews .hfv2-rv__tab{color:rgba(255,255,255,.6)}
.hfv2-reviews .hfv2-rv__tab[aria-selected="true"]{color:#fff}
.hfv2-reviews .hfv2-rv__arw:hover{background:var(--green);color:var(--green-ink);border-color:transparent}
.hfv2-reviews .hfv2-btn--outline{color:#fff;border-color:rgba(255,255,255,.5)}
.hfv2-reviews .hfv2-btn--outline:hover{background:#fff;color:var(--navy)}

/* 9 FAQ */
.hfv2-faq__list{max-width:860px;margin-inline:auto;display:flex;flex-direction:column;gap:12px}
.hfv2-faq__item{background:#fff;border-radius:14px;overflow:hidden}
.hfv2-faq__item summary{display:flex;align-items:center;justify-content:space-between;gap:14px;list-style:none;cursor:pointer;padding:20px 24px;color:var(--navy);font-size:16px;font-weight:700}
.hfv2-faq__item summary::-webkit-details-marker{display:none}
.hfv2-faq__item summary .ic{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(35,122,58,.12);color:var(--green-text);font-size:17px;transition:transform .2s}
.hfv2-faq__item[open] summary .ic{transform:rotate(180deg)}
.hfv2-faq__a{padding:0 24px 22px;color:var(--body);font-size:14px;line-height:1.6}
.hfv2-faq__foot{text-align:center;color:rgba(255,255,255,.8);font-size:14px;margin-top:28px}
.hfv2-faq__foot a{color:var(--green);font-weight:700;text-decoration:underline;text-underline-offset:3px}

/* 10 INSIGHT */
.hfv2-ins__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.hfv2-icard{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid rgba(18,43,76,.1);border-radius:16px;overflow:hidden;text-decoration:none;box-shadow:0 10px 26px rgba(16,35,61,.08);transition:transform .2s,box-shadow .2s}
.hfv2-icard:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(16,35,61,.16)}
.hfv2-icard__m{position:relative;aspect-ratio:16/11;overflow:hidden;background:#e7ecf3;border-radius:16px 16px 0 0;transform:translateZ(0)}
.hfv2-icard__m img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.hfv2-icard:hover .hfv2-icard__m img{transform:scale(1.06)}
.hfv2-icard__b{display:flex;flex-direction:column;flex:1;padding:18px}
.hfv2-icard__tag{align-self:flex-start;padding:5px 12px;border:1px solid rgba(35,122,58,.4);border-radius:var(--r-pill);color:var(--green-text);font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;background:rgba(35,122,58,.07);margin-bottom:13px}
.hfv2-icard__t{color:var(--navy);font-size:17px;font-weight:700;line-height:1.25;margin-bottom:9px}
.hfv2-icard__d{color:var(--body);font-size:13px;line-height:1.5;margin-bottom:15px}
.hfv2-icard__x{margin-top:auto;display:inline-flex;align-items:center;gap:8px;color:var(--green-text);font-size:12px;font-weight:700;letter-spacing:.7px;text-transform:uppercase}

/* 11 CTA */
.hfv2-cta{background:#0e2a4d;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:44px 44px;color:#fff}
.hfv2-cta__grid{display:grid;grid-template-columns:1fr .9fr;gap:40px;align-items:center}
.hfv2-cta__h{font-size:clamp(30px,4vw,52px);font-weight:800;line-height:1.04;letter-spacing:-1px;margin:16px 0 14px;color:#fff}
.hfv2-cta__btns{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 24px}
.hfv2-cta__checks{list-style:none;display:flex;flex-direction:column;gap:12px;padding:18px 0 0;margin:0;border-top:1px solid rgba(255,255,255,.12)}
.hfv2-cta__checks li{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.9);font-size:14px}
.hfv2-cta__checks .ic{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(74,213,93,.18);color:var(--green);font-size:13px}
.hfv2-cta__card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:30px}
.hfv2-cta__pill{display:inline-flex;align-items:center;gap:6px;background:rgba(74,213,93,.16);color:#8ff0a3;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:6px 13px;border-radius:var(--r-pill);margin-bottom:16px}
.hfv2-cta__pill i{color:var(--green)}
.hfv2-cta__ch{color:#fff;font-size:26px;font-weight:800;line-height:1.15;margin-bottom:10px}
.hfv2-cta__cd{color:rgba(255,255,255,.78);font-size:14px;line-height:1.5;margin-bottom:18px}
.hfv2-cta label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hfv2-cta input{width:100%;min-height:54px;padding:14px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font:400 14px var(--font);margin-bottom:12px}
.hfv2-cta input::placeholder{color:rgba(255,255,255,.55)}
.hfv2-cta__submit{width:100%;min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;border-radius:12px;background:var(--green);color:var(--green-ink);border:0;cursor:pointer;box-shadow:var(--glow)}
.hfv2-cta__note{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.62);font-size:12px;margin-top:13px}

/* ---- Tablet / mobile (one scaled layout) -------------------------------- */
@media(max-width:980px){
 .hfv2-cards3,.hfv2-ins__grid{grid-template-columns:repeat(2,1fr)}
 /* reviews (2026-07-14): mobile = swipe carousel with edge peek, not a vertical stack */
 .hfv2-rv__slider{padding:0;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
 .hfv2-rv__arw{display:none}
 .hfv2-rv__grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding:8px 7vw 22px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
 .hfv2-rv__grid::-webkit-scrollbar{display:none}
 .hfv2-rv__grid .hfv2-rcard{flex:0 0 84%;max-width:420px;scroll-snap-align:center;border-radius:18px;box-shadow:0 22px 44px -22px rgba(4,14,28,.55)}
 .hfv2-carousel__arw{display:none}
 /* product carousel becomes a real horizontal swipe (was a broken vertical stack) */
 .hfv2-pgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;padding:2px 2px 12px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
 .hfv2-pgrid::-webkit-scrollbar{display:none}
 .hfv2-pcard{flex:0 0 280px;scroll-snap-align:start}
 .hfv2-pcard__t{min-height:0}
}
@media(max-width:760px){
 /* hero: IMAGE is the hero — no dark box; one heading (eyebrow hidden); text over a
    bottom gradient for legibility; buttons stacked; dots bottom-centered */
 .hfv2-hero{min-height:82vh;align-items:flex-end;padding:0}
 .hfv2-hero::before{background:linear-gradient(180deg,rgba(7,20,36,.12) 0%,rgba(7,20,36,.22) 42%,rgba(7,20,36,.9) 100%)}
 .hfv2-hero__card{width:100%;background:transparent;border:0;box-shadow:none;border-radius:0;padding:0 22px 64px;backdrop-filter:none;-webkit-backdrop-filter:none}
 .hfv2-hero__card .hfv2-eyebrow{display:none}
 .hfv2-hero__card h1{font-size:clamp(36px,9vw,52px);margin:0 0 12px}
 .hfv2-hero__card .hfv2-lead{font-size:15px;margin-bottom:20px;color:rgba(255,255,255,.92)}
 .hfv2-hero__btns{flex-direction:column}
 .hfv2-hero__btns .hfv2-btn{width:100%}
 .hfv2-hero__nav{left:auto;right:6px;bottom:auto;top:45%;transform:translateY(-50%);justify-content:flex-end}
 .hfv2-hero__arws{display:none}
 /* mobile: vertical fader rail on the right edge instead of bottom dots —
    thin bars, active bar grows and fills green top-down with the autoplay timer */
 .hfv2-hero__dots{flex-direction:column;gap:7px}
 .hfv2-hero__dots span{width:30px;height:22px}
 .hfv2-hero__dots span::before{left:50%;right:auto;top:0;bottom:0;height:auto;width:4px;transform:translateX(-50%);border-radius:999px;background:rgba(255,255,255,.42);box-shadow:0 1px 4px rgba(7,20,36,.35)}
 .hfv2-hero__dots span:hover::before{background:rgba(255,255,255,.65)}
 .hfv2-hero__dots .on{width:30px;height:46px}
 .hfv2-hero__dots .on::before{background:rgba(255,255,255,.32)}
 .hfv2-hero__dots .on::after{left:50%;top:0;width:4px;height:100%;transform:translateX(-50%) scaleY(0);transform-origin:top;border-radius:999px;animation-name:hfv2heroFillY}
 /* trust: 2 side-by-side on mobile, 3rd spans full width; centered icon-on-top */
 .hfv2-htrust .hfv2-wrap{grid-template-columns:repeat(3,1fr)}
 .hfv2-hti{flex-direction:column;align-items:center;text-align:center;gap:8px;padding:18px 8px;border-left:1px solid rgba(255,255,255,.1)}
 .hfv2-hti:first-child{border-left:0}
 .hfv2-hti__ic{width:36px;height:36px}
 .hfv2-hti__ic i{font-size:17px}
 .hfv2-hti__ic .hfv2-lg{width:20px;height:20px}
 .hfv2-hti b{font-size:12.5px;line-height:1.25}
 .hfv2-hti small{display:none}
 /* feature = ONE unified mobile section; text BLENDS onto the image (hero-style
    overlay + bottom gradient), then products follow. No repeated "Featured X". */
 .hfv2-feat{background:#f4f7fb}
 .hfv2-feat__head{display:none}
 .hfv2-spot{position:relative;display:flex;align-items:flex-end;min-height:74vh;overflow:hidden}
 .hfv2-spot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .hfv2-spot::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(7,20,36,.05) 0%,rgba(7,20,36,.28) 45%,rgba(7,20,36,.92) 100%)}
 .hfv2-spot__card{position:relative;z-index:2;width:100%;background:transparent;border-top:0;border-radius:0;padding:0 6vw 34px;gap:12px;box-shadow:none}
 .hfv2-spot__ey{color:var(--green)}
 .hfv2-spot__h{color:#fff}
 .hfv2-spot__p{color:rgba(255,255,255,.92)}
 .hfv2-spot__card .hfv2-btn--navy{background:#fff;color:var(--navy);border-color:#fff}
 .hfv2-feat .hfv2-wrap{padding-top:22px}
 .hfv2-sample__grid,.hfv2-why__grid,.hfv2-cta__grid{grid-template-columns:1fr}
 .hfv2-sample{padding:26px 0}
 .hfv2-sample__grid{gap:0;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:18px;overflow:hidden}
 .hfv2-sample .hfv2-eyebrow{color:var(--green,#4ad55d)}
 .hfv2-sample__media{min-height:0;height:180px;border-radius:0}
 .hfv2-sample__grid>div:last-child{padding:22px 20px 24px}
 .hfv2-sample__h{font-size:23px;margin:8px 0 10px}
 .hfv2-sample .hfv2-lead{font-size:14px;line-height:1.55;margin-bottom:18px}
 .hfv2-sample .hfv2-btn--green{width:100%}
 .hfv2-steps,.hfv2-wstats{grid-template-columns:1fr}
 .hfv2-steps{gap:10px}
 .hfv2-step{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:3px;padding:13px 15px}
 .hfv2-step__n{grid-column:1;grid-row:1 / 3;align-self:center;margin:0;width:34px;height:34px}
 .hfv2-cards3,.hfv2-ins__grid{grid-template-columns:1fr}
 .hfv2-disc-grid{grid-template-columns:1fr 1fr;gap:12px}
 .hfv2-pcard{flex:0 0 82%}
 .hfv2-pcard__dots{display:none}
}

/* ---- Fluent Forms embedded in v2 pages ---- */
.hfv2-page .fluentform .ff-el-group{margin-bottom:14px}
.hfv2-page .fluentform input:not([type=checkbox]):not([type=radio]),.hfv2-page .fluentform textarea,.hfv2-page .fluentform select{border-radius:11px!important;border:1px solid rgba(18,43,76,.18)!important;min-height:48px;font-family:var(--font)!important}
.hfv2-page .fluentform .ff-btn-submit,.hfv2-page .fluentform button[type=submit]{background:var(--navy)!important;color:#fff!important;border:0!important;border-radius:12px!important;font-weight:700!important;min-height:50px;padding:13px 28px!important;text-transform:uppercase;letter-spacing:.4px;cursor:pointer}
.hfv2-cta__card .fluentform label,.hfv2-cta__card .fluentform .ff-el-input--label label{color:#fff!important}
.hfv2-cta__card .fluentform input{background:#fff!important;color:var(--ink)!important}
.hfv2-cta__card .fluentform .ff-btn-submit,.hfv2-cta__card .fluentform button[type=submit]{background:var(--green)!important;color:var(--green-ink)!important;width:100%}
.hfv2-cta__card .fluentform .ff-el-group{margin-bottom:10px}

/* === COLOUR HARDENING — the live theme has global h1/h2/h3 colour rules (e.g. h2{color:#082746}) that override v2 headings which only INHERIT their colour. Re-assert v2 colours at higher specificity so they always win. === */
.hfv2-page .hfv2-hero h1,.hfv2-page .hfv2-hero h2,.hfv2-page .hfv2-hero h3,.hfv2-page .hfv2-hero__card h1{color:#fff!important}
.hfv2-page .hfv2-hero__card .hfv2-lead,.hfv2-page .hfv2-hero__card>p{color:rgba(255,255,255,.92)!important}
@media(max-width:820px){.hfv2-page .hfv2-hero__card h1,.hfv2-page .hfv2-hero__card .hfv2-lead,.hfv2-page .hfv2-hero__card p,.hfv2-page .hfv2-hero__card .hfv2-spot__h{color:#fff!important}}
.hfv2-page .hfv2-sec--dark h1,.hfv2-page .hfv2-sec--dark h2,.hfv2-page .hfv2-sec--dark h3,.hfv2-page .hfv2-sec--dark h4{color:#fff!important}
.hfv2-page .hfv2-cta h1,.hfv2-page .hfv2-cta h2,.hfv2-page .hfv2-cta h3,.hfv2-page .hfv2-cta h4{color:#fff!important}
.hfv2-page .hfv2-reviews h2,.hfv2-page .hfv2-reviews h3,.hfv2-page .hfv2-why h1,.hfv2-page .hfv2-why h2,.hfv2-page .hfv2-why h3,.hfv2-page .hfv2-sample h1,.hfv2-page .hfv2-sample h2,.hfv2-page .hfv2-sample h3{color:#fff!important}
.hfv2-page .hfv2-sec--light .hfv2-h2,.hfv2-page .hfv2-feat__h,.hfv2-page .hfv2-spot__h{color:var(--navy)!important}
/* Feature-spotlight MOBILE (<=760px): the card is transparent over the dark product photo, so the
   heading + description MUST be white. Otherwise the light-card colours (+ the navy .hfv2-spot__h
   guard above, + the theme's global p{} colour) leave them dark-blue on the image = unreadable.
   Higher specificity + !important beat all three. Description bumped to 16px + text-shadow for clarity. */
@media(max-width:760px){
 .hfv2-page .hfv2-spot .hfv2-spot__ey{color:var(--green)!important}
 .hfv2-page .hfv2-spot .hfv2-spot__h{color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.55)}
 .hfv2-page .hfv2-spot .hfv2-spot__p{color:#fff!important;font-size:16px;line-height:1.65;text-shadow:0 1px 12px rgba(0,0,0,.6)}
}
.hfv2-page .hfv2-btn--green{background:var(--green)!important;color:var(--green-ink)!important}
.hfv2-page .hfv2-btn--navy{background:var(--navy)!important;color:#fff!important}
.hfv2-page .hfv2-btn--ghost{color:#fff!important}
.hfv2-page .hfv2-btn--light{background:#fff!important;color:var(--navy)!important}
.hfv2-page .hfv2-btn--outline{color:var(--navy)}
.hfv2-page .hfv2-eyebrow{color:var(--green-text)}
.hfv2-page .hfv2-hero .hfv2-eyebrow,.hfv2-page .hfv2-sec--dark .hfv2-eyebrow,.hfv2-page .hfv2-cta .hfv2-eyebrow,.hfv2-page .hfv2-feat .hfv2-eyebrow,.hfv2-page .hfv2-reviews .hfv2-eyebrow{color:var(--green)}

/* HFV2 live-theme override guard — the active theme forces its own font-family + text colours on
   h1-h4/p/li via !important, which on ?hfv2 takeover pages breaks the Poppins type and the
   dark-section (navy CTA) light text. Re-assert the design here, scoped to .hfv2-page + !important,
   so it always wins. Icons (<i class="ti">) are deliberately NOT selected (keep tabler font). */
.hfv2-page h1,.hfv2-page h2,.hfv2-page h3,.hfv2-page h4,.hfv2-page h5,.hfv2-page p,.hfv2-page li,.hfv2-page a,.hfv2-page label,.hfv2-page button,.hfv2-page input,.hfv2-page select,.hfv2-page textarea,.hfv2-page summary,.hfv2-page strong,.hfv2-page b,.hfv2-page em,.hfv2-page blockquote,.hfv2-page .hfv2-eyebrow,.hfv2-page .hfv2-lead{font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif!important}
.hfv2-page .hfv2-cta__h,.hfv2-page .hfv2-cta__ch{color:#fff!important}
.hfv2-page .hfv2-cta .hfv2-lead{color:rgba(255,255,255,.85)!important}
.hfv2-page .hfv2-cta__checks li{color:rgba(255,255,255,.9)!important}
.hfv2-page .hfv2-cta__cd{color:rgba(255,255,255,.78)!important}
.hfv2-page .hfv2-cta__note{color:rgba(255,255,255,.62)!important}

/* HFV2 button chrome guard — several v2 controls are real <button>s now (the picker bag trigger, the filter
   pills) where they used to be <a>. The active theme paints <button>s with its own white/pill
   background, border, radius & padding via !important — turning the round bag into a white pill
   and the pills into default buttons. Reset + re-assert the preview design, scoped + !important. */
.hfv2-page button{-webkit-appearance:none;appearance:none;touch-action:manipulation}
/* Stop iOS/Android double-tap-to-zoom on tappable controls (gallery arrows/thumbs, qty +/-, format
   tiles, tabs, bag buttons): a quick double-tap must trigger the control, not zoom the page. Keeps
   normal scrolling/panning, and removes the legacy 300ms tap delay. */
.hfv2-page a,.hfv2-page [role=button],.hfv2-page label,.hfv2-page summary{touch-action:manipulation}
.hfv2-page .hfv2-pcard__bag{display:grid!important;place-items:center!important;width:56px!important;height:56px!important;min-width:0!important;max-width:none!important;padding:0!important;border-radius:50%!important;background:linear-gradient(160deg,#1e3d68 0%,#0a1f3d 100%)!important;color:#fff!important;border:1.5px solid rgba(74,213,93,.55)!important;box-shadow:0 12px 28px rgba(10,31,58,.45),0 2px 5px rgba(10,31,58,.3),inset 0 1px 1px rgba(255,255,255,.22)!important}
.hfv2-page .hfv2-pcard__bag:hover{background:linear-gradient(160deg,#5fe072 0%,#3cc551 100%)!important;border-color:var(--green)!important;color:var(--green-ink)!important}
.hfv2-page .hf-fpill{width:auto!important;min-height:0!important;color:var(--body)!important;background:var(--bg-light)!important;border:1px solid transparent!important;border-radius:999px!important;padding:7px 13px!important;font-size:12.5px!important;font-weight:600!important;text-transform:none!important;letter-spacing:normal!important;box-shadow:none!important}
.hfv2-page .hf-fpill.on,.hfv2-page .hf-fpill:hover{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important}
.hfv2-page .hfv2-cta__submit{width:100%!important;min-height:54px!important;background:var(--green)!important;color:var(--green-ink)!important;border:0!important;border-radius:12px!important;box-shadow:var(--glow)!important}
.hfv2-page .hf-clp__sort select{background:#fff!important;color:var(--navy)!important;border:1px solid rgba(18,43,76,.16)!important;border-radius:10px!important;padding:10px 14px!important;min-height:0!important;width:auto!important}

/* HFV2 newsletter cue — the plain CTA email form had no visible cue (label dark-on-dark, placeholder
   light-on-white). Make the field obviously fillable: white label above + readable grey placeholder. */
.hfv2-page .hfv2-cta__card form label{display:block;color:rgba(255,255,255,.92)!important;font-size:12.5px;font-weight:600;letter-spacing:.3px;margin-bottom:8px}
.hfv2-page .hfv2-cta__card input{width:100%;min-height:52px;background:#fff!important;color:#0e1b2e!important;border:1px solid rgba(18,43,76,.12);border-radius:12px;padding:0 16px;font-size:15px;margin-bottom:12px}
.hfv2-page .hfv2-cta__card input::placeholder{color:#8a93a0!important;opacity:1}
.hfv2-page .hfv2-cta__card input::-webkit-input-placeholder{color:#8a93a0!important;opacity:1}

/* HFV2 dark-section card guard — .hfv2-sec--dark sets color:#fff which cascades INTO the white .hfv2-pcard /
   .hfv2-rcard islands, turning their body text (review __txt, price) white-on-white = invisible.
   Reset the cards to proper light islands with their designed text colours. */
.hfv2-page .hfv2-sec--dark .hfv2-pcard,.hfv2-page .hfv2-sec--dark .hfv2-rcard{background:#fff!important;color:var(--body,#59616b)!important}
.hfv2-page .hfv2-sec--dark .hfv2-pcard__t,.hfv2-page .hfv2-sec--dark .hfv2-rcard__name{color:var(--navy)!important}
.hfv2-page .hfv2-sec--dark .hfv2-rcard__txt,.hfv2-page .hfv2-sec--dark .hf-cprice{color:var(--body,#59616b)!important}
.hfv2-page .hfv2-sec--dark .hfv2-pcard__meta{color:var(--green-text,#1f8a3b)!important}
.hfv2-page .hfv2-sec--dark .hfv2-rcard__date{color:#5d6674!important}
.hfv2-page .hfv2-sec--dark .hf-vcard__d,.hfv2-page .hf-vband:not(.hf-vband--light) .hf-vcard__d{color:rgba(255,255,255,.82)!important}
.hfv2-page .hfv2-sec--dark .hf-vcard__t,.hfv2-page .hf-vband:not(.hf-vband--light) .hf-vcard__t{color:#fff!important}
/* Landing CTA newsletter (FluentForm id 2) -> match preview: dark card, STACKED, full-width green button */
.hfv2-page .hfv2-cta__card .fluentform{margin:0!important}
.hfv2-page .hfv2-cta__card .fluentform fieldset{padding:0!important;margin:0!important}
.hfv2-page .hfv2-cta__card .fluentform .ff-t-container.ff-column-container{display:block!important;grid-template-columns:1fr!important;gap:0!important;margin:0!important}
.hfv2-page .hfv2-cta__card .fluentform .ff-t-cell{flex-basis:100%!important;width:100%!important;max-width:100%!important;padding:0!important}
.hfv2-page .hfv2-cta__card .fluentform .ff-el-group{margin-bottom:14px!important}
.hfv2-page .hfv2-cta__card .fluentform label,.hfv2-page .hfv2-cta__card .fluentform .ff-el-input--label label{color:rgba(255,255,255,.82)!important;font-weight:600!important;font-size:12.5px!important;letter-spacing:.3px!important;margin-bottom:7px!important}
.hfv2-page .hfv2-cta__card .fluentform input[type=email],.hfv2-page .hfv2-cta__card .fluentform input[type=text]{width:100%!important;min-height:52px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:12px!important;color:#fff!important;padding:11px 16px!important;font-size:15px!important;box-shadow:none!important}
.hfv2-page .hfv2-cta__card .fluentform input::placeholder{color:rgba(255,255,255,.5)!important}
.hfv2-page .hfv2-cta__card .fluentform input:focus{border-color:var(--green,#4ad55d)!important;box-shadow:0 0 0 3px rgba(74,213,93,.2)!important;outline:none!important}
.hfv2-page .hfv2-cta__card .fluentform .ff-btn-submit,.hfv2-page .hfv2-cta__card .fluentform button[type=submit]{width:100%!important;min-height:54px!important;background:var(--green,#4ad55d)!important;color:var(--green-ink,#072617)!important;border:0!important;border-radius:12px!important;font-size:13px!important;font-weight:700!important;letter-spacing:.5px!important;text-transform:uppercase!important;box-shadow:0 8px 24px rgba(74,213,93,.3)!important;cursor:pointer!important;margin-top:2px!important}
.hfv2-page .hfv2-cta__card .fluentform .ff-btn-submit:hover{background:#3cc551!important}
.hfv2-page .hfv2-sec--dark .hfv2-rcard__stars{color:var(--green,#3cc551)!important}
.hfv2-page .hfv2-sec--dark .hfv2-pcard__v{color:var(--green-text,#1f8a3b)!important}

/* HFV2 reviews premium — subtle navy-glow bg (not flat black), polished tabs (active = green underline),
   deeper card shadow + hover lift. Plus: any outline button on a dark section reads light. */
.hfv2-page .hfv2-reviews{background:radial-gradient(120% 85% at 50% -8%,#123a66 0%,var(--navy-deep,#0a1f3d) 58%)!important}
.hfv2-page .hfv2-rv__tab{color:rgba(255,255,255,.6)!important;font-weight:600;transition:color .2s,border-color .2s}
.hfv2-page .hfv2-rv__tab:hover{color:#fff!important}
.hfv2-page .hfv2-rv__tab[aria-selected="true"]{color:#fff!important;border-bottom-color:var(--green,#4ad55d)!important}
.hfv2-page .hfv2-reviews .hfv2-rcard{box-shadow:0 16px 44px rgba(0,0,0,.30)!important;transition:transform .26s cubic-bezier(.2,.7,.3,1),box-shadow .26s}
.hfv2-page .hfv2-reviews .hfv2-rcard:hover{transform:translateY(-5px);box-shadow:0 26px 56px rgba(0,0,0,.40)!important}
.hfv2-page .hfv2-sec--dark .hfv2-btn--outline{color:#fff!important;border-color:rgba(255,255,255,.85)!important;background:rgba(255,255,255,.1)!important}

/* HFV2 reviews card restructure — kill the square look (theme overrides border-radius): hard-round + clean flex head
   (avatar + name/date left, source right), prominent green stars, readable copy, soft edge. */
.hfv2-page .hfv2-reviews .hfv2-rcard{border-radius:18px!important;padding:24px 24px 22px!important;border:1px solid rgba(18,43,76,.06)!important;overflow:hidden}
.hfv2-page .hfv2-rcard__top{display:flex!important;align-items:center;gap:12px;margin-bottom:15px}
.hfv2-page .hfv2-rcard__top>span:nth-of-type(2){display:flex;flex-direction:column;margin-right:auto;line-height:1.3}
.hfv2-page .hfv2-rcard__top>span:nth-of-type(2) br{display:none}
.hfv2-page .hfv2-rcard__av{border-radius:50%!important;width:46px!important;height:46px!important;font-weight:800}
.hfv2-page .hfv2-rcard__name{color:var(--navy)!important;font-size:15px;font-weight:700}
.hfv2-page .hfv2-rcard__date{color:#5d6674!important;font-size:12px}
.hfv2-page .hfv2-rcard__src{align-self:flex-start;font-size:11px!important;font-weight:700;color:#5d6674!important;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.hfv2-page .hfv2-rcard__stars{color:var(--green,#4ad55d)!important;font-size:15px;letter-spacing:3px;margin-bottom:12px}
.hfv2-page .hfv2-rcard__txt{color:#3a4653!important;font-size:14px;line-height:1.62;margin:0}

/* ===== Homepage guards: theme resets card chrome + forces dark text on dark sections ===== */
.hfv2-page .hfv2-pgrid .hfv2-pcard{background:#fff!important;border:1px solid rgba(18,43,76,.1)!important;border-radius:16px!important;overflow:hidden!important}
.hfv2-page .hfv2-pgrid .hfv2-pcard__m{border-radius:16px 16px 0 0!important}
.hfv2-page .hfv2-feat .hfv2-pcard__bag{background:linear-gradient(160deg,#1e3d63 0%,#0e2444 100%)!important;color:#fff!important}
.hfv2-page .hfv2-feat .hfv2-pcard__bag:hover,.hfv2-page .hfv2-feat .hfv2-pcard__bag:focus-visible{background:linear-gradient(160deg,#5fe072 0%,#3cc551 100%)!important;color:#08331a!important}
.hfv2-page .hfv2-sec--dark .hfv2-checks li,.hfv2-page .hfv2-sec--dark .hfv2-checks li>span:not(.ic){color:rgba(255,255,255,.92)!important}
.hfv2-page .hfv2-sec--dark .hfv2-checks .g{color:var(--green,#4ad55d)!important}
.hfv2-page .hfv2-sec--dark .hfv2-checks .ic{color:var(--green,#4ad55d)!important}
/* ===== GLOBAL uniform product-card bag button — navy circle, green hover, NO .hf-atc pill expansion.
   Specificity (0,4,0 via [data-pid]) beats extra-shop's white-bag rules + the Product-System .hf-atc pill. ===== */
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid],
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid]:hover,
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid]:focus,
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid]:focus-visible{
  display:grid!important;place-items:center!important;
  width:52px!important;min-width:52px!important;max-width:52px!important;height:52px!important;
  padding:0!important;gap:0!important;margin:0!important;border-radius:50%!important;border:0!important;
  font-size:0!important;letter-spacing:0!important;overflow:hidden!important;white-space:nowrap!important;
  transform:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  background:linear-gradient(160deg,#20406a 0%,#0e2444 100%)!important;color:#fff!important;
  box-shadow:0 10px 22px -8px rgba(6,27,49,.5)!important;transition:background .2s ease,transform .2s ease!important;
}
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid]:hover,
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid]:focus-visible{
  background:linear-gradient(160deg,#5fe072 0%,#3cc551 100%)!important;color:#08331a!important;transform:translateY(-1px)!important;
}
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid] svg,
.hfv2-page .hfv2-pcard__bag.hf-atc[data-pid] i{width:22px!important;height:22px!important;font-size:22px!important;flex:none!important;margin:0!important;opacity:1!important}

/* ============================================================================
   100% v2 LOOK — Product-System PICKER + CONFIRM modal (the box/pallet chooser that
   opens on Add-to-Basket). The modal already runs on Poppins + navy #122B4C and is
   driven ENTIRELY by --hfui-* design tokens, so we re-skin the whole thing by overriding
   those tokens to the v2 palette: brighter green, bigger radius, v2 shadow. Layout &
   structure untouched → zero risk to the add-to-cart flow. Only loads where this file
   loads (= v2 pages). Wrong-guess element selectors below simply no-op.
   ========================================================================== */
.hf-ui-system{
 --hfui-navy:#122B4C!important; --hfui-navy-dark:#0a1f3a!important;
 --hfui-champagne:#4ad55d!important; --hfui-champagne-soft:rgba(74,213,93,.16)!important;
 --hfui-success:#237a3a!important; --hfui-ink:#182033!important; --hfui-body:#59616b!important;
 --hfui-radius:16px!important;
 --hfui-shadow:0 12px 32px rgba(16,35,61,.10)!important;
 --hfui-shadow-lg:0 24px 60px -28px rgba(16,35,61,.40)!important;
 --hfui-font:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif!important;
}
.hf-ui-modal__backdrop{background:rgba(10,31,58,.55)!important}
.hf-ui-btn{border-radius:999px!important;font-family:'Poppins',system-ui,sans-serif!important;font-weight:700!important;letter-spacing:.3px!important}
.hf-ui-btn:not(.hf-ui-btn--secondary){background:#4ad55d!important;color:#072617!important;border:0!important;box-shadow:0 8px 24px rgba(74,213,93,.30)!important}
.hf-ui-btn--secondary{background:#fff!important;color:#122B4C!important;border:2px solid rgba(18,43,76,.16)!important}
.hfps-row.is-on,.hfps-row[aria-selected="true"],.hfps-row--selected,.hfps-row.selected{border-color:#4ad55d!important;background:rgba(74,213,93,.06)!important;box-shadow:inset 0 0 0 2px #4ad55d,0 10px 26px -14px rgba(16,35,61,.30)!important}
.hf-ui-eyebrow{color:#237a3a!important}
/* Modal scroll-lock — re-asserted here so it survives even after the big legacy product-surface CSS
   block (which also carried this rule) is stripped for performance. */
body.hf-ui-modal-open{overflow:hidden!important}

/* v2 "Added to basket" confirmation popup (PDP add-to-basket, injected by hf-home-v2.js). */
.hf-added{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .2s}
.hf-added.is-on{opacity:1;pointer-events:auto}
.hf-added__bd{position:absolute;inset:0;background:rgba(10,31,58,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.hf-added__box{position:relative;background:#fff;border-radius:18px;padding:30px 30px 26px;width:min(400px,92vw);text-align:center;box-shadow:0 30px 70px -20px rgba(10,31,58,.5);transform:translateY(14px) scale(.97);transition:transform .25s cubic-bezier(.2,.7,.3,1);font-family:'Poppins',system-ui,-apple-system,sans-serif}
.hf-added.is-on .hf-added__box{transform:none}
.hf-added__tick{width:56px;height:56px;border-radius:50%;background:#4ad55d;color:#072617;display:grid;place-items:center;margin:0 auto 14px;box-shadow:0 10px 26px rgba(74,213,93,.4)}
.hf-added__t{font-size:20px;font-weight:800;color:#122B4C;margin-bottom:4px;letter-spacing:-.3px}
.hf-added__p{font-size:14px;color:#59616b;margin:0 auto 20px;line-height:1.4;max-width:30ch}
.hf-added__btns{display:flex;gap:10px}
.hf-added__cart,.hf-added__cont{flex:1;min-height:48px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;font-size:13.5px;font-weight:700;letter-spacing:.3px;cursor:pointer;text-decoration:none;border:0;font-family:inherit}
.hf-added__cart{background:#122B4C;color:#fff}
.hf-added__cont{background:#eef2f8;color:#122B4C}
.hf-added__cart:hover{filter:brightness(1.12)}.hf-added__cont:hover{background:#e2e8f1}
.hf-addbasket--busy{opacity:.6;pointer-events:none}
@media(prefers-reduced-motion:reduce){.hf-added,.hf-added__box{transition:none}}
/* ---- Bespoke Oak Collection teaser (homepage) — navy/serif look of the landing.
   Colours are specificity-hardened: the homepage sheet paints h2/p navy/grey which
   made the headline invisible on the navy band. ---- */
.hfv2-page .hfbot{background:linear-gradient(135deg,#0d2440 0%,#0a1f3a 70%,#0c2647 100%);color:#fff;position:relative;overflow:hidden}
.hfv2-page .hfbot::before{content:"";position:absolute;top:-160px;right:-120px;width:620px;height:500px;background:radial-gradient(closest-side,rgba(74,213,93,.16),transparent 70%);pointer-events:none}
.hfv2-page .hfbot::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,rgba(74,213,93,.55),transparent)}
.hfbot__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,70px);align-items:center;position:relative}
.hfbot__kick{display:inline-flex;align-items:center;gap:10px;color:var(--green)!important;font-size:12px;font-weight:700;letter-spacing:2.6px;text-transform:uppercase}
.hfbot__uk{width:34px;height:23px;border-radius:4px;flex:none;box-shadow:0 4px 10px rgba(0,0,0,.35)}
.hfv2-page .hfbot .hfbot__h{margin:16px 0 0;color:#fff!important;font-size:clamp(30px,3.9vw,50px);font-weight:800;letter-spacing:-1.6px;line-height:1.04;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.hfv2-page .hfbot .hfbot__h em{font-family:Georgia,serif;font-style:italic;font-weight:600;color:var(--green)!important}
.hfv2-page .hfbot .hfbot__d{margin:16px 0 0;color:rgba(255,255,255,.82)!important;font-size:15.5px;line-height:1.68;max-width:52ch}
.hfbot__chips{display:flex;align-items:center;margin-top:18px}
.hfbot__chips img{width:30px;height:30px;border-radius:50%;border:2px solid #0d2440;object-fit:cover;margin-left:-9px;box-shadow:0 4px 10px rgba(0,0,0,.3)}
.hfbot__chips img:first-child{margin-left:0}
.hfv2-page .hfbot .hfbot__chips span{margin-left:10px;font-size:12px;font-weight:700;color:rgba(255,255,255,.7)!important;letter-spacing:.4px}
.hfbot__btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hfv2-page .hfbot .hfv2-btn--ghost{background:rgba(255,255,255,.07);color:#fff!important;border-color:rgba(255,255,255,.5)}
.hfbot__media{position:relative;display:block;min-height:370px;text-decoration:none}
.hfbot__tile{position:absolute;border-radius:16px;object-fit:cover;box-shadow:0 34px 64px -24px rgba(0,0,0,.65);border:5px solid rgba(255,255,255,.1);outline:1px solid rgba(255,255,255,.22);transition:transform .4s ease;animation:hfbot-float 7s ease-in-out infinite alternate}
.hfbot__tile--a{width:64%;height:210px;top:14px;left:0;transform:rotate(-3deg);z-index:2}
.hfbot__tile--b{width:50%;height:170px;right:0;top:92px;transform:rotate(2.5deg);z-index:3;animation-delay:1.6s}
.hfbot__tile--c{width:44%;height:140px;left:15%;bottom:6px;transform:rotate(-1.5deg);z-index:1;animation-delay:3.1s}
@keyframes hfbot-float{from{margin-top:0}to{margin-top:-9px}}
@media(prefers-reduced-motion:reduce){.hfbot__tile{animation:none}}
.hfbot__media:hover .hfbot__tile--a{transform:rotate(-1deg) scale(1.02)}
.hfbot__media:hover .hfbot__tile--b{transform:rotate(1deg) scale(1.02)}
.hfbot__media:hover .hfbot__tile--c{transform:rotate(0deg) scale(1.02)}
.hfbot__badge{position:absolute;top:-4px;right:6%;z-index:4;background:linear-gradient(135deg,#57e06b,#37c34c);color:#072617;font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;text-align:center;line-height:1.35;padding:11px 16px;border-radius:999px;transform:rotate(6deg);box-shadow:0 14px 30px -8px rgba(74,213,93,.55)}
.hfbot__badge em{font-family:Georgia,serif;font-style:italic;font-weight:600;text-transform:none;font-size:11.5px}
.hfbot__seal{position:absolute;left:-14px;bottom:-10px;z-index:4;width:92px;height:92px;transform:rotate(-9deg);filter:drop-shadow(0 12px 24px rgba(0,0,0,.5))}
.hfbot__seal svg{width:100%;height:100%;display:block}
@media(max-width:900px){.hfbot__grid{grid-template-columns:1fr}.hfbot__media{min-height:320px;margin-top:12px}.hfbot__seal{left:0}}

/* == Latest-articles carousel (homepage) ============================== */
.hfart-car{position:relative;margin-top:36px}
.hfart-car__track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:6px 4px 18px}
.hfart-car__track::-webkit-scrollbar{display:none}
.hfart-card{flex:0 0 min(340px,82vw);scroll-snap-align:start;background:#fff;border:1px solid rgba(18,43,76,.1);border-radius:18px;overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.hfart-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(16,35,61,.14)}
.hfart-card__m{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:#e7ecf3}
.hfart-card__m img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.hfart-card:hover .hfart-card__m img{transform:scale(1.06)}
.hfart-card__tag{position:absolute;left:12px;top:12px;background:rgba(10,31,58,.9);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:6px 11px;border-radius:999px}
.hfart-card__b{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}
.hfart-card__t{font-weight:800;color:var(--navy);font-size:16.5px;line-height:1.32}
.hfart-card__d{color:var(--body);font-size:13.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hfart-card__x{margin-top:auto;display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:800;color:var(--green-text)}
.hfart-car__arw{position:absolute;top:38%;z-index:2;width:44px;height:44px;border-radius:50%;border:1px solid rgba(18,43,76,.14);background:#fff;color:var(--navy);display:grid;place-items:center;cursor:pointer;font-size:19px;box-shadow:0 8px 22px rgba(16,35,61,.14);transition:background .2s,color .2s}
.hfart-car__arw:hover{background:var(--navy);color:#fff}
.hfart-car__arw.l{left:-12px}
.hfart-car__arw.r{right:-12px}
@media(max-width:760px){.hfart-car__arw{display:none}}

/* == Latest-articles carousel v2: dark premium section, feature card, dots == */
.hfart-sec .hfart-card{border:0;box-shadow:0 10px 30px rgba(4,14,28,.35)}
.hfart-card--feat{flex-basis:min(430px,88vw)}
.hfart-card--feat .hfart-card__m{aspect-ratio:16/11}
.hfart-card--feat .hfart-card__tag{background:var(--green,#4ad55d);color:#0a1f3a}
.hfart-card--feat .hfart-card__t{font-size:19px}
.hfart-sec .hfart-car__arw{border:0}
.hfart-car__dots{display:flex;gap:8px;justify-content:center;margin-top:18px}
.hfart-dot{width:24px;height:24px;border-radius:999px;border:0;padding:0;background:transparent;cursor:pointer;display:grid;place-items:center}
.hfart-dot::before{content:"";width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.28);transition:width .25s,background .25s}
.hfart-dot.on::before{width:26px;background:var(--green,#4ad55d)}

/* Carousel-Header kompakt: Titel einzeilig auf Desktop, mobil wieder umbrechend */
@media(max-width:640px){.hfart-sec .hfv2-h2{white-space:normal!important;font-size:26px!important}}
.hfart-sec .hfart-car{margin-top:26px}

/* Insight-Hub (3 Karten): zentriert + größer */
.hfhub-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:28px;max-width:1240px;margin-left:auto;margin-right:auto}
@media(max-width:860px){.hfhub-3{grid-template-columns:1fr!important}}
.hfhub-3 .hfv2-icard__m{aspect-ratio:16/10}
.hfhub-3 .hfv2-icard__b{padding:26px 28px 28px}
.hfhub-3 .hfv2-icard__t{font-size:21px}
.hfhub-3 .hfv2-icard__d{font-size:15px;line-height:1.6}
.hfhub-3 .hfv2-icard__x{font-size:14px}

/* == Reviews-Sektion mobil kompakt (Header + Trust-Badges + Tabs + Karten) == */
@media(max-width:640px){
.hfv2-reviews{padding:46px 0}
.hfv2-reviews .hfv2-eyebrow{font-size:11px;margin-bottom:8px!important}
.hfv2-reviews .hfv2-h2{font-size:24px;line-height:1.22;letter-spacing:-.4px}
.hfv2-reviews .hfv2-ul{margin-top:10px}
.hfv2-reviews .hfv2-lead{font-size:14.5px;line-height:1.55;margin-top:10px!important}
.hfv2-rv__trust{gap:8px 14px;margin:16px 0 0}
.hfv2-rv__tg{gap:7px;font-size:13px}
.hfv2-rv__tg .st{font-size:12px;letter-spacing:1px}
.hfv2-rv__tg .sc{font-size:13px}
.hfv2-rv__vd{display:none}
.hfv2-rv__tabs{gap:6px;margin-top:16px}
.hfv2-rv__tab{font-size:11.5px;padding:8px 13px;letter-spacing:.6px}
.hfv2-rcard{padding:18px 18px 20px}
.hfv2-rcard__txt{font-size:14px;line-height:1.6}
.hfv2-rcard__q{font-size:40px}
.hfv2-rv__slider{margin-top:18px}
}

/* reviews section, extra mobile polish (2026-07-14) */
@media(max-width:640px){
.hfv2-reviews{padding-top:clamp(34px,7vw,48px);padding-bottom:clamp(30px,6vw,44px)}
.hfv2-rv__trust{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:9px 18px;width:max-content;max-width:100%;margin:18px auto 0;gap:8px 16px}
.hfv2-rv__tabs{max-width:none;justify-content:center}
.hfv2-rcard__name{font-size:15px}
.hfv2-rcard__stars{margin:8px 0 6px}
.hfv2-rv__more{margin-top:18px}
}

/* ===== Insight & Inspiration hubs: mobile swipe carousel (2026-07-14) =====
   On phones the hub cards became a long vertical stack — swipe them instead.
   Applies globally to every .hfv2-ins__grid (homepage + marketing pages);
   edge-bleeds out of the 92vw wrap so cards peek from the right. */
@media(max-width:860px){
 .hfv2-ins__grid{display:flex!important;grid-template-columns:none!important;gap:14px!important;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -4vw;padding:6px 4vw 22px;scroll-padding-left:4vw}
 .hfv2-ins__grid::-webkit-scrollbar{display:none}
 .hfv2-ins__grid .hfv2-icard{flex:0 0 min(78vw,320px);min-width:min(78vw,320px);scroll-snap-align:start}
 .hfv2-ins__grid .hfv2-icard__m{aspect-ratio:16/10}
}

/* Trade price teaser (shown to non-trade visitors on eligible product cards) */
.hf-trade-teaser{display:block;margin-top:4px;font-size:11.5px;font-weight:600;line-height:1.3;color:#2ea043;text-decoration:none;letter-spacing:.01em}
.hf-trade-teaser b{font-weight:800}
.hf-trade-teaser:hover{text-decoration:underline}

/* Trade price shown as a visible saving: retail struck through + trade price + badge */
.hf-trade-was{text-decoration:line-through;color:#9aa3b0;font-weight:600;margin-right:2px}
.hf-trade-now{color:#137a2e}
.hf-trade-tag{display:inline-block;margin-left:4px;padding:1px 7px;border-radius:999px;background:#e7f7ec;color:#137a2e;font-size:10.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;vertical-align:middle}

/* Homepage trade section — premium split (content + image with savings badge) */
.hf-hometrade{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,58px);align-items:center}
.hf-hometrade__chips{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 26px}
.hf-hometrade__chips span{padding:9px 15px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.82);font-size:13px;font-weight:600}
.hf-hometrade__chips b{color:#fff;font-weight:800}
.hf-hometrade__media{position:relative}
.hf-hometrade__media img{width:100%;border-radius:20px;display:block;box-shadow:0 30px 70px -30px rgba(0,0,0,.6)}
.hf-hometrade__badge{position:absolute;right:-12px;bottom:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;width:122px;height:122px;border-radius:50%;background:linear-gradient(160deg,#57e06b,#37c34c);color:#072617;box-shadow:0 22px 44px -12px rgba(74,213,93,.6);border:4px solid rgba(255,255,255,.14)}
.hf-hometrade__badge span{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;opacity:.85}
.hf-hometrade__badge b{font-size:40px;font-weight:800;line-height:.85;letter-spacing:-1.5px}
.hf-hometrade__badge small{font-size:10.5px;font-weight:700;opacity:.75}
.hf-hometrade__badge--word b{font-size:23px;letter-spacing:-.4px;margin:1px 0}
@media(max-width:820px){.hf-hometrade{grid-template-columns:1fr}.hf-hometrade__media{order:-1}.hf-hometrade__badge{width:98px;height:98px;right:14px;bottom:12px}.hf-hometrade__badge b{font-size:32px}}

/* PDP trade banner + struck price inside the box/pallet tiles */
.hf-trade-banner{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:10px 14px;border-radius:10px;background:linear-gradient(135deg,#eafaef,#dff5e6);border:1px solid #bfe8cb;color:#137a2e;font-weight:700;font-size:13.5px}
.hf-trade-banner i{font-size:17px}
.hf-trade-banner span{font-weight:600;color:#4b8a5f}
.hf-bp__v--trade{line-height:1.12}
.hf-bp__v--trade .hf-trade-was{display:block;text-decoration:line-through;text-decoration-thickness:1.5px;opacity:.5;font-size:.5em;font-weight:600;line-height:1.25;letter-spacing:0}
.hf-bp__v--trade .hf-trade-now{display:block;line-height:1}
.hf-bp__save{display:inline-block;margin-top:5px;padding:1px 8px;border-radius:999px;background:rgba(74,213,93,.16);color:#37c34c;font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
