@charset "UTF-8";

/* Fonts — self-hosted (GDPR-safe, no external dependency). latin subset. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/twiza/inter-300-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/twiza/inter-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/twiza/inter-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/twiza/inter-600-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/twiza/inter-700-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/twiza/playfairdisplay-400-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/twiza/playfairdisplay-500-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/twiza/playfairdisplay-600-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/twiza/playfairdisplay-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/twiza/playfairdisplay-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/twiza/playfairdisplay-600-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/twiza/playfairdisplay-700-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 font-display:swap; }

/* ============================================================
   TWIZA — Clair  ·  PrestaShop 8 child theme (parent: classic)
   Homepage design system. Component styles scoped under .twiza-home
   so inner pages keep the classic styling untouched.
   ============================================================ */


:root{
  /* palette */
  --orange:#F0901C;
  --orange-deep:#D9790F;
  --orange-soft:#FDEFD8;
  --orange-tint:#FFF8EE;
  --green:#4C8A56;
  --green-deep:#3C7146;
  --green-soft:#E8F1E8;
  --cream:#FBF7F0;
  --cream-2:#F5ECDD;
  --white:#FFFFFF;
  --ink:#2B251E;
  --muted:#7C7167;
  --line:#ECE2D2;
  --line-2:#F2EADC;

  --accent:#F0901C;
  --accent-deep:#D9790F;
  --accent-soft:#FDEFD8;

  --font-head:'Playfair Display', Georgia, serif;
  --font-body:'Inter', system-ui, sans-serif;

  --maxw:1400px;
  --content:1240px;
  --gutter:clamp(20px, 4vw, 56px);
  --section-y:clamp(72px, 8vw, 120px);
  --radius:18px;
  --radius-sm:12px;
  --radius-lg:26px;

  --shadow-sm:0 2px 10px rgba(43,37,30,.05);
  --shadow:0 14px 36px -18px rgba(43,37,30,.18);
  --shadow-lift:0 24px 50px -24px rgba(43,37,30,.26);
  --ease:cubic-bezier(.4,.16,.18,1);

  --khatem:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23F0901C' stroke-width='1.1'%3E%3Crect x='20' y='20' width='24' height='24' rx='2'/%3E%3Crect x='20' y='20' width='24' height='24' rx='2' transform='rotate(45 32 32)'/%3E%3C/g%3E%3C/svg%3E");
}

/* ============================================================
   HOMEPAGE WRAPPER
   ============================================================ */
.twiza-home{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  font-size:17px; line-height:1.7; font-weight:400;
  -webkit-font-smoothing:antialiased;
}
.twiza-home img{ display:block; max-width:100%; }
.twiza-home a{ color:inherit; text-decoration:none; }
.twiza-home button{ font-family:inherit; cursor:pointer; }
.twiza-home h1,.twiza-home h2,.twiza-home h3,.twiza-home h4{
  font-family:var(--font-head); font-weight:600; margin:0; line-height:1.1; letter-spacing:-.01em;
}
.twiza-home p{ margin:0; text-wrap:pretty; }

/* Full-bleed: let sections span edge-to-edge even inside a constrained layout
   container. Canonical scrollbar-safe technique (no width:100vw). */
.twiza-home .section,
.twiza-home .hero{
  position:relative;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}

/* ---- helpers ---- */
.twiza-home .wrap{ width:min(var(--content), 100% - var(--gutter)*2); margin-inline:auto; }
.twiza-home .wrap-wide{ width:min(var(--maxw), 100% - var(--gutter)*2); margin-inline:auto; }
.twiza-home .section{ padding-block:var(--section-y); }
.twiza-home .bg-cream{ background:var(--cream); }
.twiza-home .bg-white{ background:var(--white); }

.twiza-home .eyebrow{
  font-family:var(--font-body);
  font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--accent-deep);
  display:inline-flex; align-items:center; gap:10px;
}
.twiza-home .eyebrow::before{ content:""; width:22px; height:2px; border-radius:2px; background:var(--accent); }
.twiza-home .eyebrow.center{ justify-content:center; }
.twiza-home .eyebrow.center::after{ content:""; width:22px; height:2px; border-radius:2px; background:var(--accent); }

.twiza-home .section-head{ max-width:680px; }
.twiza-home .section-head.center{ margin-inline:auto; text-align:center; }
.twiza-home .section-head h2{ font-size:clamp(28px,3.3vw,44px); margin-top:16px; }
.twiza-home .section-head p{ color:var(--muted); margin-top:16px; font-size:18px; }

.twiza-home .tlink{
  display:inline-flex; align-items:center; gap:9px;
  font-weight:600; font-size:14.5px; color:var(--accent-deep);
  transition:gap .3s var(--ease);
}
/* inline "→" arrows: SVG carries no width/height attrs → must be sized in CSS
   (without this they fall back to the 300×150 default and balloon). */
.twiza-home .arr{ width:18px; height:18px; flex:none; }
.twiza-home .tlink .arr{ transition:transform .35s var(--ease); }
.twiza-home .tlink:hover{ gap:13px; }
.twiza-home .tlink:hover .arr{ transform:translateX(4px); }

/* ---- buttons ---- */
.twiza-home .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:15px 28px; font-size:14.5px; font-weight:600; letter-spacing:.01em;
  border:1.5px solid transparent; border-radius:100px;
  transition:background .25s var(--ease), color .25s, border-color .25s, transform .2s, box-shadow .25s;
}
.twiza-home .btn:active{ transform:translateY(1px); }
.twiza-home .btn--solid{ background:var(--accent); color:#fff; box-shadow:0 10px 22px -12px var(--accent); }
.twiza-home .btn--solid:hover{ background:var(--accent-deep); box-shadow:0 14px 26px -12px var(--accent); }
.twiza-home .btn--green{ background:var(--green); color:#fff; }
.twiza-home .btn--green:hover{ background:var(--green-deep); }
.twiza-home .btn--ghost{ background:#fff; color:var(--ink); border-color:var(--line); }
.twiza-home .btn--ghost:hover{ border-color:var(--accent); color:var(--accent-deep); }

/* ============================================================
   1 · HERO
   ============================================================ */
.twiza-home .hero{ padding-top:0; background:var(--cream); overflow:hidden; }
.twiza-home .hero__grid{
  width:min(var(--maxw), 100% - var(--gutter)*2); margin-inline:auto;
  display:grid; grid-template-columns:1fr 1.04fr; align-items:stretch; gap:0;
  min-height:clamp(540px, 76vh, 720px);
}
.twiza-home .hero__text{ display:flex; flex-direction:column; justify-content:center; padding:clamp(32px,5vw,72px) clamp(28px,4vw,64px) clamp(32px,5vw,72px) 0; position:relative; z-index:2; }
.twiza-home .hero__text h1{ font-size:clamp(36px,4.6vw,62px); line-height:1.05; margin:22px 0 0; letter-spacing:-.02em; text-wrap:balance; }
.twiza-home .hero__text h1 em{ font-style:italic; color:var(--accent-deep); }
.twiza-home .hero__sub{ margin:24px 0 0; font-size:18.5px; color:var(--muted); max-width:520px; }
.twiza-home .hero__cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.twiza-home .hero__trust{ display:flex; align-items:center; gap:22px; margin-top:38px; flex-wrap:wrap; }
.twiza-home .hero__trust .t{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:var(--muted); }
.twiza-home .hero__trust .t b{ font-family:var(--font-head); font-size:22px; color:var(--ink); font-weight:600; }
.twiza-home .hero__trust .sep{ width:1px; height:28px; background:var(--line); }
.twiza-home .hero__media{ position:relative; }
.twiza-home .hero__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.twiza-home .hero__media::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, var(--cream) 0%, rgba(251,247,240,.35) 16%, rgba(251,247,240,0) 42%);
}
.twiza-home .hero__badge{
  position:absolute; z-index:2; left:-34px; bottom:40px;
  background:#fff; border-radius:var(--radius); box-shadow:var(--shadow);
  padding:16px 20px; display:flex; align-items:center; gap:14px; max-width:280px;
}
.twiza-home .hero__badge .dot{ width:44px; height:44px; border-radius:12px; background:var(--green-soft); color:var(--green-deep); display:flex; align-items:center; justify-content:center; flex:none; }
.twiza-home .hero__badge .dot svg{ width:24px; height:24px; }
.twiza-home .hero__badge .l{ font-size:13px; line-height:1.4; color:var(--muted); }
.twiza-home .hero__badge .l b{ display:block; font-family:var(--font-head); font-size:16px; color:var(--ink); font-weight:600; }
/* hero slider (3 crossfading photos) */
.twiza-home .hero__slider{ position:absolute; inset:0; z-index:0; }
.twiza-home .hero__slide{ opacity:0; transition:opacity 1.1s var(--ease); will-change:opacity; }
.twiza-home .hero__slide.is-active{ opacity:1; }
.twiza-home .hero__dots{ position:absolute; z-index:3; right:22px; bottom:22px; display:flex; gap:9px; }
.twiza-home .hero__dot{ width:9px; height:9px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.55); box-shadow:0 1px 3px rgba(0,0,0,.25); cursor:pointer; transition:background .25s, transform .25s; }
.twiza-home .hero__dot:hover{ background:rgba(255,255,255,.85); }
.twiza-home .hero__dot.is-active{ background:#fff; transform:scale(1.3); }

/* ============================================================
   2 · MODEL / PROCESS
   ============================================================ */
.twiza-home .model__grid{ display:grid; grid-template-columns:.86fr 1.14fr; gap:clamp(36px,5vw,80px); align-items:center; }
.twiza-home .model__title{ font-size:clamp(26px,3vw,40px); margin:18px 0 0; }
.twiza-home .model__desc{ margin:20px 0 26px; color:var(--muted); font-size:17.5px; }
.twiza-home .flow{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px 18px; }
.twiza-home .fstep{ position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px 20px; transition:transform .3s var(--ease), box-shadow .3s, border-color .3s; }
.twiza-home .fstep:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--accent-soft); }
.twiza-home .fstep__top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.twiza-home .fstep__ic{ width:46px; height:46px; border-radius:12px; background:var(--accent-soft); color:var(--accent-deep); display:flex; align-items:center; justify-content:center; }
.twiza-home .fstep__ic svg{ width:24px; height:24px; }
.twiza-home .fstep__n{ font-family:var(--font-head); font-size:30px; font-weight:600; color:var(--line); line-height:1; }
.twiza-home .fstep h4{ font-family:var(--font-body); font-size:15.5px; font-weight:600; margin:0; }
.twiza-home .fstep p{ font-size:13px; color:var(--muted); margin-top:6px; line-height:1.5; }
.twiza-home .fstep:nth-child(odd) .fstep__ic{ background:var(--green-soft); color:var(--green-deep); }

/* ============================================================
   3 · UNIVERS
   ============================================================ */
.twiza-home .uni-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.twiza-home .uni{ position:relative; overflow:hidden; border-radius:var(--radius-lg); min-height:330px; display:flex; align-items:flex-end; box-shadow:var(--shadow-sm); }
.twiza-home .uni img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.twiza-home .uni:hover img{ transform:scale(1.05); }
.twiza-home .uni::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,15,8,.78) 0%, rgba(20,15,8,.18) 55%, rgba(20,15,8,0) 100%); }
.twiza-home .uni__body{ position:relative; z-index:2; padding:clamp(26px,3vw,40px); color:#fff; }
.twiza-home .uni__kick{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:#fff; background:var(--accent); display:inline-block; padding:5px 11px; border-radius:100px; }
.twiza-home .uni__title{ font-size:clamp(24px,2.4vw,32px); margin:14px 0 6px; color:#fff; }
.twiza-home .uni__sub{ font-size:15px; color:rgba(255,255,255,.86); max-width:380px; }
.twiza-home .uni__link{ display:inline-flex; align-items:center; gap:9px; margin-top:16px; font-size:14px; font-weight:600; color:#fff; }
.twiza-home .uni__link .arr{ transition:transform .35s var(--ease); }
.twiza-home .uni:hover .uni__link .arr{ transform:translateX(5px); }
.twiza-home .future{ margin-top:40px; }
.twiza-home .future__head{ display:flex; align-items:center; gap:16px; margin-bottom:22px; }
.twiza-home .future__head .lbl{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--green-deep); background:var(--green-soft); padding:6px 12px; border-radius:100px; }
.twiza-home .future__head .line{ flex:1; height:1px; background:var(--line); }
.twiza-home .future__grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.twiza-home .fchip{ display:flex; flex-direction:column; align-items:center; gap:10px; padding:22px 12px; background:var(--cream); border:1px solid var(--line); border-radius:var(--radius); text-align:center; transition:transform .25s var(--ease), border-color .25s; }
.twiza-home .fchip:hover{ transform:translateY(-3px); border-color:var(--accent-soft); }
.twiza-home .fchip__ic{ width:40px; height:40px; color:var(--muted); }
.twiza-home .fchip__ic svg{ width:100%; height:100%; }
.twiza-home .fchip span{ font-size:13.5px; font-weight:600; color:var(--ink); }

/* ============================================================
   4 · PRODUCT SELECTION
   ============================================================ */
.twiza-home .sel__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:40px; }
.twiza-home .products{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px 26px; }
.twiza-home .product{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:transform .3s var(--ease), box-shadow .3s, border-color .3s; }
.twiza-home .product:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lift); border-color:transparent; }
.twiza-home .product__media{ position:relative; aspect-ratio:4/3.4; overflow:hidden; background:var(--cream); }
.twiza-home .product__media img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.twiza-home .product:hover .product__media img{ transform:scale(1.06); }
.twiza-home .product__tag{ position:absolute; top:12px; left:12px; z-index:2; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--accent-deep); background:rgba(255,255,255,.94); padding:5px 11px; border-radius:100px; }
.twiza-home .wish{
  position:absolute; top:11px; right:11px; z-index:3; width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.94); border:0; display:flex; align-items:center; justify-content:center; color:var(--ink);
  box-shadow:0 4px 12px -5px rgba(43,37,30,.3); transition:transform .25s var(--ease), color .25s, background .25s;
}
.twiza-home .wish svg{ width:18px; height:18px; }
.twiza-home .wish:hover{ transform:scale(1.1); color:var(--accent-deep); }
.twiza-home .wish.active{ background:var(--accent); color:#fff; }
.twiza-home .wish.active svg{ fill:currentColor; }
.twiza-home .product__body{ padding:18px 20px 22px; }
.twiza-home .product__name{ font-family:var(--font-head); font-size:20px; font-weight:600; line-height:1.2; }
.twiza-home .product__name a{ color:inherit; }
.twiza-home .product__desc{ font-size:13.5px; color:var(--muted); margin:6px 0 14px; }
.twiza-home .product__foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.twiza-home .product__price{ font-size:17px; font-weight:700; color:var(--ink); }
.twiza-home .product__price span{ font-size:13px; font-weight:500; color:var(--muted); }
.twiza-home .product__add{
  display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border-radius:100px;
  background:var(--accent-soft); color:var(--accent-deep); border:0; font-size:13px; font-weight:600;
  transition:background .25s, color .25s;
}
.twiza-home .product__add svg{ width:16px; height:16px; }
.twiza-home .product__add:hover{ background:var(--accent); color:#fff; }
.twiza-home .product__add.added{ background:var(--green); color:#fff; }
.twiza-home .sel__cta{ display:flex; justify-content:center; margin-top:46px; }

/* ============================================================
   5 · HUMAN STORY
   ============================================================ */
.twiza-home .story__grid{ display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(36px,5vw,72px); align-items:center; }
.twiza-home .story__media{ position:relative; }
.twiza-home .story__media img{ width:100%; height:100%; min-height:420px; max-height:560px; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow); }
.twiza-home .story__media .pat{ position:absolute; inset:auto -18px -18px auto; width:120px; height:120px; background-image:var(--khatem); background-size:42px; opacity:.5; z-index:-1; border-radius:var(--radius); }
.twiza-home .story__quote{ font-family:var(--font-head); font-style:italic; font-size:clamp(22px,2.4vw,30px); line-height:1.35; color:var(--ink); margin:22px 0; }
.twiza-home .story__quote .mark{ color:var(--accent); }
.twiza-home .story__by{ display:flex; align-items:center; gap:13px; margin-bottom:26px; }
.twiza-home .story__by .av{ width:46px; height:46px; border-radius:50%; object-fit:cover; }
.twiza-home .story__by b{ display:block; font-size:15px; }
.twiza-home .story__by small{ color:var(--muted); font-size:13px; }

/* ============================================================
   6 · COOPERATIVES
   ============================================================ */
.twiza-home .coops__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:40px; }
.twiza-home .coops{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.twiza-home .coop{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:transform .3s var(--ease), box-shadow .3s; }
.twiza-home .coop:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lift); }
.twiza-home .coop__media{ position:relative; aspect-ratio:3/2.3; overflow:hidden; }
.twiza-home .coop__media img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.twiza-home .coop:hover .coop__media img{ transform:scale(1.05); }
.twiza-home .coop__terr{ position:absolute; bottom:12px; left:12px; z-index:2; display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:#fff; background:rgba(43,37,30,.55); backdrop-filter:blur(4px); padding:6px 11px; border-radius:100px; }
.twiza-home .coop__terr svg{ width:13px; height:13px; }
.twiza-home .coop__body{ padding:20px 22px 22px; }
.twiza-home .coop__body h3{ font-size:20px; }
.twiza-home .coop__spec{ display:inline-flex; align-items:center; gap:7px; margin-top:10px; font-size:13px; font-weight:600; color:var(--accent-deep); background:var(--accent-soft); padding:5px 11px; border-radius:100px; }
.twiza-home .coop__txt{ font-size:14px; color:var(--muted); margin-top:14px; line-height:1.6; }
.twiza-home .coops__cta{ display:flex; justify-content:center; margin-top:46px; }

/* ============================================================
   7 · TERRITOIRES
   ============================================================ */
.twiza-home .terr{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:24px; }
.twiza-home .tcard{ position:relative; overflow:hidden; border-radius:var(--radius-lg); min-height:300px; display:flex; align-items:flex-end; box-shadow:var(--shadow-sm); }
.twiza-home .tcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.twiza-home .tcard:hover img{ transform:scale(1.05); }
.twiza-home .tcard::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,15,8,.8), rgba(20,15,8,.1) 60%, transparent); }
.twiza-home .tcard__body{ position:relative; z-index:2; padding:26px; color:#fff; }
.twiza-home .tcard__body .reg{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--orange); }
.twiza-home .tcard__body h3{ color:#fff; font-size:24px; margin:8px 0 4px; }
.twiza-home .tcard__body p{ font-size:14px; color:rgba(255,255,255,.86); }
.twiza-home .tcard--soon{ background:var(--cream); border:1.5px dashed var(--line); box-shadow:none; align-items:center; justify-content:center; text-align:center; }
.twiza-home .tcard--soon::after{ display:none; }
.twiza-home .tcard--soon .tcard__body{ color:var(--muted); padding:30px; }
.twiza-home .tcard--soon .pat{ width:64px; height:64px; margin:0 auto 16px; background-image:var(--khatem); background-size:32px; opacity:.6; }
.twiza-home .tcard--soon h3{ color:var(--ink); font-size:20px; }
.twiza-home .tcard--soon .soonlbl{ display:inline-block; margin-top:12px; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--green-deep); background:var(--green-soft); padding:6px 13px; border-radius:100px; }
.twiza-home .terr__cta{ display:flex; justify-content:center; margin-top:46px; }

/* ============================================================
   8 · WHY TWIZA
   ============================================================ */
.twiza-home .why{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.twiza-home .value{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px; transition:transform .3s var(--ease), box-shadow .3s; }
.twiza-home .value:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.twiza-home .value__ic{ width:54px; height:54px; border-radius:14px; background:var(--accent-soft); color:var(--accent-deep); display:flex; align-items:center; justify-content:center; margin-bottom:20px; }
.twiza-home .value__ic svg{ width:28px; height:28px; }
.twiza-home .value:nth-child(even) .value__ic{ background:var(--green-soft); color:var(--green-deep); }
.twiza-home .value h3{ font-size:19px; }
.twiza-home .value p{ font-size:14px; color:var(--muted); margin-top:10px; line-height:1.6; }

/* ============================================================
   9 · IMPACT
   ============================================================ */
.twiza-home .impact{ position:relative; overflow:hidden; }
.twiza-home .impact__card{
  position:relative; background:var(--orange-tint);
  border:1px solid var(--orange-soft); border-radius:var(--radius-lg);
  padding:clamp(40px,5vw,64px) clamp(28px,4vw,56px); overflow:hidden;
}
.twiza-home .impact__card::before{ content:""; position:absolute; inset:0; background-image:var(--khatem); background-size:60px; opacity:.28; pointer-events:none; }
.twiza-home .impact__head{ position:relative; z-index:1; text-align:center; max-width:640px; margin:0 auto 50px; }
.twiza-home .impact__head h2{ font-size:clamp(28px,3.3vw,46px); margin-top:14px; }
.twiza-home .impact__head p{ color:var(--muted); margin-top:14px; font-size:17.5px; }
.twiza-home .stats{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.twiza-home .stat{ text-align:center; padding:0 16px; position:relative; }
.twiza-home .stat + .stat::before{ content:""; position:absolute; left:0; top:14%; height:72%; width:1px; background:var(--orange-soft); }
.twiza-home .stat__n{ font-family:var(--font-head); font-size:clamp(42px,5vw,66px); font-weight:600; line-height:1; color:var(--accent-deep); letter-spacing:-.02em; }
.twiza-home .stat:nth-child(even) .stat__n{ color:var(--green-deep); }
.twiza-home .stat__l{ margin-top:12px; font-size:14px; color:var(--muted); }

/* ============================================================
   10 · FINAL CTA
   ============================================================ */
.twiza-home .final__card{
  position:relative; overflow:hidden; border-radius:var(--radius-lg);
  background:linear-gradient(120deg, var(--accent) 0%, var(--accent-deep) 100%);
  padding:clamp(48px,6vw,84px) clamp(28px,5vw,64px); text-align:center; color:#fff;
}
.twiza-home .final__card::before{ content:""; position:absolute; inset:0; background-image:var(--khatem); background-size:64px; opacity:.16; filter:brightness(0) invert(1); pointer-events:none; }
.twiza-home .final__card h2{ position:relative; z-index:1; font-size:clamp(30px,4vw,54px); color:#fff; line-height:1.07; }
.twiza-home .final__card p{ position:relative; z-index:1; color:rgba(255,255,255,.92); font-size:18px; margin:20px auto 32px; max-width:560px; }
.twiza-home .final__card .btn--solid{ background:#fff; color:var(--accent-deep); box-shadow:0 14px 30px -14px rgba(0,0,0,.4); }
.twiza-home .final__card .btn--solid:hover{ background:var(--ink); color:#fff; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .twiza-home .hero__grid{ grid-template-columns:1fr; min-height:0; }
  .twiza-home .hero__text{ padding:40px 0; }
  .twiza-home .hero__media{ min-height:380px; border-radius:var(--radius-lg); overflow:hidden; }
  .twiza-home .hero__media::after{ background:linear-gradient(0deg, var(--cream), rgba(251,247,240,0) 40%); }
  .twiza-home .hero__badge{ left:16px; }
  .twiza-home .model__grid, .twiza-home .story__grid{ grid-template-columns:1fr; gap:40px; }
  .twiza-home .flow{ grid-template-columns:repeat(2,1fr); }
  .twiza-home .products, .twiza-home .coops{ grid-template-columns:repeat(2,1fr); }
  .twiza-home .future__grid{ grid-template-columns:repeat(3,1fr); }
  .twiza-home .why{ grid-template-columns:repeat(2,1fr); }
  .twiza-home .terr{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .twiza-home{ font-size:16px; }
  .twiza-home .uni-grid{ grid-template-columns:1fr; }
  .twiza-home .flow{ grid-template-columns:1fr; }
  .twiza-home .products, .twiza-home .coops{ grid-template-columns:1fr; }
  .twiza-home .future__grid{ grid-template-columns:repeat(2,1fr); }
  .twiza-home .why{ grid-template-columns:1fr; }
  .twiza-home .terr{ grid-template-columns:1fr; }
  .twiza-home .stats{ grid-template-columns:repeat(2,1fr); gap:36px 0; }
  .twiza-home .stat + .stat::before{ display:none; }
  .twiza-home .sel__head, .twiza-home .coops__head{ flex-direction:column; align-items:flex-start; gap:16px; }
}

/* ============================================================
   GLOBAL HEADER + FOOTER (all pages) — Milestone B
   ============================================================ */
:root{ --tw-header-h:76px; }

/* Fixed header needs body offset. Front only (this CSS is front-only). */
body{ padding-top:var(--tw-header-h); }
/* Neutralise the layout's wrappers around our fixed header / cream footer */
#header{ background:transparent; box-shadow:none; }
#footer{ padding:0; background:transparent; color:inherit; box-shadow:none; }
/* classic #wrapper has a grey bg + top padding; kill the grey everywhere and
   remove the top gap on the homepage so the hero butts against the header. */
#wrapper{ background:#fff; }
body#index #wrapper{ padding-top:0; background:transparent; }

.tw-header{
  position:fixed; inset:0 0 auto 0; z-index:1000;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid transparent;
  transition:box-shadow .35s var(--ease), border-color .35s, background .35s;
  font-family:var(--font-body);
}
.tw-header.scrolled{ background:rgba(255,255,255,.96); box-shadow:0 1px 0 rgba(43,37,30,.06); border-color:var(--line-2); }
.tw-header__inner{
  width:min(var(--maxw), 100% - var(--gutter)*2); margin-inline:auto;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px;
  height:var(--tw-header-h);
}
.tw-brand{ display:flex; align-items:center; min-width:0; }
.tw-brand__h1{ margin:0; padding:0; line-height:0; font-size:0; }
/* Override classic .logo{max-height:70px} / .img-fluid{height:auto} */
.tw-header .tw-brand img{ height:36px !important; width:auto !important; max-height:36px !important; max-width:none !important; }
.tw-brand__name{ font-family:var(--font-head); font-size:22px; font-weight:600; color:var(--ink); }

/* --- Nav (ps_mainmenu) --- */
/* ps_mainmenu wraps the <ul> in .menu#_desktop_top_menu — center through it. */
.tw-nav{ display:flex; justify-content:center; align-items:center; min-width:0; }
.tw-nav .menu,
.tw-nav #_desktop_top_menu{ display:flex; justify-content:center; width:100%; float:none; }
.tw-nav .clearfix{ display:none; }
.tw-header .tw-nav .top-menu{
  display:flex; gap:26px; justify-content:center; align-items:center;
  list-style:none; margin:0; padding:0; font-size:14.5px; font-weight:500; float:none;
}
.tw-header .tw-nav .top-menu > li{ float:none; margin:0; border:0; }
.tw-nav .top-menu .collapse-icons,
.tw-nav .top-menu .navbar-toggler{ display:none; }
.tw-header .tw-nav .top-menu > li{ position:relative; }
.tw-header .tw-nav .top-menu > li > a{
  position:relative; display:inline-block; width:auto; padding:6px 0; border:0; background:transparent;
  color:var(--ink); font-size:14.5px; font-weight:500; text-transform:none; transition:color .2s;
}
.tw-nav .top-menu > li > a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0; border-radius:2px;
  background:var(--accent); transition:width .28s var(--ease);
}
.tw-nav .top-menu > li > a:hover{ color:var(--accent-deep); }
.tw-nav .top-menu > li.current > a{ color:var(--accent-deep); }
.tw-nav .top-menu > li.current > a::after,
.tw-nav .top-menu > li > a:hover::after{ width:100%; }
/* submenus */
.tw-nav .top-menu .sub-menu,
.tw-nav .top-menu .popover{
  position:absolute; top:100%; left:0; min-width:220px; background:#fff;
  border:1px solid var(--line); border-radius:var(--radius-sm); box-shadow:var(--shadow);
  padding:10px; margin-top:8px; display:none; z-index:10;
}
.tw-nav .top-menu li:hover > .sub-menu,
.tw-nav .top-menu li:hover > .popover{ display:block; }
.tw-nav .top-menu .sub-menu a{ display:block; padding:8px 10px; border-radius:8px; font-size:14px; color:var(--muted); }
.tw-nav .top-menu .sub-menu a:hover{ background:var(--cream); color:var(--accent-deep); }

/* --- Actions --- */
.tw-actions{ display:flex; align-items:center; gap:7px; }

/* search (ps_searchbar override .tw-searchbar) — override classic #search_widget ID rules.
   Fixed width (not min-width) so the actions cluster has a known footprint and the
   centered nav can't be squeezed into the logo. */
/* .tw-search is the fixed-width box; widget + form fill it 100% so there is no
   phantom width inflating the actions cluster (classic sizes #search_widget itself). */
.tw-search{ flex:none; width:210px; }
.tw-search #search_widget.tw-searchbar{ display:block !important; max-width:none !important; width:100% !important; min-width:0 !important; margin:0; }
.tw-search #search_widget.tw-searchbar form{
  display:flex !important; align-items:center; gap:9px; position:relative;
  background:var(--cream); border:1px solid var(--line);
  border-radius:100px; padding:9px 18px; margin:0;
  min-width:0 !important; width:100% !important;
  color:var(--muted); transition:border-color .25s, background .25s;
}
.tw-search .tw-searchbar form:focus-within{ border-color:var(--accent); background:#fff; }
.tw-search .tw-searchbar .tw-search-ico{ width:18px; height:18px; color:var(--muted); flex:none; }
.tw-search .tw-searchbar input[type="text"]{
  position:static !important; flex:1; width:auto !important; min-width:0;
  border:0 !important; outline:0; background:transparent !important; box-shadow:none !important;
  padding:0 !important; margin:0; font-family:inherit; font-size:14px; color:var(--ink);
}
.tw-search .tw-searchbar input[type="text"]::placeholder{ color:var(--muted); opacity:1; }

/* icon buttons */
.tw-iconbtn{
  position:relative; width:42px; height:42px; border:0; background:transparent; border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:var(--ink);
  transition:background .2s, color .2s; flex:none;
}
.tw-iconbtn:hover{ background:var(--accent-soft); color:var(--accent-deep); }
.tw-iconbtn svg{ width:21px; height:21px; }

/* cart (overridden ps_shoppingcart) */
.tw-cart{ position:relative; }
.tw-cart .tw-cart-link{
  position:relative; width:42px; height:42px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:var(--ink);
  transition:background .2s, color .2s;
}
.tw-cart .tw-cart-link:hover{ background:var(--accent-soft); color:var(--accent-deep); }
.tw-cart .tw-cart-link svg{ width:21px; height:21px; }
.tw-cart-srtext{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.tw-cart-badge{
  position:absolute; top:2px; right:0; min-width:17px; height:17px; padding:0 4px;
  background:var(--accent); color:#fff; font-family:var(--font-body); font-size:10px; font-weight:700;
  line-height:17px; text-align:center; border-radius:9px; transform:scale(0); transition:transform .3s var(--ease);
}
.tw-cart-badge.show{ transform:scale(1); }
/* cart dropdown preview */
.tw-cart .body{
  position:absolute; top:calc(100% + 10px); right:0; width:320px; background:#fff;
  border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:16px;
  display:none; z-index:20;
}
.tw-cart:hover .body{ display:block; }
.tw-cart .body .cart-total{ display:flex; justify-content:space-between; font-weight:700; margin-top:10px; padding-top:10px; border-top:1px solid var(--line); }

/* burger (mobile) */
.tw-burger{ display:none; width:42px; height:42px; border:0; background:transparent; border-radius:50%; align-items:center; justify-content:center; color:var(--ink); }
.tw-burger svg{ width:24px; height:24px; }

/* ---- responsive header ---- */
/* Mid widths: shrink the actions cluster so the centered nav keeps clear of the
   logo (the lang pill widened the cluster → "Accueil" was colliding at ~1280). */
@media (max-width:1366px){
  .tw-header__inner{ gap:16px; }
  .tw-header .tw-nav .top-menu{ gap:22px; }
  .tw-search{ width:180px; }
}
@media (max-width:1240px){
  .tw-search{ display:none; }              /* drop search before it crowds the nav */
  .tw-header .tw-nav .top-menu{ gap:26px; }
}
@media (max-width:1080px){
  .tw-search{ display:none; }
  .tw-burger{ display:flex; }
  .tw-header__inner{ grid-template-columns:auto 1fr auto; }
  .tw-nav{
    position:absolute; top:var(--tw-header-h); left:0; right:0;
    background:#fff; border-bottom:1px solid var(--line); box-shadow:var(--shadow);
    max-height:0; overflow:hidden; transition:max-height .3s var(--ease);
  }
  .tw-header.menu-open .tw-nav{ max-height:80vh; overflow:auto; }
  .tw-nav .top-menu{ flex-direction:column; align-items:stretch; gap:0; padding:8px 0; }
  .tw-nav .top-menu > li > a{ padding:14px var(--gutter); }
  .tw-nav .top-menu > li > a::after{ display:none; }
  .tw-nav .top-menu .sub-menu,
  .tw-nav .top-menu .popover{ position:static; display:block; box-shadow:none; border:0; margin:0; padding:0 var(--gutter); }
}

/* ============================================================
   FOOTER (light)
   ============================================================ */
.tw-footer{ background:var(--cream); border-top:1px solid var(--line); padding-top:clamp(56px,7vw,88px); font-family:var(--font-body); color:var(--ink); }
.tw-footer__wrap{ width:min(var(--content), 100% - var(--gutter)*2); margin-inline:auto; }
.tw-footer__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.5fr; gap:clamp(28px,4vw,56px); padding-bottom:48px; }
.tw-footer__brand img{ height:30px; margin-bottom:18px; width:auto; }
.tw-footer__name{ font-family:var(--font-head); font-size:22px; font-weight:600; display:block; margin-bottom:18px; }
.tw-footer__brand p{ font-size:14.5px; color:var(--muted); line-height:1.7; max-width:300px; margin:0 0 20px; }
.tw-footer__social .ps-social-follow h4{ display:none; }
.tw-footer__social .ps-social-follow ul{ display:flex; gap:10px; list-style:none; margin:0; padding:0; }
.tw-footer__social .ps-social-follow li{ margin:0; }
.tw-footer__social .ps-social-follow li a{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:var(--muted);
  transition:background .22s, color .22s, border-color .22s, transform .22s; background-position:center; background-size:18px;
}
.tw-footer__social .ps-social-follow li a:hover{ background-color:var(--accent); color:#fff; border-color:var(--accent); transform:translateY(-3px); }
.tw-footer__col h4{ font-family:var(--font-body); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); margin:0 0 18px; }
.tw-footer__col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.tw-footer__col a{ font-size:14.5px; color:var(--muted); transition:color .2s, padding-left .2s; }
.tw-footer__col a:hover{ color:var(--accent-deep); padding-left:4px; }
/* newsletter (ps_emailsubscription — theme override .tw-news) */
.tw-footer__news h4{ font-family:var(--font-body); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); margin:0 0 16px; }
.tw-footer__news .tw-news-desc{ font-size:14px; color:var(--muted); line-height:1.6; margin:0 0 16px; }
.tw-footer__news .tw-news{ margin:0; padding:0; max-width:none; }
.tw-footer__news .tw-news-field{ display:flex; gap:8px; align-items:stretch; }
.tw-footer__news .tw-news-field input[type="email"]{
  flex:1; min-width:0; width:auto; border:1px solid var(--line); background:#fff; border-radius:100px;
  padding:12px 16px; font-family:inherit; font-size:14px; color:var(--ink); outline:0; transition:border-color .25s;
}
.tw-footer__news .tw-news-field input[type="email"]:focus{ border-color:var(--accent); }
/* override classic .block_newsletter button{position:absolute;right;bottom} */
.tw-footer__news .tw-news-field button[type="submit"]{
  position:static; right:auto; bottom:auto; flex:none;
  background:var(--accent); color:#fff; border:0; border-radius:100px; padding:0 22px;
  font-family:inherit; font-size:13.5px; font-weight:600; cursor:pointer; transition:background .25s; white-space:nowrap;
}
.tw-footer__news .tw-news-field button[type="submit"]:hover{ background:var(--accent-deep); }
.tw-footer__news .tw-news-conditions{ font-size:11.5px; color:var(--muted); line-height:1.5; margin:10px 0 0; }
.tw-footer__news .tw-news-note{ font-size:12.5px; margin:10px 0 0; }
.tw-footer__news .tw-news-note.is-success{ color:var(--green-deep); }
.tw-footer__news .tw-news-note.is-error{ color:#c0392b; }
.tw-footer__bottom{ border-top:1px solid var(--line); padding:22px 0; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; font-size:13px; color:var(--muted); }
.tw-footer__legal{ display:flex; gap:22px; flex-wrap:wrap; }
.tw-footer__legal a{ color:var(--muted); transition:color .2s; }
.tw-footer__legal a:hover{ color:var(--accent-deep); }

@media (max-width:1080px){
  .tw-footer__grid{ grid-template-columns:1fr 1fr; }
  .tw-footer__brand{ grid-column:1 / -1; }
}
@media (max-width:640px){
  .tw-footer__grid{ grid-template-columns:1fr; }
  .tw-footer__bottom{ justify-content:flex-start; }
}

/* ============================================================
   B-2: real featured-product card tweaks
   ============================================================ */
.twiza-home .product__imglink{ display:block; width:100%; height:100%; }
.twiza-home .product__old{ color:var(--muted); font-size:13px; font-weight:500; text-decoration:line-through; margin-right:4px; }
.twiza-home .product__add{ text-decoration:none; }
.twiza-home .product__name a{ color:inherit; text-decoration:none; }

/* ============================================================
   MILESTONE C — GLOBAL TWIZA BRAND SKIN (inner pages)
   Applies brand tokens to classic components site-wide.
   ============================================================ */

/* ---- base ---- */
body{ font-family:var(--font-body); color:var(--ink); background:#fff; }
#wrapper{ background:#fff; }
#main a:hover{ color:var(--accent-deep); }
.h1,.h2,.h3,h1.page-title,.page-header h1,.product-title,
#main .card-block h1,#product .product-information h1{ font-family:var(--font-head); }

/* ---- breadcrumb ---- */
.breadcrumb{ background:transparent; padding:1.25rem 0 .5rem; margin:0; }
.breadcrumb ol{ margin:0; padding:0; }
.breadcrumb a{ color:var(--muted); font-size:13.5px; }
.breadcrumb a:hover{ color:var(--accent-deep); }
.breadcrumb li::after{ color:var(--line); }

/* ---- page header / titles ---- */
.page-header{ margin-bottom:1.5rem; }
.page-header h1,.h1.page-title{ font-size:clamp(26px,3vw,40px); color:var(--ink); }

/* ---- buttons ---- */
.btn{ border-radius:100px; font-family:var(--font-body); font-weight:600; letter-spacing:.01em; transition:background .25s,color .25s,border-color .25s,box-shadow .25s; }
.btn-primary,.btn-primary:focus{ background:var(--accent); border-color:var(--accent); color:#fff; box-shadow:0 10px 22px -12px var(--accent); }
.btn-primary:hover,.btn-primary:active{ background:var(--accent-deep); border-color:var(--accent-deep); color:#fff; }
.btn-secondary,.btn-tertiary,.btn-outline-secondary{ background:#fff; border:1.5px solid var(--line); color:var(--ink); box-shadow:none; }
.btn-secondary:hover,.btn-tertiary:hover{ border-color:var(--accent); color:var(--accent-deep); background:#fff; }
.btn-unstyle{ color:inherit; }

/* ---- forms ---- */
.form-control,input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],input[type=search],select,textarea,.input-group .form-control{
  border-radius:10px; border:1px solid var(--line); color:var(--ink); box-shadow:none;
}
.form-control:focus,input:focus,select:focus,textarea:focus{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); outline:0; }
.custom-radio input:checked+span,.custom-checkbox input:checked+span{ border-color:var(--accent); background:var(--accent); }
label,.form-control-label{ color:var(--ink); }

/* ---- links column / left column blocks ---- */
#left-column .block,#right-column .block,.block-categories,.card{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:none; background:#fff; }
.block .title,.block-categories .h6,.products-section-title{ font-family:var(--font-body); font-weight:700; color:var(--ink); }

/* ============================================================
   LISTING — product miniatures as Twiza cards
   ============================================================ */
#products .products,.featured-products .products,.product-accessories .products{ gap:30px 26px; }
.product-miniature{ width:100%; margin:0; }
.product-miniature .thumbnail-container{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; height:auto; transition:transform .3s var(--ease),box-shadow .3s,border-color .3s; }
.product-miniature:hover .thumbnail-container{ transform:translateY(-5px); box-shadow:var(--shadow-lift); border-color:transparent; }
.product-miniature .thumbnail-top{ position:relative; }
.product-miniature .product-thumbnail{ display:block; aspect-ratio:4/3.4; overflow:hidden; background:var(--cream); }
.product-miniature .product-thumbnail img,.product-miniature .product-thumbnail picture{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.product-miniature:hover .product-thumbnail img{ transform:scale(1.06); }
.product-miniature .product-description{ padding:16px 18px 20px; }
.product-miniature .product-title{ font-family:var(--font-head); font-size:18px; font-weight:600; line-height:1.2; margin:0 0 8px; }
.product-miniature .product-title a{ color:var(--ink); }
.product-miniature .product-title a:hover{ color:var(--accent-deep); }
.product-miniature .product-price-and-shipping{ color:var(--ink); }
.product-miniature .price{ color:var(--ink); font-weight:700; font-size:17px; }
.product-miniature .regular-price{ color:var(--muted); text-decoration:line-through; font-weight:500; font-size:14px; }
.product-miniature .discount-product,.product-flags .discount{ background:var(--accent); border-radius:100px; }
.product-miniature .highlighted-informations{ background:transparent; }
.product-miniature .quick-view{ color:var(--accent-deep); }

/* sort / filter toolbar */
.products-selection .sort-by,.products-selection .total-products{ color:var(--muted); }
.products-sort-order .select-title{ border-radius:100px; border:1px solid var(--line); background:#fff; color:var(--ink); }

/* facets */
.facet .facet-title{ color:var(--ink); font-weight:700; }
.facet .facet-label a{ color:var(--muted); }
.facet .facet-label a:hover,.active_filters .filter-block{ color:var(--accent-deep); }
.active_filters .filter-block{ background:var(--accent-soft); border-radius:100px; color:var(--accent-deep); }

/* pagination */
.pagination .page-list li a,.pagination .page-list li span{ border-radius:8px; color:var(--ink); }
.pagination .page-list li.current a,.pagination .page-list li a:hover{ background:var(--accent); color:#fff; }

/* ============================================================
   PRODUCT PAGE
   ============================================================ */
#product .product-prices .current-price span,#product .current-price-value,.product-price .current-price{ color:var(--accent-deep); font-weight:700; }
#product .product-information h1,.product-detail-name{ font-family:var(--font-head); }
.product-add-to-cart .add-to-cart{ border-radius:100px; }
.product-quantity .qty .input-group,.product-quantity input{ border-radius:10px; }
#product .tabs,.product-tabs{ border:1px solid var(--line); border-radius:var(--radius); }
.nav-tabs .nav-link.active{ color:var(--accent-deep); border-color:var(--accent); }

/* ============================================================
   CART / CHECKOUT
   ============================================================ */
.cart-summary,.cart-grid-body .card,.cart-grid-right .card,#checkout .card{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.cart-summary-line .value,.cart-total .value{ color:var(--ink); }
.checkout-step .step-title,.cart-summary .h4{ font-family:var(--font-head); }
.product-line-grid .label,.cart__card-body a{ color:var(--ink); }

/* ============================================================
   CUSTOMER / ACCOUNT
   ============================================================ */
.page-customer-account #content,.page-authentication #content,#authentication .card{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:none; }
.links .link-item,.account-links .link-item{ border:1px solid var(--line); border-radius:var(--radius); transition:transform .25s var(--ease),box-shadow .25s; }
.links .link-item:hover,.account-links .link-item:hover{ transform:translateY(-3px); box-shadow:var(--shadow); color:var(--accent-deep); }

/* ============================================================
   MILESTONE C — PRODUCT PAGE refinements
   ============================================================ */
#product #content.product-container,#product .product-container{ margin-top:1rem; }
#product .product-cover,#product .js-qv-product-cover{ border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line); background:var(--cream); }
#product .product-cover img,#product .js-qv-product-cover img{ border-radius:var(--radius-lg); width:100%; }
#product .images-container .js-qv-product-images img,#product .product-images>li img,#product .thumb{ border-radius:12px; border:1px solid var(--line); cursor:pointer; transition:border-color .2s; }
#product .product-images>li.selected img,#product .thumb.selected,#product .product-images img:hover{ border-color:var(--accent); }

#product .product-information .h1,#product .product-information h1{ font-family:var(--font-head); font-size:clamp(24px,2.6vw,34px); line-height:1.15; }
#product .product-prices{ margin:18px 0; }
#product .current-price .price,#product .current-price span.price,#product .current-price-value{ font-size:30px; color:var(--accent-deep); font-weight:700; }
#product .has-discount .regular-price,#product .product-discount .regular-price{ color:var(--muted); text-decoration:line-through; }
#product .discount.discount-percentage,#product .product-flags .discount{ background:var(--accent); border-radius:100px; }

#product .product-flags{ position:absolute; top:14px; left:14px; }
#product .product-flag{ background:var(--accent); color:#fff; border-radius:100px; font-weight:600; font-size:12px; padding:5px 12px; box-shadow:none; margin-bottom:6px; }
#product .product-flag.new{ background:var(--green); }
#product .product-flag.online-only,#product .product-flag.discount,#product .product-flag.on-sale{ background:var(--accent); }

#product .product-add-to-cart{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0; margin:22px 0; }
#product .product-add-to-cart .add-to-cart{ padding:14px 32px; font-size:15px; border-radius:100px; }
#product .product-add-to-cart .add-to-cart .material-icons{ vertical-align:middle; }
#product .product-quantity .qty .bootstrap-touchspin,#product .product-quantity #quantity_wanted,#product .product-quantity .input-group{ border-radius:10px; }
#product .product-quantity .input-group-btn-vertical .btn{ border:1px solid var(--line); background:#fff; }

#product .product-variants>.product-variants-item{ margin:14px 0; }
#product .product-variants .control-label{ font-weight:600; color:var(--ink); }
#product .product-variants .input-color+span,#product .product-variants .color{ border-radius:50%; border:1px solid var(--line); }
#product .product-variants input.input-color:checked+span,#product .product-variants input:checked+.color{ box-shadow:0 0 0 2px var(--accent); }
#product .product-variants select.form-control{ border-radius:100px; }

#product .product-reference,#product .product-quantities,#product .product-availability{ color:var(--muted); }
#product .product-availability .product-available{ color:var(--green-deep); }

.product-tabs .nav-tabs,#product .tabs .nav-tabs{ border-bottom:1px solid var(--line); }
.product-tabs .nav-tabs .nav-link,#product .tabs .nav-link{ color:var(--muted); font-weight:600; border:0; background:transparent; }
.product-tabs .nav-tabs .nav-link.active,#product .tabs .nav-link.active{ color:var(--accent-deep); border-bottom:2px solid var(--accent); background:transparent; }
#product .tabs{ border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; }

#product .product-accessories .h3,#product .featured-products .h3{ font-family:var(--font-head); }

/* ============================================================
   MILESTONE C — CART / CHECKOUT / ACCOUNT refinements
   ============================================================ */
/* cart */
.cart-grid-body .card,.cart-grid-right .card,.cart-summary{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.cart-item{ border-bottom:1px solid var(--line); }
.cart-items .cart-item:last-child{ border-bottom:0; }
.product-line-grid .product-line-info .label,.cart-summary-products .label{ font-family:var(--font-head); color:var(--ink); }
.cart-summary-line.cart-total .value,.cart-detailed-totals .cart-total .value{ color:var(--accent-deep); font-weight:700; }
.cart-grid-right .checkout a.btn,.checkout .btn-primary{ width:100%; }
.product-price,.cart-line-product-actions .remove-from-cart{ color:var(--muted); }
.cart-line-product-actions .remove-from-cart:hover{ color:var(--accent-deep); }

/* checkout */
#checkout .checkout-step{ border:1px solid var(--line); border-radius:var(--radius); margin-bottom:1rem; background:#fff; }
#checkout .checkout-step .step-title{ font-family:var(--font-head); color:var(--ink); }
#checkout .checkout-step.-current .step-title,#checkout .step-title:hover{ color:var(--accent-deep); }
#checkout .checkout-step .step-number,#checkout .checkout-step .done{ background:var(--accent); color:#fff; }
.payment-options .payment-option,.delivery-options .delivery-option{ border:1px solid var(--line); border-radius:var(--radius-sm); padding:.75rem 1rem; margin-bottom:.5rem; }
.payment-options .custom-radio input:checked~.delivery-option,.delivery-option:hover{ border-color:var(--accent); }
#conditions-to-approve label,.condition-label label{ color:var(--ink); }

/* order confirmation */
.order-confirmation-table,.order-confirmation .card{ border:1px solid var(--line); border-radius:var(--radius); }
#order-confirmation .h1,.page-order-confirmation h3{ font-family:var(--font-head); }

/* account */
.page-customer-account .page-content,.page-addresses .address,.page-my-account .links{ }
.page-my-account .links a.link-item{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:none; transition:transform .25s var(--ease),box-shadow .25s,color .25s; }
.page-my-account .links a.link-item:hover{ transform:translateY(-4px); box-shadow:var(--shadow); color:var(--accent-deep); }
.page-my-account .links a.link-item i,.page-my-account .links a.link-item .material-icons{ color:var(--accent-deep); }
.address{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:none; }
table.table thead th{ color:var(--ink); border-bottom:1px solid var(--line); }
.table tbody td{ border-color:var(--line-2); }

/* notifications / alerts */
.alert-success{ background:var(--green-soft); color:var(--green-deep); border:0; border-radius:var(--radius-sm); }
.alert-warning,.alert-info{ border-radius:var(--radius-sm); }
.alert-danger{ border-radius:var(--radius-sm); }

/* ============================================================
   UI CORRECTIONS (user feedback) — pagination, category, product, cart
   ============================================================ */

/* ---- 4) PAGINATION: robust flex layout + padded, clickable buttons ---- */
nav.pagination{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  margin:2rem 0 1rem; padding-top:1.5rem; border-top:1px solid var(--line); }
nav.pagination > div{ width:auto !important; max-width:none; margin:0 !important; padding:0 !important; float:none; flex:0 1 auto; }
nav.pagination .col-md-4{ color:var(--muted); font-size:14px; }
.pagination .page-list{ display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; align-items:center;
  margin:0; padding:0; list-style:none; }
.pagination .page-list li{ margin:0; padding:0; float:none; }
.pagination .page-list li a,
.pagination .page-list li span{ display:inline-flex; align-items:center; justify-content:center;
  min-width:44px; height:44px; padding:0 14px; border:1px solid var(--line); border-radius:12px;
  color:var(--ink); font-weight:600; font-size:14px; background:#fff; line-height:1; transition:all .2s var(--ease); }
.pagination .page-list li a:hover{ border-color:var(--accent); color:var(--accent-deep); background:var(--accent-soft); }
.pagination .page-list li.current a{ background:var(--accent); border-color:var(--accent); color:#fff; }
.pagination .page-list li .disabled{ opacity:.4; pointer-events:none; }
.pagination .page-list .spacer{ border:0; background:transparent; min-width:auto; }
.pagination .page-list .previous,.pagination .page-list .next{ padding:0 16px; }
.pagination .page-list .material-icons{ font-size:18px; }

/* ---- 3) CATEGORY PAGE: theme the header, sidebar, sort, subcategories ---- */
#category #content-wrapper,.page-category #content-wrapper{ padding-top:.5rem; }
#js-product-list-header .h1,.page-category h1.h1,#category h1{ font-family:var(--font-head); font-size:clamp(26px,3vw,40px); color:var(--ink); margin-bottom:.5rem; }
#category-description,.category-description{ color:var(--muted); font-size:15px; line-height:1.7; }
/* left column blocks */
#left-column .block-categories,#left-column .ps-block,#search_filters,#search_filters_wrapper{
  border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:none; padding:1.25rem; }
#left-column .block-categories .category-top-menu a,#search_filters .h6,#left-column h4,.block-categories h4{
  color:var(--ink); font-family:var(--font-body); font-weight:700; }
#left-column .category-sub-menu a,#left-column .block-categories a{ color:var(--muted); }
#left-column .category-sub-menu a:hover,#left-column .block-categories a:hover{ color:var(--accent-deep); }
/* subcategories tiles */
.subcategories-list li,.subcategory-image a,.subcategory{ border-radius:var(--radius); }
.subcategories ul.subcategories-list{ display:flex; flex-wrap:wrap; gap:16px; list-style:none; padding:0; }
.subcategory-name{ font-family:var(--font-head); color:var(--ink); }
/* sort toolbar */
.products-sort-order .select-title{ border:1px solid var(--line); border-radius:100px; background:#fff; color:var(--ink); padding:.5rem 1rem; }
.products-sort-order .dropdown-menu{ border:1px solid var(--line); border-radius:var(--radius-sm); box-shadow:var(--shadow); }
.total-products{ color:var(--muted); }
.sort-by-row{ align-items:center; }

/* ---- 2) PRODUCT PAGE: stronger polish ---- */
#product .product-information{ padding-left:.5rem; }
#product .product-information .h1,#product .product-prices,#product .product-actions{ font-family:var(--font-body); }
#product .product-prices .current-price,#product .current-price{ font-family:var(--font-head); }
#product .product-description-short,#product .product-description{ color:var(--muted); font-size:15px; line-height:1.75; }
#product .product-information .product-manufacturer{ color:var(--muted); }
#product .h4,#product .product-information .h4{ font-family:var(--font-head); color:var(--ink); }
#product .social-sharing li{ border:1px solid var(--line); border-radius:50%; }
#product .product-features dt.name,#product .data-sheet dt{ color:var(--ink); font-weight:600; }
#product .product-features dd.value,#product .data-sheet dd{ color:var(--muted); }

/* ---- 5) CART: font sizes + button styles ---- */
.cart-grid .cart-summary .h1,#cart .cart-overview .h1,.cart-grid-body .h1{ font-family:var(--font-head); font-size:clamp(24px,2.6vw,34px); }
.cart-summary-products,.cart-item .product-line-info{ font-size:15px; }
.cart-item .product-line-info .label,.product-line-info a.label{ font-family:var(--font-head); font-size:16px; color:var(--ink); }
.cart-summary .cart-total .value,.cart-detailed-totals .label,.cart-summary-line .value{ font-weight:600; }
.cart-detailed-actions .btn,.checkout a.btn,#cart .btn-primary{ border-radius:100px; font-weight:600; }
.cart-grid-right .card-block{ font-size:14.5px; }
.product-quantity .input-group .form-control,.cart-item .qty .form-control{ border-radius:10px; }

/* ============================================================
   UI CORRECTIONS v2 (from live screenshots)
   ============================================================ */

/* --- CATEGORY: kill the empty faceted-search box; only show it when it has facets --- */
#left-column #search_filters_wrapper,#left-column #search_filters,#left-column #search_filter_controls{
  border:0 !important; border-radius:0; padding:0; background:transparent; box-shadow:none; }
#left-column #search_filters_wrapper:has(.facet){
  border:1px solid var(--line) !important; border-radius:var(--radius); padding:1.25rem; background:#fff; margin-top:1rem; }
#left-column #search_filter_controls:empty{ display:none; }
/* category nav block heading */
#left-column .block-categories .category-top-menu>li>a{ font-family:var(--font-body); font-weight:700; color:var(--ink); }

/* --- CATEGORY: subcategory tiles (handle missing images cleanly) --- */
.subcategories ul.subcategories-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:18px; list-style:none; margin:0; padding:0; }
.subcategories .subcategory-image{ aspect-ratio:1/1; border-radius:var(--radius); overflow:hidden;
  background-color:var(--cream); background-image:var(--khatem); background-size:42px; border:1px solid var(--line); }
.subcategories .subcategory-image a.img{ display:block; width:100%; height:100%; background-size:cover; background-position:center; }
.subcategories .subcategory-name{ display:block; margin-top:10px; font-family:var(--font-head); font-size:15px; color:var(--ink); text-align:center; }
.subcategories .subcategory-name:hover{ color:var(--accent-deep); }
#subcategories .subcategory-heading{ font-family:var(--font-head); font-size:clamp(20px,2.2vw,26px); margin-bottom:1.25rem; }

/* --- LISTING: product flags as small pills top-left, themed colours --- */
.product-miniature .thumbnail-top{ position:relative; }
.product-miniature .product-flags{ position:absolute; top:12px; left:12px; right:auto; z-index:3; margin:0; padding:0;
  list-style:none; display:flex; flex-direction:column; align-items:flex-start; gap:6px; max-width:70%; }
.product-miniature .product-flag{ display:inline-block; width:auto; margin:0; padding:5px 11px; font-size:11px; font-weight:700;
  letter-spacing:.03em; line-height:1.2; border-radius:100px; color:#fff; background:var(--accent); box-shadow:none; }
.product-miniature .product-flag.new{ background:var(--green); }
.product-miniature .product-flag.on-sale{ background:var(--accent); }
.product-miniature .product-flag.discount{ background:var(--ink); }
.product-miniature .product-flag.online-only,.product-miniature .product-flag.pack{ background:var(--muted); }

/* --- PRODUCT PAGE: clean up orphaned "Quantité" label left by quickorder replace-cart mode --- */
#product .product-add-to-cart .control-label{ display:none !important; }
#product .product-add-to-cart{ border:0 !important; padding:0 !important; margin:0 !important; min-height:0 !important; }
/* the COD form (quickorder) becomes the primary CTA — give it a little breathing room */
#product .product-additional-info,#product .js-product-additional-info{ margin-top:1rem; }

/* --- LANDING: theme the turquoise section-title underline to orange --- */
.ps-landing-section-title::after,.ps-landing-section-title:after{ background:var(--accent) !important; }
.ps-landing-section-title{ border-bottom-color:var(--accent) !important; }
.ps-landing-features-grid .ps-landing-feature-card{ border-radius:var(--radius); border:1px solid var(--line); }

/* --- CATEGORY subcategories: correct selector (#subcategories is an ID) --- */
#subcategories ul.subcategories-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:18px; list-style:none; margin:0; padding:0; }
#subcategories .subcategories-list li{ float:none; margin:0; }
#subcategories .subcategory-image{ display:block; aspect-ratio:1/1; border-radius:var(--radius); overflow:hidden;
  background-color:var(--cream); background-image:var(--khatem); background-size:42px; border:1px solid var(--line); }
#subcategories .subcategory-image a.img,#subcategories .subcategory-image a{ display:block; width:100%; height:100%; background-size:cover; background-position:center; }
#subcategories .subcategory-name{ display:block; margin-top:10px; font-family:var(--font-head); font-size:15px; color:var(--ink); text-align:center; }
#subcategories .subcategory-name:hover{ color:var(--accent-deep); }
#subcategories .subcategory-heading{ font-family:var(--font-head); font-size:clamp(20px,2.2vw,26px); margin-bottom:1.25rem; }

/* ============================================================
   LANDING (hide_chrome) products — match PRS01001 clean COD landing:
   hide social sharing + product comments (they shouldn't show on the landing).
   body.lp-chrome-hidden is added by landingpagecod when hide_chrome is on.
   ============================================================ */
body.lp-chrome-hidden .social-sharing,
body.lp-chrome-hidden #product-comments-list-header,
body.lp-chrome-hidden #product-comments-list,
body.lp-chrome-hidden #product-comments-list-footer,
body.lp-chrome-hidden #empty-product-comment,
body.lp-chrome-hidden .comments-nb,
body.lp-chrome-hidden #post-product-comment,
body.lp-chrome-hidden .product-comments,
body.lp-chrome-hidden .comments,
body.lp-chrome-hidden .product-comments-additional-info,
body.lp-chrome-hidden .blockreassurance_product,
body.lp-chrome-hidden .block-reassurance,
body.lp-chrome-hidden #block-reassurance,
body.lp-chrome-hidden .reassurance{ display:none !important; }

/* ============================================================
   SEARCHBAR override: size icon + pill EVERYWHERE it renders
   (fixes giant magnifier in empty-category / no-results blocks).
   Header keeps its own (more specific) sizing under .tw-search.
   ============================================================ */
.tw-searchbar .tw-search-ico{ width:18px !important; height:18px !important; flex:none; color:var(--muted); }
.tw-searchbar form{ display:flex; align-items:center; gap:9px; background:var(--cream);
  border:1px solid var(--line); border-radius:100px; padding:10px 18px; max-width:380px; }
.tw-searchbar form:focus-within{ border-color:var(--accent); background:#fff; }
.tw-searchbar input[type="text"]{ flex:1; min-width:0; border:0; outline:0; background:transparent;
  font-family:inherit; font-size:14px; color:var(--ink); }
/* centre the search inside the empty-category / no-products block */
#products .search-widget,#js-product-list .search-widget,.page-not-found .tw-searchbar{ margin:1rem auto 0; }
#products .search-widget form,.page-not-found .tw-searchbar form{ margin-inline:auto; }
/* the big "no products" icon, if any, kept reasonable */
#products .no-products svg,#js-product-list svg.icon-no-result{ width:80px; height:80px; }

/* ============================================================
   Footer tweaks (user feedback): kill newsletter white box, hide social
   ============================================================ */
.tw-footer__news .block_newsletter.tw-news,
.tw-footer__news .tw-news{
  background:transparent !important; padding:0 !important; margin:0 !important;
  max-width:none !important; border:0 !important; box-shadow:none !important; float:none !important;
}
.tw-footer__news .tw-news input{ box-shadow:none; }
/* hide footer social icons */
.tw-footer__social{ display:none !important; }

/* ============================================================
   Recolor classic's turquoise (#24b9d7) links to Twiza orange.
   Base element selector — higher-specificity component rules
   (.product-title a, .breadcrumb a, .tw-nav a, footer, .twiza-home a) win.
   ============================================================ */
a{ color:var(--accent-deep); }
a:hover{ color:var(--accent); }
.btn-link,.page-link{ color:var(--accent-deep); }
/* keep utility/neutral contexts from going orange unintentionally */
.breadcrumb a,.tw-footer__col a,.tw-footer__legal a,.product-miniature .product-title a,
#product .product-information h1 a,.tw-nav a,.cart-item a,.product-line-info a.label{ color:inherit; }
.breadcrumb a:hover,.tw-footer__col a:hover,.tw-footer__legal a:hover,
.product-miniature .product-title a:hover{ color:var(--accent-deep); }

/* ============================================================
   UI FIX (2026-06) — header turquoise + hero button merge
   ------------------------------------------------------------
   The twiza header (#tw-header) is rendered INSIDE classic's
   <header id="header">, so classic's #header a:hover{color:#24b9d7}
   (specificity 1,1,1) beat every .tw-* class override → turquoise.
   These #header #tw-header (2,1,1) rules decisively win it back.
   ============================================================ */
#header #tw-header a:hover,
#header #tw-header a:focus,
#header #tw-header .tw-iconbtn:hover,
#header #tw-header .tw-nav .top-menu a:hover,
#header #tw-header .tw-nav .top-menu .sub-menu a:hover,
#header #tw-header .tw-cart a:hover,
#header #tw-header .tw-cart .tw-cart-link:hover{ color:var(--accent-deep); }
/* preserve the soft-orange hover pill on the icon/cart buttons */
#header #tw-header .tw-iconbtn:hover,
#header #tw-header .tw-cart .tw-cart-link:hover{ background:var(--accent-soft); }

/* Hero/CTA solid+green buttons kept legible on hover.
   #main a:hover{color:var(--accent-deep)} (1,1,1) was tinting the
   label the same deep-orange as the hover background → text merged in. */
#main .twiza-home .btn--solid:hover,
#main .twiza-home .btn--green:hover,
#main a.btn-primary:hover,
#main a.btn-primary:active{ color:#fff; }

/* ════════════════════════════════════════════════════════════════════════
   NOTRE MODÈLE  (CMS id 10)  ·  page components + Arabic webfont + RTL
   Wrapper: <section class="twiza-home twiza-model">  → reuses home primitives.
   Added 2026-06-11 (new-pages integration, page 1/3).
   ════════════════════════════════════════════════════════════════════════ */

/* ---- Arabic self-hosted webfonts (headings: El Messiri · body: Cairo) ---- */
@font-face{ font-family:'Cairo'; font-style:normal; font-weight:400; font-display:swap;
  src:url(../fonts/twiza/cairo-400-normal.woff2) format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face{ font-family:'Cairo'; font-style:normal; font-weight:500; font-display:swap;
  src:url(../fonts/twiza/cairo-500-normal.woff2) format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face{ font-family:'Cairo'; font-style:normal; font-weight:600; font-display:swap;
  src:url(../fonts/twiza/cairo-600-normal.woff2) format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face{ font-family:'Cairo'; font-style:normal; font-weight:700; font-display:swap;
  src:url(../fonts/twiza/cairo-700-normal.woff2) format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face{ font-family:'El Messiri'; font-style:normal; font-weight:600; font-display:swap;
  src:url(../fonts/twiza/elmessiri-600-normal.woff2) format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face{ font-family:'El Messiri'; font-style:normal; font-weight:700; font-display:swap;
  src:url(../fonts/twiza/elmessiri-700-normal.woff2) format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }

/* ---- 1 · HERO (institutional split) — full-bleed cream band ---- */
.twiza-model .mhero{ background:var(--cream); overflow:hidden; position:relative;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
.twiza-model .mhero__grid{ width:min(var(--maxw), 100% - var(--gutter)*2); margin-inline:auto;
  display:grid; grid-template-columns:0.92fr 1.18fr; gap:0; align-items:center; min-height:clamp(520px,72vh,680px); }
.twiza-model .mhero__text{ display:flex; flex-direction:column; justify-content:center;
  padding:clamp(40px,5vw,80px) clamp(28px,4vw,64px) clamp(40px,5vw,80px) 0; }
.twiza-model .mhero__text h1{ font-size:clamp(34px,4.4vw,60px); line-height:1.06; margin:20px 0 0; letter-spacing:-.02em; text-wrap:balance; }
.twiza-model .mhero__text h1 em{ font-style:italic; color:var(--accent-deep); }
.twiza-model .mhero__sub{ margin:22px 0 0; font-size:18.5px; color:var(--muted); max-width:540px; }
.twiza-model .mhero__by{ display:inline-flex; align-items:center; gap:9px; margin-top:26px; font-size:14px; color:var(--muted); }
.twiza-model .mhero__by .chip{ display:inline-flex; align-items:center; gap:7px; background:#fff; border:1px solid var(--line); border-radius:100px; padding:6px 13px; font-weight:600; color:var(--ink); }
.twiza-model .mhero__by .chip i{ width:8px; height:8px; border-radius:50%; background:var(--green); }
.twiza-model .mhero__cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.twiza-model .mhero__media{ position:relative; aspect-ratio:5/4; border-radius:14px; overflow:hidden; margin:clamp(24px,4vw,56px) 0; }
.twiza-model .mhero__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:14px; }
.twiza-model .mhero__media::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, var(--cream) 0%, rgba(251,247,240,.3) 14%, rgba(251,247,240,0) 40%); }

/* ---- 2 · WHY (4 cards) ---- */
.twiza-model .why4{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.twiza-model .wcard{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px; position:relative; transition:transform .3s var(--ease), box-shadow .3s; }
.twiza-model .wcard:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.twiza-model .wcard__num{ font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--accent-deep); }
.twiza-model .wcard__ic{ width:52px; height:52px; border-radius:14px; background:var(--accent-soft); color:var(--accent-deep); display:flex; align-items:center; justify-content:center; margin:14px 0 18px; }
.twiza-model .wcard:nth-child(even) .wcard__ic{ background:var(--green-soft); color:var(--green-deep); }
.twiza-model .wcard__ic svg{ width:27px; height:27px; }
.twiza-model .wcard h3{ font-size:20px; margin-bottom:10px; }
.twiza-model .wcard p{ font-size:14px; color:var(--muted); line-height:1.65; }

/* ---- 3 · 6-STEP TIMELINE ---- */
.twiza-model .timeline{ position:relative; max-width:880px; margin:0 auto; }
.twiza-model .timeline::before{ content:""; position:absolute; left:31px; top:24px; bottom:24px; width:2px; background:linear-gradient(var(--accent), var(--green)); opacity:.35; }
.twiza-model .tstep{ position:relative; display:grid; grid-template-columns:64px 1fr; gap:26px; padding:18px 0; align-items:flex-start; }
.twiza-model .tstep__dot{ position:relative; z-index:1; width:64px; height:64px; border-radius:50%; background:#fff; border:2px solid var(--accent-soft); display:flex; align-items:center; justify-content:center; color:var(--accent-deep); box-shadow:var(--shadow-sm); }
.twiza-model .tstep:nth-child(even) .tstep__dot{ border-color:var(--green-soft); color:var(--green-deep); }
.twiza-model .tstep__dot svg{ width:28px; height:28px; }
.twiza-model .tstep__n{ position:absolute; top:-6px; right:-6px; width:24px; height:24px; border-radius:50%; background:var(--accent); color:#fff; font-family:var(--font-head); font-size:12px; font-weight:600; display:flex; align-items:center; justify-content:center; }
.twiza-model .tstep:nth-child(even) .tstep__n{ background:var(--green); }
.twiza-model .tstep__body{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px 26px; transition:transform .3s var(--ease), box-shadow .3s, border-color .3s; }
.twiza-model .tstep:hover .tstep__body{ transform:translateX(4px); box-shadow:var(--shadow); border-color:var(--accent-soft); }
.twiza-model .tstep__body h3{ font-size:21px; }
.twiza-model .tstep__body p{ font-size:14.5px; color:var(--muted); margin-top:8px; line-height:1.6; }

/* ---- 4 · TEAM ---- */
.twiza-model .team__grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(36px,5vw,72px); align-items:center; }
.twiza-model .team__media{ position:relative; }
.twiza-model .team__media img{ width:100%; height:100%; min-height:420px; max-height:520px; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow); display:block; }
.twiza-model .team__media .pat{ position:absolute; inset:auto -18px -18px auto; width:120px; height:120px; background-image:var(--khatem); background-size:42px; opacity:.5; z-index:-1; border-radius:var(--radius); }
.twiza-model .team__stats{ display:flex; gap:14px; margin:28px 0; flex-wrap:wrap; }
.twiza-model .tstat{ flex:1; min-width:120px; background:var(--cream); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
.twiza-model .tstat__n{ font-family:var(--font-head); font-size:34px; font-weight:600; color:var(--accent-deep); line-height:1; }
.twiza-model .tstat:nth-child(2) .tstat__n{ color:var(--green-deep); }
.twiza-model .tstat__l{ font-size:13px; color:var(--muted); margin-top:8px; }

/* ---- 5 · RESPONSABLES (profile cards) ---- */
.twiza-model .profiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.twiza-model .profile{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:transform .3s var(--ease), box-shadow .3s; }
.twiza-model .profile:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lift); }
.twiza-model .profile__media{ position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--cream); }
.twiza-model .profile__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.twiza-model .profile__body{ padding:20px 22px 24px; }
.twiza-model .profile__name{ font-family:var(--font-head); font-size:19px; font-weight:600; }
.twiza-model .profile__role{ font-size:13px; font-weight:600; color:var(--accent-deep); margin-top:4px; }
.twiza-model .profile__spec{ display:inline-flex; align-items:center; gap:7px; margin-top:14px; font-size:12.5px; color:var(--muted); background:var(--cream); border:1px solid var(--line); padding:5px 11px; border-radius:100px; }
.twiza-model .profile__spec svg{ width:13px; height:13px; color:var(--green-deep); }

/* ---- 6 · PARTNERS (wordmark strip) ---- */
.twiza-model .partners{ display:grid; grid-template-columns:repeat(6,1fr); gap:18px; }
.twiza-model .plogo{ display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px 16px; min-height:104px; text-align:center; transition:transform .25s var(--ease), box-shadow .25s, border-color .25s; }
.twiza-model .plogo:hover{ transform:translateY(-3px); box-shadow:var(--shadow-sm); border-color:var(--accent-soft); }
.twiza-model .plogo__name{ font-family:var(--font-head); font-size:19px; font-weight:600; color:var(--ink); letter-spacing:.01em; }
.twiza-model .plogo:nth-child(3n+1) .plogo__name{ color:var(--green-deep); }
.twiza-model .plogo:nth-child(3n+2) .plogo__name{ color:var(--accent-deep); }
.twiza-model .plogo__name small{ display:block; font-family:var(--font-body); font-size:10.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-top:4px; }

/* ---- 7 · FINAL VISION BANNER (light) ---- */
.twiza-model .vision{ position:relative; overflow:hidden; border-radius:var(--radius-lg); min-height:440px; display:flex; align-items:center; }
.twiza-model .vision img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.twiza-model .vision::after{ content:""; position:absolute; inset:0; }
.twiza-model .vision--light{ background:var(--cream-2); }
.twiza-model .vision--light::after{ background:linear-gradient(100deg, var(--cream) 0%, rgba(251,247,240,.88) 40%, rgba(251,247,240,.30) 72%, rgba(251,247,240,.05) 100%); }
.twiza-model .vision__body{ position:relative; z-index:2; padding:clamp(36px,5vw,72px); max-width:720px; color:var(--ink); }
.twiza-model .vision__body .eyebrow{ color:var(--accent-deep); }
.twiza-model .vision__body h2{ color:var(--ink); font-size:clamp(28px,3.6vw,48px); line-height:1.1; margin-top:16px; }
.twiza-model .vision__body p{ color:var(--muted); font-size:17px; margin:20px 0 30px; }

/* ---- RESPONSIVE ---- */
@media (max-width:1080px){
  .twiza-model .mhero__grid{ grid-template-columns:1fr; min-height:0; }
  .twiza-model .mhero__text{ padding:36px 0; }
  .twiza-model .mhero__media{ min-height:360px; border-radius:var(--radius-lg); overflow:hidden; }
  .twiza-model .mhero__media::after{ background:linear-gradient(0deg, var(--cream), rgba(251,247,240,0) 40%); }
  .twiza-model .why4{ grid-template-columns:repeat(2,1fr); }
  .twiza-model .team__grid{ grid-template-columns:1fr; gap:40px; }
  .twiza-model .profiles{ grid-template-columns:repeat(2,1fr); }
  .twiza-model .partners{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:640px){
  .twiza-model .why4{ grid-template-columns:1fr; }
  .twiza-model .profiles{ grid-template-columns:1fr 1fr; }
  .twiza-model .partners{ grid-template-columns:repeat(2,1fr); }
  .twiza-model .timeline::before{ left:23px; }
  .twiza-model .tstep{ grid-template-columns:48px 1fr; gap:16px; }
  .twiza-model .tstep__dot{ width:48px; height:48px; }
  .twiza-model .tstep__dot svg{ width:22px; height:22px; }
}

/* ════════ RTL / Arabic layer for Notre modèle ════════ */
.twiza-model[dir="rtl"]{ --font-head:'El Messiri','Playfair Display',serif; --font-body:'Cairo','Inter',system-ui,sans-serif; }
.twiza-model[dir="rtl"] h1,.twiza-model[dir="rtl"] h2,.twiza-model[dir="rtl"] h3,.twiza-model[dir="rtl"] h4{ letter-spacing:0; line-height:1.5; }
.twiza-model[dir="rtl"] .eyebrow{ letter-spacing:.08em; }
.twiza-model[dir="rtl"] em{ font-style:normal; color:var(--accent-deep); }
.twiza-model[dir="rtl"] .mhero__text{ padding:clamp(40px,5vw,80px) 0 clamp(40px,5vw,80px) clamp(28px,4vw,64px); }
.twiza-model[dir="rtl"] .mhero__sub{ font-size:17px; line-height:1.85; }
.twiza-model[dir="rtl"] .mhero__media::after{ background:linear-gradient(-90deg, var(--cream) 0%, rgba(251,247,240,.3) 14%, rgba(251,247,240,0) 40%); }
.twiza-model[dir="rtl"] .timeline::before{ left:auto; right:31px; }
.twiza-model[dir="rtl"] .tstep:hover .tstep__body{ transform:translateX(-4px); }
.twiza-model[dir="rtl"] .tstep__n{ right:auto; left:-6px; }
.twiza-model[dir="rtl"] .team__media .pat{ inset:auto auto -18px -18px; }
.twiza-model[dir="rtl"] .vision--light::after{ background:linear-gradient(260deg, var(--cream) 0%, rgba(251,247,240,.88) 40%, rgba(251,247,240,.30) 72%, rgba(251,247,240,.05) 100%); }
.twiza-model[dir="rtl"] .wcard p,.twiza-model[dir="rtl"] .tstep__body p,.twiza-model[dir="rtl"] .vision__body p{ line-height:1.85; }
@media (max-width:1080px){
  .twiza-model[dir="rtl"] .mhero__text{ padding:36px 0; }
}

/* ════════════════════════════════════════════════════════════════════════
   GLOBAL RTL / ARABIC  (activates on <body class="lang-rtl">, PS adds it for AR)
   Arabic glyphs → self-hosted Cairo/El Messiri; Latin (TWIZA, prices, names)
   keeps Inter/Playfair via the fallback stack. Added 2026-06-11 (Milestone F).
   ════════════════════════════════════════════════════════════════════════ */
body.lang-rtl{
  direction:rtl;
  --font-head:'El Messiri','Playfair Display',serif;
  --font-body:'Cairo','Inter',system-ui,sans-serif;
}
body.lang-rtl,
body.lang-rtl input,
body.lang-rtl textarea,
body.lang-rtl select,
body.lang-rtl button{ font-family:var(--font-body); }
/* Arabic has no italics / negative tracking */
body.lang-rtl h1,body.lang-rtl h2,body.lang-rtl h3,body.lang-rtl h4{ letter-spacing:0; line-height:1.45; }
body.lang-rtl em{ font-style:normal; color:var(--accent-deep); }
body.lang-rtl .eyebrow{ letter-spacing:.08em; }

/* ---- Language switcher (header pill toggle) — FR / AR, height-matched to the
   42px action row so it doesn't read as cramped next to search + icons ---- */
.tw-langsw{ display:inline-flex; align-items:center; gap:2px; background:var(--cream);
  border:1px solid var(--line); border-radius:100px; padding:4px; margin-inline-end:6px; flex:none; }
.tw-langsw__btn{ border:0; background:transparent; cursor:pointer; text-decoration:none;
  font-family:var(--font-body); font-size:12.5px; font-weight:700; letter-spacing:.02em; color:var(--muted);
  padding:8px 13px; border-radius:100px; line-height:1; min-width:38px; text-align:center;
  transition:background .22s var(--ease), color .22s; }
.tw-langsw__btn.is-active{ background:#fff; color:var(--accent-deep); box-shadow:var(--shadow-sm); }
.tw-langsw__btn:not(.is-active):hover{ color:var(--ink); }
@media (max-width:1080px){ .tw-langsw button,.tw-langsw__btn{ padding:7px 10px; font-size:12px; min-width:32px; } }

/* ---- HEADER (RTL): mirror search magnifier; keep dropdowns aligned to start ---- */
body.lang-rtl .tw-search .tw-searchbar .tw-search-ico,
body.lang-rtl .tw-searchbar .tw-search-ico{ transform:scaleX(-1); }
body.lang-rtl .tw-cart .body .cart-total{ direction:rtl; }

/* ---- HOMEPAGE (.twiza-home) RTL component flips ---- */
/* hero scrim fades from the text side (now right) */
body.lang-rtl .twiza-home .hero__media::after{
  background:linear-gradient(-90deg, var(--cream) 0%, rgba(251,247,240,.35) 16%, rgba(251,247,240,0) 42%); }
@media (max-width:1080px){
  body.lang-rtl .twiza-home .hero__media::after{ background:linear-gradient(0deg, var(--cream), rgba(251,247,240,0) 40%); }
}
/* floating hero badge → opposite corner */
body.lang-rtl .twiza-home .hero__badge{ left:auto; right:-34px; }
@media (max-width:1080px){ body.lang-rtl .twiza-home .hero__badge{ left:auto; right:16px; } }
/* inline "→" arrows mirror */
body.lang-rtl .twiza-home .arr{ display:inline-block; transform:scaleX(-1); }
body.lang-rtl .twiza-home .tlink:hover .arr{ transform:scaleX(-1) translateX(4px); }
body.lang-rtl .twiza-home .uni:hover .uni__link .arr{ transform:scaleX(-1) translateX(5px); }
/* coop territory chip → opposite bottom corner */
body.lang-rtl .twiza-home .coop__terr{ left:auto; right:12px; }
/* stat vertical divider → opposite side */
body.lang-rtl .twiza-home .stat + .stat::before{ left:auto; right:0; }
/* decorative khatem patch (model/story/team) → opposite corner */
body.lang-rtl .twiza-home .pat,
body.lang-rtl .twiza-home .story__media .pat{ inset:auto auto -18px -18px; }
/* longer Arabic lines breathe a little more */
body.lang-rtl .twiza-home p{ line-height:1.85; }

/* ---- FOOTER (RTL): newsletter / social already flex; nudge legal row ---- */
body.lang-rtl .tw-footer__legal{ justify-content:flex-start; }

/* ════════════════════════════════════════════════════════════════════════
   TERRITOIRE  (CMS id 11 = Khémisset · id 12 = Bejaâd)  ·  page components
   Wrapper: <section class="twiza-home twiza-territory terr--{terr}"> → reuses
   home primitives (.section full-bleed, .wrap, .eyebrow) + an editorial
   "earth" register below. RTL at the end. Self-hosted fonts only.
   Adapted from Abouhtak/Twiza-new-pages (territory-page.css). Added 2026-06-11.
   ════════════════════════════════════════════════════════════════════════ */

/* ---- palette (default = Khémisset · sable/olive) ---- */
.twiza-territory{
  --sable:#E7DAC1; --sable-2:#F1E8D6; --ecru:#F7F1E5;
  --terre:#6E4B33; --terre-deep:#3A2A1D; --terre-ink:#EDE2CF; --terre-soft:#EBDDC9;
  --olive:#6C6B41; --olive-deep:#535231; --olive-soft:#E7E6D2;
  --font-label:var(--font-head); --font-italic:var(--font-head);
}
/* ---- Bejaâd · crème · terracotta · rose Boujaâd ---- */
.twiza-territory.terr--bejaad{
  --sable:#E8D3BE; --sable-2:#F3E4D2; --ecru:#FAF3E9;
  --terre:#A9492C; --terre-deep:#4E1A18; --terre-ink:#F4E2D2; --terre-soft:#E7C9B8;
  --olive:#BC5B62; --olive-deep:#8C3D49; --olive-soft:#F4DAD9;
}

/* ---- shared editorial heading ---- */
.twiza-territory .tp-head{ display:flex; align-items:baseline; gap:18px; }
.twiza-territory .tp-num{ font-family:var(--font-label); font-size:15px; letter-spacing:.06em; color:var(--terre); opacity:.7; flex:none; }
.twiza-territory .tp-kicker{ font-family:var(--font-label); font-size:13.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--terre); display:inline-flex; align-items:center; gap:14px; }
.twiza-territory .tp-kicker::before{ content:""; width:30px; height:1px; background:var(--terre); opacity:.6; }
.twiza-territory .tp-h2{ font-family:var(--font-head); font-weight:500; font-size:clamp(32px,4.6vw,58px); line-height:1.04; letter-spacing:-.018em; color:var(--ink); margin:22px 0 0; text-wrap:balance; }
.twiza-territory .tp-lead{ color:var(--muted); font-size:clamp(17px,1.5vw,19px); margin-top:20px; max-width:48ch; }

/* ---- 1 · HERO (full-bleed immersive) ---- */
.twiza-territory .tp-hero{ position:relative; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; color:#fff; isolation:isolate; }
.twiza-territory .tp-hero__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.twiza-territory .tp-hero::after{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(25,17,10,.46) 0%, rgba(25,17,10,0) 26%), linear-gradient(0deg, rgba(20,13,7,.82) 0%, rgba(20,13,7,.30) 42%, rgba(20,13,7,0) 70%); }
.twiza-territory .tp-hero__top{ position:absolute; inset-block-start:0; inset-inline:0; z-index:1; padding:104px var(--gutter) 0; display:flex; align-items:center; gap:16px; }
.twiza-territory .tp-hero__loc{ font-family:var(--font-label); font-size:13px; letter-spacing:.28em; text-transform:uppercase; color:rgba(255,255,255,.92); }
.twiza-territory .tp-hero__top .rule{ flex:1; height:1px; background:rgba(255,255,255,.34); }
.twiza-territory .tp-hero__inner{ position:relative; z-index:1; width:min(var(--maxw), 100% - var(--gutter)*2); margin-inline:auto; padding-block-end:clamp(48px,7vh,96px); }
.twiza-territory .tp-hero__eyebrow{ font-family:var(--font-label); font-size:13px; letter-spacing:.3em; text-transform:uppercase; color:var(--orange); display:block; margin-bottom:6px; }
.twiza-territory .tp-hero h1{ font-family:var(--font-head); font-weight:500; font-size:clamp(72px,13vw,184px); line-height:.86; letter-spacing:-.035em; color:#fff; margin:0; }
.twiza-territory .tp-hero__sub{ font-family:var(--font-italic); font-style:italic; font-weight:500; font-size:clamp(24px,3.2vw,40px); line-height:1.15; color:#fff; margin:18px 0 0; letter-spacing:.005em; }
.twiza-territory .tp-hero__desc{ margin:22px 0 0; max-width:46ch; font-size:clamp(16px,1.4vw,18.5px); line-height:1.7; color:rgba(255,255,255,.86); }
.twiza-territory .tp-scroll{ display:inline-flex; align-items:center; gap:11px; margin-top:34px; font-family:var(--font-label); font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.8); }
.twiza-territory .tp-scroll .ln{ width:46px; height:1px; background:rgba(255,255,255,.6); position:relative; overflow:hidden; }
.twiza-territory .tp-scroll .ln::after{ content:""; position:absolute; inset:0; width:18px; background:#fff; animation:tpscroll 2.4s var(--ease) infinite; }
@keyframes tpscroll{ 0%{ transform:translateX(-20px) } 60%,100%{ transform:translateX(48px) } }
@media (prefers-reduced-motion: reduce){ .twiza-territory .tp-scroll .ln::after{ animation:none; } }

/* ---- 2 · HISTOIRE (écru editorial split) ---- */
.twiza-territory .tp-history{ background:var(--ecru); }
.twiza-territory .tp-history__grid{ display:grid; grid-template-columns:1.06fr .94fr; gap:clamp(40px,6vw,96px); align-items:start; margin-top:clamp(40px,5vw,64px); }
.twiza-territory .tp-prose p{ color:#4a4136; font-size:clamp(16.5px,1.45vw,18px); line-height:1.85; }
.twiza-territory .tp-prose p + p{ margin-top:22px; }
.twiza-territory .tp-prose p:first-of-type::first-letter{ font-family:var(--font-head); font-weight:600; float:inline-start; font-size:5.4em; line-height:.78; margin:6px 14px 0 0; color:var(--terre); }
.twiza-territory .tp-figure{ position:sticky; top:104px; margin:0; }
.twiza-territory .tp-figure__media{ position:relative; overflow:hidden; border-radius:6px; box-shadow:var(--shadow); }
.twiza-territory .tp-figure__media img{ width:100%; height:clamp(440px,60vh,620px); object-fit:cover; display:block; }
.twiza-territory .tp-figure__cap{ margin-top:16px; font-family:var(--font-italic); font-style:italic; font-size:18px; color:var(--terre); line-height:1.4; max-width:34ch; }
.twiza-territory .tp-figure__cap::before{ content:""; display:block; width:34px; height:1px; background:var(--olive); margin-bottom:12px; }

/* ---- 3 · FILIÈRES (white card grid) ---- */
.twiza-territory .tp-filieres{ background:#fff; }
.twiza-territory .tp-fgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:clamp(40px,5vw,60px); }
.twiza-territory .tp-fcard{ position:relative; border:1px solid var(--line); border-radius:8px; background:#fff; padding:30px 26px 28px; overflow:hidden; display:flex; flex-direction:column; gap:18px; min-height:184px; transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s; }
.twiza-territory .tp-fcard:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:var(--terre-soft); }
.twiza-territory .tp-fcard__idx{ position:absolute; top:18px; inset-inline-end:22px; font-family:var(--font-label); font-size:13px; color:var(--line); letter-spacing:.05em; }
.twiza-territory .tp-fcard__ic{ width:52px; height:52px; border-radius:50%; flex:none; background:var(--sable-2); color:var(--terre); display:flex; align-items:center; justify-content:center; }
.twiza-territory .tp-fcard__ic svg{ width:26px; height:26px; }
.twiza-territory .tp-fcard h3{ font-family:var(--font-head); font-weight:500; font-size:21px; line-height:1.15; color:var(--ink); letter-spacing:-.01em; margin:0; }
.twiza-territory .tp-fcard--accent{ border-color:transparent; background:linear-gradient(180deg,var(--olive-soft),#fff 78%); }
.twiza-territory .tp-fcard--accent .tp-fcard__ic{ background:var(--olive); color:#fff; }
.twiza-territory .tp-fcard__tag{ display:inline-flex; align-items:center; gap:7px; align-self:flex-start; font-family:var(--font-body); font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--olive-deep); background:#fff; border:1px solid var(--olive-soft); padding:5px 11px; border-radius:100px; margin-top:-4px; }
.twiza-territory .tp-fcard__tag::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--olive); }

/* ---- 4 · FILIÈRE ACCOMPAGNÉE (deep brun-terre band, full-bleed) ---- */
.twiza-territory .tp-feature{ position:relative; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); background:var(--terre-deep); color:var(--terre-ink); overflow:hidden; }
.twiza-territory .tp-feature__grid{ display:grid; grid-template-columns:.92fr 1.08fr; align-items:stretch; width:min(var(--maxw), 100% - var(--gutter)*2); margin-inline:auto; }
.twiza-territory .tp-feature__media{ position:relative; min-height:clamp(420px,62vh,640px); }
.twiza-territory .tp-feature__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.twiza-territory .tp-feature__media::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(58,42,29,0) 60%, var(--terre-deep) 100%); }
.twiza-territory .tp-feature__body{ display:flex; flex-direction:column; justify-content:center; padding:clamp(48px,6vw,88px) clamp(32px,4.5vw,72px); }
.twiza-territory .tp-feature .tp-kicker{ color:var(--sable); }
.twiza-territory .tp-feature .tp-kicker::before{ background:var(--sable); }
.twiza-territory .tp-feature .tp-num{ color:var(--sable); }
.twiza-territory .tp-feature__h2{ font-family:var(--font-head); font-weight:500; font-size:clamp(34px,4.4vw,56px); line-height:1.02; letter-spacing:-.02em; color:#fff; margin:20px 0 0; }
.twiza-territory .tp-feature__badge{ display:inline-flex; align-items:center; gap:9px; align-self:flex-start; margin-top:22px; font-family:var(--font-label); font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--terre-deep); background:var(--olive-soft); padding:8px 15px; border-radius:100px; }
.twiza-territory .tp-feature__badge svg{ width:15px; height:15px; }
.twiza-territory .tp-feature__p{ margin-top:24px; }
.twiza-territory .tp-feature__p p{ color:rgba(237,226,207,.84); font-size:clamp(15.5px,1.35vw,17px); line-height:1.8; max-width:54ch; }
.twiza-territory .tp-feature__p p + p{ margin-top:16px; }
.twiza-territory .tp-feature__quote{ font-family:var(--font-italic); font-style:italic; font-size:clamp(22px,2.5vw,30px); line-height:1.35; color:#fff; margin:30px 0 0; padding-inline-start:22px; border-inline-start:2px solid var(--olive); max-width:30ch; }

/* ---- 5 · IMPACT (écru triptych) ---- */
.twiza-territory .tp-impact{ background:var(--ecru); }
.twiza-territory .tp-impact__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(28px,4vw,56px); margin-top:clamp(44px,5vw,66px); }
.twiza-territory .tp-ib{ padding-top:26px; border-top:1px solid var(--terre-soft); }
.twiza-territory .tp-ib__n{ font-family:var(--font-label); font-size:14px; letter-spacing:.1em; color:var(--terre); opacity:.65; }
.twiza-territory .tp-ib__ic{ width:46px; height:46px; color:var(--olive); margin:18px 0 20px; }
.twiza-territory .tp-ib__ic svg{ width:100%; height:100%; }
.twiza-territory .tp-ib h3{ font-family:var(--font-head); font-weight:500; font-size:clamp(24px,2.4vw,32px); color:var(--ink); letter-spacing:-.01em; margin:0; }
.twiza-territory .tp-ib p{ color:#5a5045; font-size:16px; line-height:1.7; margin-top:14px; max-width:34ch; }

/* ---- 6 · GALERIE (asymmetric) + CTA ---- */
.twiza-territory .tp-gallery{ background:#fff; }
.twiza-territory .tp-ggrid{ display:grid; grid-template-columns:repeat(12,1fr); gap:18px; margin-top:clamp(40px,5vw,60px); }
.twiza-territory .tp-gcard{ position:relative; overflow:hidden; border-radius:8px; isolation:isolate; min-height:280px; display:flex; flex-direction:column; }
.twiza-territory .tp-gcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.twiza-territory .tp-gcard:hover img{ transform:scale(1.05); }
.twiza-territory .tp-gcard::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg, rgba(20,13,7,.72) 0%, rgba(20,13,7,.08) 52%, transparent 80%); }
.twiza-territory .tp-gcard__body{ position:relative; z-index:2; padding:26px; margin-top:auto; }
.twiza-territory .tp-gcard__title{ font-family:var(--font-head); font-weight:500; font-size:clamp(20px,1.9vw,26px); color:#fff; line-height:1.12; }
.twiza-territory .g-a{ grid-column:span 7; grid-row:span 2; min-height:520px; }
.twiza-territory .g-b{ grid-column:span 5; }
.twiza-territory .g-c{ grid-column:span 5; }
.twiza-territory .g-d{ grid-column:span 12; min-height:360px; }
.twiza-territory .tp-cta{ display:flex; flex-direction:column; align-items:center; text-align:center; margin-top:clamp(48px,6vw,76px); }
.twiza-territory .tp-cta p{ font-family:var(--font-italic); font-style:italic; font-size:clamp(20px,2.2vw,28px); color:var(--terre); max-width:26ch; line-height:1.3; margin-bottom:26px; }
.twiza-territory .tp-btn{ display:inline-flex; align-items:center; gap:12px; padding:18px 40px; border-radius:100px; background:var(--accent); color:#fff; font-family:var(--font-body); font-size:15px; font-weight:600; letter-spacing:.01em; box-shadow:0 16px 30px -16px var(--accent); transition:background .3s var(--ease), transform .25s var(--ease), box-shadow .3s; }
.twiza-territory .tp-btn svg{ width:18px; height:18px; transition:transform .35s var(--ease); }
.twiza-territory .tp-btn:hover{ background:var(--accent-deep); transform:translateY(-3px); box-shadow:0 22px 40px -18px var(--accent); }
.twiza-territory .tp-btn:hover svg{ transform:translateX(5px); }

/* ---- RESPONSIVE ---- */
@media (max-width:1080px){
  .twiza-territory .tp-history__grid{ grid-template-columns:1fr; gap:48px; }
  .twiza-territory .tp-figure{ position:static; }
  .twiza-territory .tp-figure__media img{ height:clamp(360px,52vh,520px); }
  .twiza-territory .tp-fgrid{ grid-template-columns:repeat(2,1fr); }
  .twiza-territory .tp-feature__grid{ grid-template-columns:1fr; }
  .twiza-territory .tp-feature__media{ min-height:340px; }
  .twiza-territory .tp-feature__media::after{ background:linear-gradient(0deg, var(--terre-deep) 0%, rgba(58,42,29,0) 55%); }
  .twiza-territory .tp-impact__grid{ grid-template-columns:1fr; gap:0; }
  .twiza-territory .tp-ib{ padding:26px 0; }
  .twiza-territory .tp-ib + .tp-ib{ border-top:1px solid var(--terre-soft); }
  .twiza-territory .g-a,.twiza-territory .g-b,.twiza-territory .g-c,.twiza-territory .g-d{ grid-column:span 12; grid-row:auto; min-height:300px; }
  .twiza-territory .g-a{ min-height:360px; }
}
@media (max-width:560px){
  .twiza-territory .tp-hero__top{ padding-top:92px; }
  .twiza-territory .tp-fgrid{ grid-template-columns:1fr; }
  .twiza-territory .tp-feature__body{ padding:40px 24px 48px; }
}

/* ════════ RTL / Arabic layer for Territoire ════════ */
.twiza-territory[dir="rtl"]{ --font-label:var(--font-head); --font-italic:var(--font-head); }
.twiza-territory[dir="rtl"] .tp-h2,.twiza-territory[dir="rtl"] .tp-hero h1,.twiza-territory[dir="rtl"] .tp-feature__h2{ letter-spacing:0; line-height:1.3; }
.twiza-territory[dir="rtl"] .tp-hero h1{ line-height:1.05; }
.twiza-territory[dir="rtl"] .tp-hero__sub,.twiza-territory[dir="rtl"] .tp-figure__cap,.twiza-territory[dir="rtl"] .tp-feature__quote,.twiza-territory[dir="rtl"] .tp-cta p{ font-style:normal; }
.twiza-territory[dir="rtl"] .tp-prose p:first-of-type::first-letter{ margin:6px 0 0 14px; }
.twiza-territory[dir="rtl"] .tp-feature__media::after{ background:linear-gradient(270deg, rgba(58,42,29,0) 60%, var(--terre-deep) 100%); }
.twiza-territory[dir="rtl"] .tp-scroll .ln::after{ animation:none; }
@media (max-width:1080px){
  .twiza-territory[dir="rtl"] .tp-feature__media::after{ background:linear-gradient(0deg, var(--terre-deep) 0%, rgba(58,42,29,0) 55%); }
}

/* Territoire pages: hero supplies the H1 — hide the redundant CMS page-header */
body.cms-id-11 .page-header,
body.cms-id-12 .page-header{ display:none; }
body.cms-id-11 #content.twiza-territory,
body.cms-id-12 #content.twiza-territory{ margin-top:calc(-1 * var(--gutter, 24px)); }
