/*
Theme Name: Fleshlightindia
Theme URI: https://desirematrix.com/
Author: DesireMatrix
Author URI: https://desirematrix.com/
Description: A bold, conversion-focused WooCommerce theme for intimate wellness retail. Discreet-first messaging, category merchandising, editorial blog, FAQ and a floating WhatsApp concierge.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fleshlightindia
Tags: e-commerce, custom-logo, custom-menu, featured-images, blog, two-columns
*/

/* ==========================================================================
   1. Tokens
   ========================================================================== */
:root{
  --fi-red:#E11D2A;
  --fi-red-dark:#B0141F;
  --fi-black:#0B0B0C;
  --fi-ink:#15161A;
  --fi-body:#4A4D57;
  --fi-muted:#8A8E99;
  --fi-line:#E4E5E9;
  --fi-soft:#F4F4F6;
  --fi-white:#FFFFFF;

  --fi-display:'Anton',"Arial Narrow",Impact,sans-serif;
  --fi-sans:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;

  --fi-max:1200px;
  --fi-gutter:20px;
  --fi-radius:10px;
  --fi-radius-lg:16px;
  --fi-shadow:0 10px 30px rgba(11,11,12,.08);
  --fi-shadow-lg:0 24px 60px rgba(11,11,12,.16);
  --fi-t:.25s cubic-bezier(.4,0,.2,1);
}

/* ==========================================================================
   2. Base
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--fi-sans);
  font-size:16px;
  line-height:1.65;
  color:var(--fi-body);
  background:var(--fi-white);
  overflow-x:hidden;
}
body.fi-locked{overflow:hidden;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--fi-red);text-decoration:none;transition:color var(--fi-t);}
a:hover{color:var(--fi-red-dark);}
h1,h2,h3,h4,h5,h6{
  font-family:var(--fi-display);
  color:var(--fi-ink);
  margin:0 0 .5em;
  font-weight:400;
  line-height:1.02;
  letter-spacing:.01em;
  text-transform:uppercase;
}
h1{font-size:clamp(2.4rem,6vw,4.2rem);}
h2{font-size:clamp(1.9rem,4.4vw,3.1rem);}
h3{font-size:clamp(1.25rem,2.4vw,1.7rem);}
h4{font-size:1.15rem;}
p{margin:0 0 1.15em;}
ul,ol{margin:0 0 1.15em;padding-left:1.2em;}
blockquote{
  margin:1.5em 0;padding:1em 1.4em;
  border-left:4px solid var(--fi-red);
  background:var(--fi-soft);font-style:italic;color:var(--fi-ink);
}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;}
pre{background:var(--fi-black);color:#EDEDED;padding:1.2em;border-radius:var(--fi-radius);overflow:auto;}
table{width:100%;border-collapse:collapse;margin-bottom:1.5em;}
th,td{padding:.75em 1em;border:1px solid var(--fi-line);text-align:left;}
th{background:var(--fi-soft);font-weight:700;color:var(--fi-ink);}
hr{border:0;border-top:1px solid var(--fi-line);margin:2.5em 0;}
::selection{background:var(--fi-red);color:#fff;}

/* ==========================================================================
   3. Layout helpers
   ========================================================================== */
.fi-wrap{width:100%;max-width:var(--fi-max);margin:0 auto;padding-inline:var(--fi-gutter);}
.fi-wrap--narrow{max-width:840px;}
.fi-section{padding-block:clamp(56px,7vw,96px);}
.fi-section--soft{background:var(--fi-soft);}
.fi-section--dark{background:var(--fi-black);color:#C9CBD2;}
.fi-section--dark h2,.fi-section--dark h3,.fi-section--dark h4{color:#fff;}
.fi-head{text-align:center;max-width:780px;margin:0 auto clamp(32px,4vw,54px);}
.fi-head p{color:var(--fi-muted);font-size:1.02rem;margin-bottom:0;}
.fi-section--dark .fi-head p{color:#9A9DA6;}
.fi-em{color:var(--fi-red);}
.fi-eyebrow{
  display:inline-block;font-family:var(--fi-sans);font-size:.72rem;font-weight:800;
  letter-spacing:.18em;text-transform:uppercase;color:var(--fi-red);margin-bottom:14px;
}
.screen-reader-text{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link:focus{
  position:fixed;top:12px;left:12px;z-index:9999;width:auto;height:auto;
  clip:auto;padding:12px 20px;background:var(--fi-red);color:#fff;border-radius:6px;
}

/* ==========================================================================
   4. Buttons
   ========================================================================== */
.fi-btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--fi-sans);font-size:.82rem;font-weight:800;
  letter-spacing:.09em;text-transform:uppercase;
  padding:15px 28px;border:2px solid transparent;border-radius:4px;
  cursor:pointer;transition:all var(--fi-t);white-space:nowrap;
}
.fi-btn .fi-arrow{transition:transform var(--fi-t);}
.fi-btn:hover .fi-arrow{transform:translateX(4px);}
.fi-btn--primary{background:var(--fi-red);color:#fff;}
.fi-btn--primary:hover{background:var(--fi-red-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 24px rgba(225,29,42,.32);}
.fi-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);}
.fi-btn--ghost:hover{background:#fff;color:var(--fi-ink);border-color:#fff;}
.fi-btn--dark{background:var(--fi-ink);color:#fff;}
.fi-btn--dark:hover{background:var(--fi-black);color:#fff;transform:translateY(-2px);}
.fi-btn--outline{background:transparent;color:var(--fi-ink);border-color:var(--fi-ink);}
.fi-btn--outline:hover{background:var(--fi-ink);color:#fff;}
.fi-btn--sm{padding:11px 20px;font-size:.74rem;}
.fi-btn--block{width:100%;justify-content:center;}

/* ==========================================================================
   5. Announcement bar
   ========================================================================== */
.fi-announce{
  background:var(--fi-black);color:#fff;font-size:.78rem;font-weight:600;
  letter-spacing:.04em;text-align:center;padding:9px 20px;position:relative;z-index:60;
}
.fi-announce a{color:#fff;text-decoration:underline;text-underline-offset:3px;}
.fi-announce__track{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;}
.fi-announce__dot{width:5px;height:5px;border-radius:50%;background:var(--fi-red);flex:none;}

/* ==========================================================================
   6. Header
   ========================================================================== */
.fi-header{
  position:sticky;top:0;z-index:55;background:var(--fi-white);
  border-bottom:1px solid var(--fi-line);transition:box-shadow var(--fi-t);
}
.fi-header.is-stuck{box-shadow:0 6px 24px rgba(11,11,12,.10);}
.fi-header__inner{display:flex;align-items:center;gap:24px;min-height:78px;}

.fi-brand{display:flex;align-items:center;gap:12px;flex:none;margin-right:auto;}
.fi-brand__mark{
  width:44px;height:44px;border-radius:50%;flex:none;
  display:grid;place-items:center;background:var(--fi-ink);
  font-family:var(--fi-display);font-size:1.15rem;color:#fff;letter-spacing:-.02em;
  line-height:1;white-space:nowrap;
}
.fi-brand__mark span{color:var(--fi-red);}
.fi-brand__text{display:flex;flex-direction:column;line-height:1;}
.fi-brand__name{
  font-family:var(--fi-display);font-size:1.42rem;text-transform:uppercase;
  color:var(--fi-ink);letter-spacing:.005em;
}
.fi-brand__name em{font-style:normal;color:var(--fi-red);}
.fi-brand__by{
  font-size:.64rem;font-weight:600;letter-spacing:.11em;
  color:var(--fi-muted);margin-top:5px;
}
.fi-brand__by a{color:var(--fi-muted);}
.fi-brand__by a:hover{color:var(--fi-red);}
.fi-brand img{max-height:52px;width:auto;}

.fi-nav{display:flex;}
.fi-nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:30px;}
.fi-nav li{position:relative;}
.fi-nav a{
  font-size:.83rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--fi-ink);padding-block:10px;display:inline-block;position:relative;
}
.fi-nav a::after{
  content:"";position:absolute;left:0;bottom:2px;width:0;height:2px;
  background:var(--fi-red);transition:width var(--fi-t);
}
.fi-nav a:hover{color:var(--fi-red);}
.fi-nav a:hover::after,.fi-nav .current-menu-item>a::after{width:100%;}
.fi-nav .sub-menu{
  position:absolute;top:100%;left:0;min-width:225px;background:#fff;
  border:1px solid var(--fi-line);border-radius:var(--fi-radius);padding:10px;
  box-shadow:var(--fi-shadow);display:block;
  opacity:0;visibility:hidden;transform:translateY(8px);transition:all var(--fi-t);
}
.fi-nav li:hover>.sub-menu{opacity:1;visibility:visible;transform:translateY(0);}
.fi-nav .sub-menu a{
  display:block;padding:9px 12px;border-radius:6px;text-transform:none;
  letter-spacing:.01em;font-size:.88rem;font-weight:600;
}
.fi-nav .sub-menu a::after{display:none;}
.fi-nav .sub-menu a:hover{background:var(--fi-soft);}
/* selectbox-style dropdown */
.fi-nav .fi-has-sub>a{display:inline-flex;align-items:center;gap:7px;}
.fi-caret{
  width:0;height:0;flex:none;
  border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid currentColor;
  transition:transform var(--fi-t);
}
.fi-nav .fi-has-sub:hover>a .fi-caret{transform:rotate(180deg);}
.fi-nav .sub-menu{padding:8px;}
.fi-nav .sub-menu a{display:flex;align-items:center;justify-content:space-between;gap:14px;}
.fi-subcount{
  font-size:.7rem;font-weight:800;color:var(--fi-muted);
  background:var(--fi-soft);border-radius:20px;padding:2px 8px;min-width:24px;text-align:center;
}
.fi-nav .sub-menu a:hover .fi-subcount{background:#fff;color:var(--fi-red);}
.fi-sub-all{border-top:1px solid var(--fi-line);margin-top:6px;padding-top:6px;}
.fi-sub-all a{color:var(--fi-red)!important;font-weight:800!important;font-size:.8rem!important;text-transform:uppercase;letter-spacing:.05em;}
.fi-drawer .fi-subcount{display:none;}

.fi-tools{display:flex;align-items:center;gap:6px;flex:none;}
.fi-tool{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  color:var(--fi-ink);background:transparent;border:0;cursor:pointer;
  position:relative;transition:background var(--fi-t),color var(--fi-t);
}
.fi-tool:hover{background:var(--fi-soft);color:var(--fi-red);}
.fi-tool__count{
  position:absolute;top:3px;right:2px;min-width:18px;height:18px;padding:0 5px;
  border-radius:9px;background:var(--fi-red);color:#fff;
  font-size:.64rem;font-weight:800;display:grid;place-items:center;line-height:1;
}
.fi-burger{display:none;}

/* search drawer */
.fi-search{
  display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--fi-t);
  border-top:0 solid var(--fi-line);background:var(--fi-soft);
}
.fi-search.is-open{grid-template-rows:1fr;border-top-width:1px;}
.fi-search__inner{overflow:hidden;}
.fi-search form{display:flex;gap:10px;padding-block:18px;}
.fi-search input[type="search"]{flex:1;}

/* mobile drawer */
.fi-drawer{
  position:fixed;inset:0 0 0 auto;width:min(340px,86vw);background:#fff;z-index:90;
  transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;padding:22px;overflow-y:auto;
}
.fi-drawer.is-open{transform:translateX(0);}
.fi-drawer__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.fi-drawer ul{list-style:none;margin:0;padding:0;}
.fi-drawer li{border-bottom:1px solid var(--fi-line);}
.fi-drawer a{
  display:block;padding:14px 2px;font-weight:700;font-size:.95rem;
  text-transform:uppercase;letter-spacing:.04em;color:var(--fi-ink);
}
.fi-drawer a:hover{color:var(--fi-red);}
.fi-drawer .sub-menu a{padding-left:16px;text-transform:none;font-weight:600;font-size:.88rem;color:var(--fi-body);}
.fi-drawer__foot{margin-top:auto;padding-top:24px;}
.fi-overlay{
  position:fixed;inset:0;background:rgba(11,11,12,.55);z-index:85;
  opacity:0;visibility:hidden;transition:all var(--fi-t);backdrop-filter:blur(2px);
}
.fi-overlay.is-open{opacity:1;visibility:visible;}

/* ==========================================================================
   7. Hero
   ========================================================================== */
.fi-hero{
  position:relative;background:var(--fi-black);color:#fff;overflow:hidden;
  padding-block:clamp(56px,7vw,92px);
}
.fi-hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(900px 480px at 78% 42%,rgba(225,29,42,.28),transparent 62%),
    radial-gradient(700px 420px at 12% 88%,rgba(255,255,255,.07),transparent 60%);
}
.fi-hero__bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;opacity:.3;}

/* --- Photo hero -----------------------------------------------------------
   The Customizer image is the backdrop. A full-bleed cover crop is what makes
   it fill any screen, so the job is to park the crop on the subject at each
   breakpoint and lay a directional scrim under the copy for contrast. */
.fi-hero--photo{min-height:clamp(560px,60vw,700px);display:flex;align-items:center;}
/* contain = the whole image, never cropped. The photo's own black backdrop
   matches --fi-black, so the letterboxing is invisible and it reads as a
   full-bleed shot rather than a boxed picture. */
.fi-hero--photo .fi-hero__bg{
  object-fit:contain;
  object-position:right center;   /* desktop: image right, copy left */
  opacity:1;
}
.fi-hero--photo::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,
    rgba(11,11,12,.92) 0%,
    rgba(11,11,12,.74) 32%,
    rgba(11,11,12,.28) 50%,
    transparent 64%);
}
.fi-hero--photo::before{opacity:.45;}
/* Thin brand rule closes the hero cleanly against the next section. */
.fi-hero--photo{border-bottom:3px solid var(--fi-red);}

.fi-hero__grid{
  position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(28px,4vw,56px);align-items:center;
}
.fi-hero__grid--solo{grid-template-columns:1fr;}
.fi-hero__grid--solo .fi-hero__copy{max-width:600px;}
.fi-hero__grid--solo .fi-hero__points{max-width:560px;}
.fi-hero__stars{display:flex;align-items:center;gap:9px;margin-bottom:18px;font-size:.76rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#B9BCC4;}
.fi-stars{color:var(--fi-red);letter-spacing:2px;font-size:.9rem;}

/* Kicker: a thin rule + small caps line that anchors the headline. */
.fi-hero__kicker{
  display:inline-flex;align-items:center;gap:12px;margin-bottom:22px;
  font-size:.72rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;
  color:#C8CBD2;
}
.fi-hero__kicker::before{
  content:"";width:34px;height:2px;flex:none;border-radius:2px;
  background:linear-gradient(90deg,var(--fi-red),rgba(225,29,42,.15));
}

.fi-hero h1{
  color:#fff;margin-bottom:22px;
  font-size:clamp(2.6rem,6.2vw,4.6rem);
  line-height:.96;letter-spacing:.005em;
}
.fi-hero h1 .fi-em{display:block;}
.fi-hero__lead{
  font-size:clamp(1rem,1.15vw,1.12rem);line-height:1.7;
  color:#C4C7CE;max-width:46ch;margin-bottom:34px;
}
.fi-hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:0;}
.fi-hero__cta .fi-btn{padding:17px 32px;}
.fi-hero__points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 26px;max-width:520px;}
.fi-point{display:flex;align-items:center;gap:10px;font-size:.84rem;font-weight:600;color:#D6D8DD;}
.fi-point__tick{
  width:19px;height:19px;border-radius:50%;background:var(--fi-red);flex:none;
  display:grid;place-items:center;color:#fff;font-size:.62rem;font-weight:900;
}
/* --- Hero image -----------------------------------------------------------
   One image, shown COMPLETE at every breakpoint: object-fit:contain means it
   is never cropped, only scaled to fit the space each device can spare.
   --dh is the height budget, re-declared per breakpoint below. */
.fi-hero__media{
  --dh:clamp(340px,40vw,540px);
  position:relative;display:flex;align-items:center;justify-content:center;
  min-height:var(--dh);
}
/* Soft brand glow so a cut-out (or a dark-background photo) sits in the scene
   rather than floating. Sized to the image, not the column. */
.fi-hero__glow{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(88%,var(--dh));aspect-ratio:1/1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(225,29,42,.34) 0%,rgba(225,29,42,.12) 45%,transparent 70%);
  filter:blur(8px);
}
.fi-hero__shot,
.fi-hero__media picture{
  position:relative;z-index:1;
  display:block;
  width:auto;max-width:100%;
  height:auto;max-height:var(--dh);
  margin-inline:auto;
  object-fit:contain;          /* complete image, never cropped */
  border-radius:16px;          /* softens rectangular photos, no-op on cut-outs */
}
.fi-hero__shot{filter:drop-shadow(0 28px 44px rgba(0,0,0,.5));}
.fi-hero__media picture img{
  width:auto;max-width:100%;height:auto;max-height:var(--dh);
  object-fit:contain;margin-inline:auto;border-radius:16px;
}
.fi-hero__ph{
  aspect-ratio:4/3;border-radius:var(--fi-radius-lg);
  border:1px dashed rgba(255,255,255,.22);background:rgba(255,255,255,.04);
  display:grid;place-items:center;text-align:center;padding:30px;
  font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:#7E828C;
}
.fi-hero__badge{
  position:absolute;top:18px;left:18px;background:var(--fi-red);color:#fff;
  font-size:.66rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;
  padding:8px 14px;border-radius:3px;transform:rotate(-3deg);
}

/* ==========================================================================
   8. Trust strip
   ========================================================================== */
.fi-trust{background:var(--fi-ink);color:#fff;padding-block:16px;}
.fi-trust__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;text-align:center;}
.fi-trust__item{display:flex;align-items:center;justify-content:center;gap:9px;font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;}
.fi-trust__item svg{color:var(--fi-red);flex:none;}

/* ==========================================================================
   9. Problem / icon grid
   ========================================================================== */
.fi-pain{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.5vw,34px);text-align:center;}
.fi-pain__item{display:flex;flex-direction:column;align-items:center;}
.fi-pain__ico{
  width:96px;height:96px;border-radius:50%;margin-bottom:18px;
  display:grid;place-items:center;background:var(--fi-ink);color:#fff;
  box-shadow:var(--fi-shadow);transition:transform var(--fi-t);
}
.fi-pain__item:hover .fi-pain__ico{transform:translateY(-6px);}
.fi-pain h4{margin-bottom:6px;font-size:1rem;}
.fi-pain p{font-size:.88rem;color:var(--fi-muted);margin:0;}

/* ==========================================================================
   10. Split feature
   ========================================================================== */
.fi-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,70px);align-items:center;}
.fi-split--flip .fi-split__media{order:2;}
.fi-split__media img{border-radius:var(--fi-radius-lg);width:100%;}
/* A designed graphic (packaging illustration, flat colour background) must be
   shown whole at its own ratio rather than forced into a square box. */
.fi-split__media--fit{display:flex;align-items:center;justify-content:center;}
.fi-split__img{
  width:100%;height:auto;max-width:100%;
  object-fit:contain;
  border-radius:var(--fi-radius-lg);
  box-shadow:var(--fi-shadow);
}
.fi-split__ph{
  aspect-ratio:1/1;border-radius:var(--fi-radius-lg);background:var(--fi-soft);
  border:1px dashed var(--fi-line);display:grid;place-items:center;text-align:center;
  padding:26px;color:var(--fi-muted);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
}
.fi-checks{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:10px;}
.fi-checks li{
  display:flex;align-items:center;gap:12px;background:#FDF0F1;
  border:1px solid #F6D9DC;border-left:4px solid var(--fi-red);
  padding:13px 16px;border-radius:6px;
  font-weight:700;color:var(--fi-ink);font-size:.92rem;
}
.fi-checks li svg{color:var(--fi-red);flex:none;}
.fi-note{display:flex;align-items:center;gap:9px;font-size:.8rem;color:var(--fi-muted);margin-top:16px;}

/* ==========================================================================
   11. How it works
   ========================================================================== */
.fi-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3vw,40px);}
.fi-step{position:relative;text-align:center;}
.fi-step__media{position:relative;width:190px;max-width:70%;margin:0 auto 22px;}
.fi-step__circle{
  aspect-ratio:1/1;border-radius:50%;overflow:hidden;background:#1C1D22;
  border:2px solid rgba(255,255,255,.1);display:grid;place-items:center;color:var(--fi-red);
}
.fi-step__circle img{width:100%;height:100%;object-fit:cover;}
.fi-step__num{
  position:absolute;top:-8px;left:-8px;width:40px;height:40px;border-radius:50%;
  background:var(--fi-red);color:#fff;display:grid;place-items:center;
  font-family:var(--fi-display);font-size:1.1rem;border:3px solid var(--fi-black);
}
.fi-step h4{font-size:1rem;margin-bottom:10px;letter-spacing:.03em;}
.fi-step p{font-size:.87rem;color:#9A9DA6;margin:0;}
.fi-step__link{
  position:absolute;top:80px;right:-8%;width:16%;height:2px;
  background:linear-gradient(90deg,var(--fi-red),rgba(225,29,42,.15));
}
.fi-step:last-child .fi-step__link{display:none;}

/* ==========================================================================
   12. Categories
   ========================================================================== */
/* Carousel shell -------------------------------------------------------- */
.fi-carousel__head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  margin-bottom:clamp(24px,3vw,36px);
}
.fi-carousel__head p{color:var(--fi-muted);margin:0;max-width:52ch;}
.fi-carousel__head h2{margin-bottom:8px;}
.fi-carousel__nav{display:flex;gap:10px;flex:none;}
.fi-carousel__btn{
  width:48px;height:48px;border-radius:50%;flex:none;cursor:pointer;
  border:1px solid var(--fi-line);background:#fff;color:var(--fi-ink);
  display:grid;place-items:center;transition:all var(--fi-t);
}
.fi-carousel__btn:hover:not(:disabled){background:var(--fi-red);border-color:var(--fi-red);color:#fff;}
.fi-carousel__btn:disabled{opacity:.35;cursor:default;}
.fi-carousel__btn[data-dir="prev"] svg{transform:rotate(180deg);}

.fi-carousel{overflow:hidden;}
.fi-carousel__track{
  display:flex;gap:clamp(14px,1.6vw,22px);
  overflow-x:auto;scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  padding-block:6px 16px;
  scrollbar-width:none;-ms-overflow-style:none;
  cursor:grab;
}
.fi-carousel__track::-webkit-scrollbar{display:none;}
.fi-carousel__track.is-dragging{cursor:grabbing;scroll-behavior:auto;scroll-snap-type:none;}
.fi-carousel__track>*{scroll-snap-align:start;}

.fi-carousel__bar{
  height:3px;border-radius:2px;background:var(--fi-line);
  overflow:hidden;margin-top:6px;
}
.fi-carousel__thumb{
  display:block;height:100%;width:30%;border-radius:2px;
  background:var(--fi-red);transition:transform .15s linear;
}

/* Category cards -------------------------------------------------------- */
.fi-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);}
.fi-cat{
  position:relative;display:block;border-radius:22px;overflow:hidden;
  background:var(--fi-ink);aspect-ratio:4/3;box-shadow:var(--fi-shadow);
}
.fi-carousel__track .fi-cat{
  flex:0 0 clamp(250px,25%,310px);aspect-ratio:3/4;
}
.fi-cat img{
  width:100%;height:100%;object-fit:cover;opacity:.62;
  transition:transform .5s cubic-bezier(.4,0,.2,1),opacity var(--fi-t);
}
.fi-cat:hover img{transform:scale(1.07);opacity:.45;}
.fi-cat__ph{position:absolute;inset:0;background:linear-gradient(140deg,#1D1E24,#0B0B0C);}
.fi-cat__body{
  position:absolute;inset:auto 0 0 0;padding:22px;
  background:linear-gradient(to top,rgba(11,11,12,.92),transparent);
}
.fi-cat__name{
  display:block;
  font-family:var(--fi-display);font-size:1.3rem;text-transform:uppercase;
  color:#fff;line-height:1.05;margin-bottom:4px;
}
.fi-cat__count{display:block;font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--fi-red);}
.fi-cat__go{
  position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;
  background:var(--fi-red);color:#fff;display:grid;place-items:center;
  opacity:0;transform:translateY(-6px);transition:all var(--fi-t);
}
.fi-cat:hover .fi-cat__go{opacity:1;transform:translateY(0);}
.fi-cats--wide .fi-cat:first-child{grid-column:span 2;aspect-ratio:8/3;}

/* ==========================================================================
   13. Product grid (WooCommerce-aware)
   ========================================================================== */
.fi-products,
ul.products{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,26px);
}
/* WooCommerce ships a float-era clearfix (content:" ";display:table) on
   ul.products. In a grid container those pseudo-elements become grid items
   and eat the first and last cells, leaving visible gaps. */
ul.products::before,
ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after{content:none!important;display:none!important;}
ul.products li.product{margin:0;width:auto!important;float:none!important;clear:none!important;}
li.product,.fi-card{
  position:relative;background:#fff;border:1px solid var(--fi-line);
  border-radius:20px;overflow:hidden;
  transition:transform var(--fi-t),box-shadow var(--fi-t),border-color var(--fi-t);
  display:flex;flex-direction:column;
}
li.product:hover,.fi-card:hover{transform:translateY(-5px);box-shadow:var(--fi-shadow-lg);border-color:transparent;}
li.product a img,.fi-card__img{width:100%;aspect-ratio:1/1;object-fit:cover;margin:0;background:var(--fi-soft);}
li.product .woocommerce-loop-product__link{display:flex;flex-direction:column;flex:1;}
li.product .woocommerce-loop-product__title,
.fi-card__title{
  font-family:var(--fi-sans)!important;font-size:.96rem!important;font-weight:700!important;
  text-transform:none!important;color:var(--fi-ink);
  padding:16px 16px 4px!important;margin:0;line-height:1.35;
}
li.product .price,.fi-card__price{
  padding:0 16px 14px;margin:0;color:var(--fi-ink)!important;
  font-size:1.02rem!important;font-weight:800;
}
li.product .price del{color:var(--fi-muted)!important;font-weight:500;margin-right:6px;opacity:.8;}
li.product .price ins{text-decoration:none;color:var(--fi-red)!important;}
li.product .star-rating{margin:0 16px 10px!important;font-size:.7rem;color:var(--fi-red);}
li.product .button,
li.product .added_to_cart{
  margin:auto 16px 16px!important;display:block;text-align:center;
  background:var(--fi-ink)!important;color:#fff!important;
  font-size:.76rem!important;font-weight:800!important;letter-spacing:.08em;text-transform:uppercase;
  padding:12px 16px!important;border-radius:4px!important;transition:background var(--fi-t);
}
li.product .button:hover{background:var(--fi-red)!important;}
/* Buy Now is the primary action, so it carries the brand colour. */
li.product .button{background:var(--fi-red)!important;}
li.product .button:hover{background:var(--fi-red-dark)!important;}
li.product .onsale,.fi-badge{
  position:absolute;top:12px;left:12px;z-index:2;
  background:var(--fi-red);color:#fff;border-radius:3px;
  font-size:.64rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 11px;margin:0!important;min-height:0;min-width:0;line-height:1;
}
.fi-card__discreet{
  position:absolute;top:12px;right:12px;z-index:2;background:rgba(11,11,12,.78);
  color:#fff;font-size:.6rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  padding:6px 10px;border-radius:3px;backdrop-filter:blur(4px);
}
.fi-card__body{padding:16px;display:flex;flex-direction:column;flex:1;}
.fi-card__body .fi-card__title,.fi-card__body .fi-card__price{padding:0!important;}
.fi-card__body .fi-card__title{margin-bottom:6px;}
.fi-card__body .fi-card__price{margin-bottom:14px;}

/* ==========================================================================
   14. Testimonials
   ========================================================================== */
.fi-quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,30px);}
.fi-quote{
  background:#fff;border:1px solid var(--fi-line);border-radius:var(--fi-radius-lg);
  padding:28px;display:flex;flex-direction:column;box-shadow:var(--fi-shadow);
}
.fi-quote .fi-stars{margin-bottom:14px;}
.fi-quote p{font-size:.95rem;color:var(--fi-ink);flex:1;}
.fi-quote__by{display:flex;align-items:center;gap:12px;margin-top:18px;padding-top:18px;border-top:1px solid var(--fi-line);}
.fi-quote__av{
  width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--fi-ink);color:#fff;font-family:var(--fi-display);font-size:1rem;
}
.fi-quote__name{font-weight:800;color:var(--fi-ink);font-size:.9rem;line-height:1.3;}
.fi-quote__meta{font-size:.76rem;color:var(--fi-red);font-weight:700;letter-spacing:.04em;}

/* Promise variant, shown until real reviews exist. */
.fi-quote--promise{text-align:left;}
.fi-quote__ico{
  width:52px;height:52px;border-radius:14px;margin-bottom:16px;
  display:grid;place-items:center;background:var(--fi-soft);color:var(--fi-red);
}
.fi-quote__title{
  font-family:var(--fi-display);font-size:1.12rem;text-transform:uppercase;
  color:var(--fi-ink);margin-bottom:10px;letter-spacing:.01em;
}
.fi-quote--promise p{font-size:.92rem;color:var(--fi-body);}

/* ==========================================================================
   15. Wide banner
   ========================================================================== */
.fi-banner{position:relative;background:var(--fi-black);color:#fff;overflow:hidden;}
.fi-banner img.fi-banner__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.42;}
.fi-banner::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(11,11,12,.95) 0%,rgba(11,11,12,.72) 45%,transparent 78%);
}
.fi-banner__inner{position:relative;z-index:2;padding-block:clamp(64px,8vw,110px);max-width:560px;}
.fi-banner h2{color:#fff;}
.fi-banner p{color:#C2C5CC;}

/* ==========================================================================
   16. Blog
   ========================================================================== */
.fi-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,30px);}
.fi-post{
  background:#fff;border:1px solid var(--fi-line);border-radius:var(--fi-radius-lg);
  overflow:hidden;display:flex;flex-direction:column;transition:transform var(--fi-t),box-shadow var(--fi-t);
}
.fi-post:hover{transform:translateY(-5px);box-shadow:var(--fi-shadow-lg);}
.fi-post__thumb{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--fi-soft);}
.fi-post__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.fi-post:hover .fi-post__thumb img{transform:scale(1.06);}
.fi-post__body{padding:22px;display:flex;flex-direction:column;flex:1;}
.fi-post__cat{
  font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--fi-red);margin-bottom:9px;
}
.fi-post__title{font-family:var(--fi-sans);font-size:1.06rem;font-weight:800;text-transform:none;line-height:1.35;margin-bottom:10px;}
.fi-post__title a{color:var(--fi-ink);}
.fi-post__title a:hover{color:var(--fi-red);}
.fi-post__excerpt{font-size:.9rem;color:var(--fi-muted);flex:1;margin-bottom:16px;}
.fi-post__meta{font-size:.76rem;color:var(--fi-muted);display:flex;gap:14px;align-items:center;}
.fi-post__more{
  font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:7px;
}

/* ==========================================================================
   17. FAQ
   ========================================================================== */
.fi-faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,4vw,56px);align-items:start;}
.fi-faq__aside h2{margin-bottom:18px;}
.fi-faq__card{
  background:#fff;border:1px solid var(--fi-line);border-radius:var(--fi-radius-lg);
  padding:28px;text-align:center;box-shadow:var(--fi-shadow);
}
.fi-faq__card .fi-mail{
  width:64px;height:64px;border-radius:14px;background:var(--fi-soft);
  display:grid;place-items:center;margin:0 auto 16px;color:var(--fi-red);
}
.fi-faq__card h4{margin-bottom:8px;}
.fi-faq__card p{font-size:.88rem;color:var(--fi-muted);margin-bottom:16px;}
.fi-faq__tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;}
.fi-tab{
  border:1px solid var(--fi-line);background:#fff;border-radius:4px;cursor:pointer;
  font-family:var(--fi-sans);font-size:.72rem;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;color:var(--fi-ink);padding:10px 15px;transition:all var(--fi-t);
}
.fi-tab:hover{border-color:var(--fi-red);color:var(--fi-red);}
.fi-tab.is-active{background:var(--fi-red);border-color:var(--fi-red);color:#fff;}
.fi-acc{display:grid;gap:10px;}
.fi-acc[hidden]{display:none;}
.fi-acc__item{background:#fff;border:1px solid var(--fi-line);border-radius:var(--fi-radius);overflow:hidden;transition:border-color var(--fi-t);}
.fi-acc__item.is-open{border-color:var(--fi-red);}
.fi-acc__q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;
  background:none;border:0;cursor:pointer;text-align:left;padding:17px 20px;
  font-family:var(--fi-sans);font-size:.94rem;font-weight:700;color:var(--fi-ink);
}
.fi-acc__q:hover{color:var(--fi-red);}
.fi-acc__sign{
  width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--fi-ink);color:#fff;font-size:1rem;line-height:1;
  transition:transform var(--fi-t),background var(--fi-t);
}
.fi-acc__item.is-open .fi-acc__sign{background:var(--fi-red);transform:rotate(45deg);}
.fi-acc__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease;}
.fi-acc__item.is-open .fi-acc__a{grid-template-rows:1fr;}
.fi-acc__a>div{overflow:hidden;}
.fi-acc__a p{padding:0 20px 18px;margin:0;font-size:.91rem;color:var(--fi-body);}

/* ==========================================================================
   18. Final CTA
   ========================================================================== */
.fi-cta{background:var(--fi-red);color:#fff;position:relative;overflow:hidden;}
.fi-cta::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(600px 400px at 85% 50%,rgba(255,255,255,.16),transparent 70%);
}
.fi-cta__grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-block:clamp(48px,6vw,80px);}
.fi-cta h2{color:#fff;}
.fi-cta p{color:rgba(255,255,255,.9);max-width:46ch;}
.fi-cta .fi-btn--primary{background:#fff;color:var(--fi-red);}
.fi-cta .fi-btn--primary:hover{background:var(--fi-black);color:#fff;box-shadow:none;}
.fi-cta__media img{filter:drop-shadow(0 22px 44px rgba(0,0,0,.3));}
.fi-cta__ph{aspect-ratio:16/9;border:1px dashed rgba(255,255,255,.4);border-radius:var(--fi-radius-lg);display:grid;place-items:center;color:rgba(255,255,255,.85);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:20px;}

/* newsletter */
.fi-sub{display:flex;gap:10px;flex-wrap:wrap;max-width:430px;}
.fi-sub input[type="email"]{flex:1;min-width:190px;}
.fi-sub-wrap{max-width:460px;}
.fi-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden;}
.fi-sub__msg{
  display:flex;align-items:center;gap:9px;
  font-size:.86rem;font-weight:700;border-radius:8px;padding:12px 15px;margin:0;
}
.fi-sub__msg--ok{background:rgba(255,255,255,.16);color:#fff;}
.fi-sub__msg--err{background:rgba(11,11,12,.35);color:#fff;margin-bottom:10px;}
.fi-sub__msg svg{flex:none;}

/* --- "Landing soon" panel (audience section with no stock yet) ---------- */
.fi-soon{
  max-width:620px;margin:0 auto;text-align:center;
  background:#fff;border:1px solid var(--fi-line);border-radius:var(--fi-radius-lg);
  padding:clamp(30px,4vw,46px);box-shadow:var(--fi-shadow);
}
.fi-soon__ico{
  width:64px;height:64px;border-radius:18px;margin:0 auto 18px;
  display:grid;place-items:center;
  background:var(--fi-soft);color:var(--fi-red);
}
.fi-soon h3{margin-bottom:12px;}
.fi-soon p{font-size:.95rem;color:var(--fi-body);margin-bottom:24px;}

/* --- Assurance strip ---------------------------------------------------- */
.fi-assurance{background:var(--fi-ink);color:#fff;padding-block:clamp(26px,3.4vw,38px);}
.fi-assurance__grid{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px);
}
.fi-assurance__grid li{display:flex;align-items:flex-start;gap:13px;}
.fi-assurance__ico{
  width:42px;height:42px;border-radius:11px;flex:none;
  display:grid;place-items:center;
  background:rgba(225,29,42,.16);color:var(--fi-red);
}
.fi-assurance__body{display:flex;flex-direction:column;gap:3px;min-width:0;}
.fi-assurance__body strong{font-size:.88rem;font-weight:800;color:#fff;line-height:1.3;}
.fi-assurance__body span{font-size:.8rem;color:#9DA1AA;line-height:1.45;}

/* ==========================================================================
   19. Footer
   ========================================================================== */
.fi-footer{background:var(--fi-black);color:#9FA3AC;padding-top:clamp(48px,6vw,72px);font-size:.9rem;}
.fi-footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(24px,3vw,44px);padding-bottom:42px;}
.fi-footer h5{
  font-family:var(--fi-sans);font-size:.74rem;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;margin-bottom:18px;
}
.fi-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:11px;}
.fi-footer a{color:#9FA3AC;}
.fi-footer a:hover{color:#fff;}
.fi-footer .fi-brand__name{color:#fff;}
.fi-footer .fi-brand__mark{background:#fff;color:var(--fi-black);}
.fi-footer__about{max-width:34ch;margin:18px 0;font-size:.88rem;line-height:1.7;}
.fi-contact{display:grid;gap:10px;margin-top:6px;}
.fi-contact a,.fi-contact span{display:flex;align-items:center;gap:10px;font-size:.9rem;}
.fi-contact svg{color:var(--fi-red);flex:none;}
.fi-social{display:flex;gap:9px;margin-top:20px;}
.fi-social a{
  width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.08);color:#fff;transition:all var(--fi-t);
}
.fi-social a:hover{background:var(--fi-red);transform:translateY(-3px);}
.fi-footer__bar{
  border-top:1px solid rgba(255,255,255,.1);padding-block:20px;
  display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;
  font-size:.8rem;
}
.fi-footer__bar ul{display:flex;flex-wrap:wrap;gap:18px;}
.fi-age{
  display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.18);
  border-radius:4px;padding:6px 11px;font-size:.72rem;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;color:#fff;
}
.fi-age b{color:var(--fi-red);}

/* ==========================================================================
   20. Floating WhatsApp
   ========================================================================== */
.fi-wa{
  position:fixed;right:20px;bottom:20px;z-index:80;
  width:58px;height:58px;border-radius:50%;
  display:grid;place-items:center;background:#25D366;color:#fff;
  box-shadow:0 10px 26px rgba(37,211,102,.45);
  animation:fi-float 3s ease-in-out infinite;
  transition:transform var(--fi-t),box-shadow var(--fi-t);
}
.fi-wa:hover{color:#fff;transform:scale(1.09);box-shadow:0 14px 34px rgba(37,211,102,.6);}
.fi-wa::before{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:#25D366;opacity:.55;animation:fi-pulse 2.2s ease-out infinite;z-index:-1;
}
.fi-wa__tip{
  position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(8px);
  background:var(--fi-ink);color:#fff;white-space:nowrap;font-size:.76rem;font-weight:700;
  padding:9px 13px;border-radius:6px;opacity:0;visibility:hidden;transition:all var(--fi-t);
  box-shadow:var(--fi-shadow);
}
.fi-wa__tip::after{
  content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);
  border:6px solid transparent;border-left-color:var(--fi-ink);
}
.fi-wa:hover .fi-wa__tip{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0);}
@keyframes fi-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}
@keyframes fi-pulse{0%{transform:scale(1);opacity:.55;}70%{transform:scale(1.75);opacity:0;}100%{transform:scale(1.75);opacity:0;}}
.fi-totop{
  position:fixed;right:22px;bottom:90px;z-index:79;width:42px;height:42px;border-radius:50%;
  border:0;cursor:pointer;background:var(--fi-ink);color:#fff;display:grid;place-items:center;
  opacity:0;visibility:hidden;transform:translateY(10px);transition:all var(--fi-t);
}
.fi-totop.is-on{opacity:1;visibility:visible;transform:translateY(0);}
.fi-totop:hover{background:var(--fi-red);}

/* ==========================================================================
   21. Age gate
   ========================================================================== */
.fi-gate{
  position:fixed;inset:0;z-index:120;display:none;place-items:center;padding:20px;
  background:rgba(11,11,12,.93);backdrop-filter:blur(6px);
}
.fi-gate.is-on{display:grid;}
.fi-gate__box{
  background:#fff;border-radius:var(--fi-radius-lg);max-width:460px;width:100%;
  padding:clamp(28px,4vw,42px);text-align:center;box-shadow:var(--fi-shadow-lg);
}
.fi-gate__box h3{margin-bottom:10px;}
.fi-gate__box p{font-size:.9rem;color:var(--fi-muted);}
.fi-gate__row{display:flex;gap:10px;justify-content:center;margin-top:22px;flex-wrap:wrap;}
.fi-gate__fine{font-size:.74rem;color:var(--fi-muted);margin-top:18px;margin-bottom:0;}

/* ==========================================================================
   22. Forms
   ========================================================================== */
input[type="text"],input[type="email"],input[type="url"],input[type="password"],
input[type="search"],input[type="number"],input[type="tel"],input[type="date"],
textarea,select{
  width:100%;padding:13px 15px;border:1px solid var(--fi-line);border-radius:6px;
  font-family:inherit;font-size:.94rem;color:var(--fi-ink);background:#fff;
  transition:border-color var(--fi-t),box-shadow var(--fi-t);
}
input:focus,textarea:focus,select:focus{
  outline:0;border-color:var(--fi-red);box-shadow:0 0 0 3px rgba(225,29,42,.13);
}
label{display:block;font-size:.84rem;font-weight:700;color:var(--fi-ink);margin-bottom:6px;}
input[type="submit"],button[type="submit"],.wp-block-button__link{
  width:auto;background:var(--fi-red);color:#fff;border:0;border-radius:4px;cursor:pointer;
  font-size:.82rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  padding:15px 28px;transition:background var(--fi-t);
}
input[type="submit"]:hover,button[type="submit"]:hover{background:var(--fi-red-dark);}

/* ==========================================================================
   23. Blog archive / single
   ========================================================================== */
.fi-page-head{background:var(--fi-ink);color:#fff;padding-block:clamp(44px,5vw,72px);text-align:center;}
.fi-page-head h1{color:#fff;margin-bottom:10px;}
.fi-page-head p{color:#A6A9B2;margin:0;}
.fi-crumbs{font-size:.78rem;color:#8A8E99;margin-bottom:14px;}
.fi-crumbs a{color:#C9CBD2;}
.fi-crumbs a:hover{color:var(--fi-red);}
.fi-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(28px,4vw,52px);align-items:start;}
.fi-layout--full{grid-template-columns:minmax(0,1fr);}
.fi-entry{max-width:100%;}
.fi-entry__thumb img{width:100%;border-radius:var(--fi-radius-lg);margin-bottom:26px;}
.fi-entry__content{font-size:1.02rem;color:var(--fi-ink);}
.fi-entry__content h2,.fi-entry__content h3{margin-top:1.6em;}
.fi-entry__content img{border-radius:var(--fi-radius);}
.fi-entry__meta{display:flex;flex-wrap:wrap;gap:16px;font-size:.82rem;color:var(--fi-muted);margin-bottom:22px;}
.fi-tags{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0;}
.fi-tags a{
  background:var(--fi-soft);color:var(--fi-ink);border-radius:4px;padding:7px 13px;
  font-size:.76rem;font-weight:700;letter-spacing:.04em;
}
.fi-tags a:hover{background:var(--fi-red);color:#fff;}
.fi-sidebar .widget{
  background:#fff;border:1px solid var(--fi-line);border-radius:var(--fi-radius-lg);
  padding:24px;margin-bottom:22px;
}
.fi-sidebar .widget-title,.fi-sidebar .wp-block-heading{font-size:1rem;margin-bottom:16px;font-family:var(--fi-display);text-transform:uppercase;}
.fi-sidebar ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;}
.fi-sidebar li a{color:var(--fi-body);font-size:.92rem;}
.fi-sidebar li a:hover{color:var(--fi-red);}
.fi-pager{display:flex;justify-content:center;gap:8px;margin-top:44px;flex-wrap:wrap;}
.fi-pager .page-numbers{
  min-width:42px;height:42px;padding:0 12px;border-radius:6px;border:1px solid var(--fi-line);
  display:grid;place-items:center;color:var(--fi-ink);font-weight:700;font-size:.88rem;background:#fff;
}
.fi-pager .page-numbers:hover,.fi-pager .page-numbers.current{background:var(--fi-red);border-color:var(--fi-red);color:#fff;}
.fi-nav-links{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:40px;}
.fi-nav-links a{
  display:block;padding:20px;border:1px solid var(--fi-line);border-radius:var(--fi-radius);
  color:var(--fi-ink);font-weight:700;font-size:.94rem;background:#fff;
}
.fi-nav-links a:hover{border-color:var(--fi-red);color:var(--fi-red);}
.fi-nav-links small{display:block;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fi-red);margin-bottom:6px;font-weight:800;}

/* comments */
.fi-comments{margin-top:52px;}
.fi-comments ol{list-style:none;padding:0;}
.fi-comments .comment-body{background:#fff;border:1px solid var(--fi-line);border-radius:var(--fi-radius);padding:20px;margin-bottom:16px;}
.fi-comments .comment-author img{border-radius:50%;float:left;margin-right:12px;}

/* ==========================================================================
   24. WooCommerce overrides
   ========================================================================== */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  border-top-color:var(--fi-red)!important;background:var(--fi-soft);border-radius:6px;
}
.woocommerce-message::before,.woocommerce-info::before{color:var(--fi-red)!important;}
.woocommerce span.onsale{background:var(--fi-red);}
.woocommerce div.product .product_title{font-family:var(--fi-display);text-transform:uppercase;}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--fi-ink);font-weight:800;}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{border-bottom-color:#fff;}
.woocommerce #respond input#submit,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit.alt,.woocommerce a.button.alt,
.woocommerce button.button.alt,.woocommerce input.button.alt{
  background:var(--fi-red);color:#fff;border-radius:4px;
  font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:14px 26px;
}
.woocommerce #respond input#submit:hover,.woocommerce a.button:hover,
.woocommerce button.button:hover,.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover{background:var(--fi-red-dark);color:#fff;}
.woocommerce .quantity .qty{width:72px;padding:11px;text-align:center;}

/* Quantity stepper ------------------------------------------------------- */
.fi-qty{
  display:inline-flex;align-items:stretch;vertical-align:middle;
  border:1px solid var(--fi-line);border-radius:8px;overflow:hidden;
  background:#fff;margin-right:12px;
}
.fi-qty__btn{
  width:42px;flex:none;border:0;background:#fff;cursor:pointer;
  font-size:1.15rem;line-height:1;color:var(--fi-ink);
  display:grid;place-items:center;transition:background var(--fi-t),color var(--fi-t);
}
.fi-qty__btn:hover{background:var(--fi-red);color:#fff;}
.fi-qty .quantity{margin:0!important;display:flex;}
.fi-qty .quantity .qty{
  width:54px;border:0!important;border-left:1px solid var(--fi-line)!important;
  border-right:1px solid var(--fi-line)!important;border-radius:0!important;
  text-align:center;font-weight:700;padding:11px 4px;
  -moz-appearance:textfield;appearance:textfield;
}
.fi-qty .quantity .qty::-webkit-outer-spin-button,
.fi-qty .quantity .qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.fi-qty .quantity .qty:focus{box-shadow:none!important;}
.woocommerce div.product form.cart{display:flex;flex-wrap:wrap;align-items:center;gap:12px;}
.woocommerce div.product form.cart .button{margin:0;}

/* Compact reassurance strip --------------------------------------------- */
.fi-assure{
  list-style:none;margin:26px 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:10px;
}
.fi-assure li{
  display:flex;align-items:center;gap:8px;
  background:var(--fi-soft);border:1px solid var(--fi-line);border-radius:999px;
  padding:9px 15px;font-size:.8rem;font-weight:700;color:var(--fi-ink);white-space:nowrap;
}
.fi-assure svg{color:var(--fi-red);flex:none;}
.woocommerce-breadcrumb{font-size:.82rem;color:var(--fi-muted);margin-bottom:22px!important;}
.woocommerce-breadcrumb a{color:var(--fi-body);}
.woocommerce ul.products li.product .woocommerce-loop-category__title{padding:16px!important;}
.woocommerce nav.woocommerce-pagination ul{border:0;gap:8px;display:flex;}
.woocommerce nav.woocommerce-pagination ul li{border:0;}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  border:1px solid var(--fi-line);border-radius:6px;min-width:42px;height:42px;
  display:grid;place-items:center;font-weight:700;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover{background:var(--fi-red);color:#fff;border-color:var(--fi-red);}
.woocommerce-result-count,.woocommerce-ordering{margin-bottom:24px!important;}
/* --- Shop filter sidebar ------------------------------------------------ */
.fi-layout--shop{grid-template-columns:262px minmax(0,1fr);}
.fi-layout--shop.fi-layout--full{grid-template-columns:minmax(0,1fr);}

.fi-filters{align-self:start;position:sticky;top:96px;}
.fi-filters__head{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-bottom:12px;margin-bottom:6px;border-bottom:2px solid var(--fi-ink);
}
.fi-filters__head h3{font-size:1.05rem;margin:0;}
.fi-filters__clear{
  font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--fi-red);
}
.fi-filters__group{padding-block:18px;border-bottom:1px solid var(--fi-line);}
.fi-filters__group h4{
  font-family:var(--fi-sans);font-size:.72rem;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--fi-muted);margin-bottom:12px;
}
.fi-filters__group ul{list-style:none;margin:0;padding:0;display:grid;gap:2px;}
.fi-filters__group a{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 10px;border-radius:8px;
  font-size:.9rem;font-weight:600;color:var(--fi-body);
  transition:background var(--fi-t),color var(--fi-t);
}
.fi-filters__group a:hover{background:var(--fi-soft);color:var(--fi-ink);}
.fi-filters__group em{
  font-style:normal;font-size:.72rem;font-weight:800;color:var(--fi-muted);
  background:var(--fi-soft);border-radius:20px;padding:2px 8px;min-width:26px;text-align:center;
}
.fi-filters__group .is-on>a{background:var(--fi-ink);color:#fff;}
.fi-filters__group .is-on em{background:rgba(255,255,255,.18);color:#fff;}

.fi-filters__help{
  margin-top:20px;padding:18px;border-radius:var(--fi-radius-lg);
  background:var(--fi-soft);font-size:.85rem;color:var(--fi-body);
  display:grid;gap:10px;justify-items:start;
}
.fi-filters__help svg{color:var(--fi-red);}

/* Mobile: collapse the filters behind a toggle. */
.fi-filters__toggle{
  display:none;align-items:center;gap:10px;width:100%;
  border:1px solid var(--fi-line);background:#fff;border-radius:10px;cursor:pointer;
  padding:14px 16px;margin-bottom:18px;
  font-family:var(--fi-sans);font-size:.8rem;font-weight:800;
  letter-spacing:.08em;text-transform:uppercase;color:var(--fi-ink);
}
.fi-filters__toggle svg{color:var(--fi-red);}

/* No archive H1 anywhere, so an empty header must not leave a gap. The term
   description still renders inside it when a category has one. */
.woocommerce-products-header:empty{display:none;}
.woocommerce-products-header{margin:0 0 18px;}
.woocommerce-products-header .term-description p:last-child{margin-bottom:0;}

/* --- WooCommerce Cart & Checkout blocks -----------------------------------
   The block cart/checkout render their own markup, so they need explicit
   theme tokens to match the rest of the site. */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout{max-width:100%;}
.wc-block-components-title,
.wc-block-cart__totals-title,
.wc-block-components-checkout-step__title{
  font-family:var(--fi-display)!important;text-transform:uppercase;color:var(--fi-ink)!important;
  letter-spacing:.01em;
}
.wc-block-components-button:not(.is-link){
  background:var(--fi-red)!important;color:#fff!important;border:0!important;border-radius:4px!important;
  font-family:var(--fi-sans);font-size:.82rem!important;font-weight:800!important;
  letter-spacing:.09em;text-transform:uppercase;padding:15px 28px!important;
  transition:background var(--fi-t);
}
.wc-block-components-button:not(.is-link):hover{background:var(--fi-red-dark)!important;}
.wc-block-components-button.is-link{color:var(--fi-red)!important;}
.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-block-components-select__container select,
.wc-block-components-combobox-control input{
  border:1px solid var(--fi-line)!important;border-radius:6px!important;
  font-family:inherit!important;color:var(--fi-ink)!important;
}
.wc-block-components-text-input.is-active input:focus,
.wc-block-components-text-input input:focus{
  outline:0!important;border-color:var(--fi-red)!important;
  box-shadow:0 0 0 3px rgba(225,29,42,.13)!important;
}
.wc-block-cart-items__header{
  font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--fi-muted);
}
.wc-block-components-product-name{
  font-weight:700!important;color:var(--fi-ink)!important;font-size:.98rem;
}
.wc-block-components-product-name:hover{color:var(--fi-red)!important;}
.wc-block-cart__totals-title,
.wc-block-components-totals-item__label{font-weight:700;color:var(--fi-ink);}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{
  color:var(--fi-red)!important;font-weight:800;
}
.wc-block-cart .wc-block-cart__sidebar .wc-block-components-sidebar,
.wc-block-checkout__sidebar .wc-block-components-sidebar{
  background:var(--fi-soft);border:1px solid var(--fi-line);
  border-radius:var(--fi-radius-lg);padding:22px;
}
.wc-block-components-notice-banner{border-radius:6px;}
.wc-block-components-notice-banner.is-success{border-color:var(--fi-red);}
.wc-block-components-checkout-place-order-button{width:100%;justify-content:center;}
.wc-block-components-quantity-selector{border-radius:6px;}
.wc-block-components-chip{background:var(--fi-soft);}

/* ==========================================================================
   25. Responsive
   ========================================================================== */
@media (max-width:1024px){
  .fi-pain,.fi-cats,.fi-products,ul.products,.fi-footer__grid{grid-template-columns:repeat(2,1fr);}
  .fi-quotes,.fi-posts,.fi-steps{grid-template-columns:repeat(2,1fr);}
  .fi-steps .fi-step__link{display:none;}
  .fi-hero__grid,.fi-split,.fi-faq,.fi-cta__grid,.fi-layout{grid-template-columns:1fr;}
  .fi-split--flip .fi-split__media{order:0;}
  .fi-trust__grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .fi-cats--wide .fi-cat:first-child{grid-column:span 2;aspect-ratio:16/7;}
  .fi-nav{display:none;}
  .fi-burger{display:grid;}
  .fi-shop-usp{grid-template-columns:repeat(2,1fr);}
  .fi-carousel__head{flex-direction:column;align-items:flex-start;gap:18px;}
  .fi-carousel__track .fi-cat{flex:0 0 min(62%,280px);}

  .fi-hero__media{--dh:min(46vh,430px);margin-top:8px;}
  .fi-hero__grid{gap:32px;}

  /* Filters collapse behind a toggle and sit above the grid. */
  .fi-layout--shop{grid-template-columns:1fr;gap:0;}
  .fi-filters__toggle{display:flex;}
  .fi-filters{position:static;display:none;margin-bottom:0;}
  .fi-filters.is-open{
    display:block;margin-bottom:26px;
    padding:18px;border:1px solid var(--fi-line);border-radius:var(--fi-radius-lg);
  }
  .fi-filters__head{border-bottom-width:1px;}
  .fi-filters__group ul{grid-template-columns:repeat(2,1fr);gap:6px;}
  .fi-assurance__grid{grid-template-columns:repeat(2,1fr);}

  /* Tablet: the full image is wider relative to the viewport, so the copy sits
     over its left edge. Narrower copy + a deeper scrim keeps that readable. */
  /* A shorter hero makes the contained image narrower (height drives width at
     this ratio), which buys the copy clear space beside it. */
  .fi-hero--photo{min-height:min(62vh,560px);}
  .fi-hero--photo .fi-hero__bg{object-position:right center;}
  .fi-hero--photo::after{
    background:linear-gradient(98deg,
      rgba(11,11,12,.97) 0%,
      rgba(11,11,12,.93) 30%,
      rgba(11,11,12,.66) 48%,
      rgba(11,11,12,.18) 70%,
      transparent 88%);
  }
  .fi-hero__grid--solo .fi-hero__copy{max-width:390px;}
  .fi-hero--photo .fi-hero__points{grid-template-columns:1fr;gap:9px;}
  .fi-hero--photo .fi-hero__lead{font-size:.96rem;}
}
@media (max-width:640px){
  :root{--fi-gutter:16px;}
  .fi-header__inner{min-height:66px;gap:10px;}
  .fi-brand__mark{width:38px;height:38px;font-size:1rem;}
  .fi-brand__name{font-size:1.15rem;}
  .fi-brand__by{font-size:.58rem;}
  .fi-tool{width:38px;height:38px;}
  .fi-pain,.fi-cats,.fi-quotes,.fi-posts,.fi-steps,.fi-footer__grid,.fi-shop-usp,.fi-nav-links{grid-template-columns:1fr;}
  .fi-products,ul.products{grid-template-columns:repeat(2,1fr);gap:12px;}
  li.product .woocommerce-loop-product__title{font-size:.86rem!important;padding:12px 12px 4px!important;}
  li.product .price{padding:0 12px 10px;font-size:.92rem!important;}
  li.product .button{margin:auto 12px 12px!important;font-size:.7rem!important;padding:10px!important;}
  .fi-cats--wide .fi-cat:first-child{grid-column:span 1;aspect-ratio:4/3;}
  .fi-carousel__track .fi-cat{flex:0 0 78%;}
  .fi-carousel__nav{display:none;}
  .fi-hero__points{grid-template-columns:1fr;}

  .fi-hero__media{--dh:clamp(240px,62vw,340px);margin-top:4px;}
  .fi-hero__badge{top:10px;left:10px;font-size:.6rem;padding:6px 11px;}
  .fi-filters__group ul{grid-template-columns:1fr;}
  .fi-assurance__grid{grid-template-columns:1fr;gap:16px;}

  /* Phone: the full image sits at the top at 100% width, so its height is
     100vw * aspect-ratio. Reserving exactly that as top padding drops the copy
     cleanly BELOW the picture instead of letting it ride over the subject.
     --fi-hero-ar is printed inline per image, so this holds for any upload. */
  .fi-hero--photo{
    --fi-img-w:min(78vw,300px);
    --fi-hero-h:calc(var(--fi-img-w) * var(--fi-hero-ar,1.08));
    min-height:0;
    align-items:flex-start;
    padding-top:calc(var(--fi-hero-h) - 22px);
    padding-bottom:clamp(26px,7vw,38px);
  }
  /* Centre the picture at a slightly reduced width so the headline and the
     primary CTA still land on the first screen. */
  .fi-hero--photo .fi-hero__bg{
    width:var(--fi-img-w);height:auto;
    top:0;bottom:auto;left:50%;right:auto;
    transform:translateX(-50%);
    object-fit:contain;object-position:center top;
  }
  .fi-hero--photo .fi-hero__kicker{margin-bottom:14px;}
  .fi-hero--photo h1{margin-bottom:16px;}
  .fi-hero--photo .fi-hero__lead{margin-bottom:24px;font-size:.98rem;}
  .fi-hero__cta .fi-btn{padding:15px 24px;}
  /* Transparent across the picture, solid where the text begins. */
  .fi-hero--photo::after{
    background:linear-gradient(to bottom,
      transparent 0,
      transparent calc(var(--fi-hero-h) - 120px),
      rgba(11,11,12,.72) calc(var(--fi-hero-h) - 44px),
      rgba(11,11,12,.97) calc(var(--fi-hero-h) - 4px),
      var(--fi-black) 100%);
  }
  .fi-hero--photo .fi-hero__stars{margin-bottom:12px;}
  .fi-hero--photo .fi-hero__lead{margin-bottom:22px;}
  .fi-btn{padding:13px 22px;font-size:.76rem;}
  .fi-hero__cta .fi-btn{flex:1;justify-content:center;}
  .fi-footer__bar{flex-direction:column;align-items:flex-start;}
  .fi-wa{width:52px;height:52px;right:16px;bottom:16px;}
  .fi-totop{right:18px;bottom:78px;}
  .fi-announce{font-size:.7rem;}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
  html{scroll-behavior:auto;}
}

/* reveal on scroll — only hidden when JS is running, so content never
   disappears if scripts fail to load */
.fi-js .fi-reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease;}
.fi-js .fi-reveal.is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  .fi-js .fi-reveal{opacity:1;transform:none;}
}