/*
Theme Name: Isamoda
Theme URI: https://isamoda.com.co
Author: Isamoda S.A.S.
Description: Tema a medida de Isamoda S.A.S. — dotación empresarial, uniformes y bordados. Replica fielmente el sitio aprobado v1 (estático) con contenido dinámico: catálogo por líneas (CPT producto), carta de telas, sectores, Centro de Dotación (blog) y formularios conectados a WordPress. Requiere el plugin obligatorio "Isamoda Core".
Version: 1.0
License: Propietario
Text Domain: isamoda
*/
/* ============================================================
   ISAMODA · Sistema de diseño (Fase 4)
   Tokens: azules #194184/#0F7CC1/#1FB8EC · Botón primario CTA: azul corporativo #194184 (hover #0F7CC1)
   Tipografía: Gilroy (fallback Poppins) · Móvil-first · WCAG 2.2 AA
   ============================================================ */
:root{
  --navy:#194184; --blue:#0F7CC1; --cyan:#1FB8EC;
  --accent:#D6501E; --accent-hover:#B8410F; --accent-active:#993512; --accent-tint:#F26A21;
  --g0:#ffffff; --g50:#F5F7FA; --g100:#EAEEF3; --g200:#D7DEE7; --g300:#B9C3D0;
  --g400:#8B97A7; --g500:#64707F; --g700:#2E3640; --g900:#14181D;
  --success:#1E9E5A; --warning:#F5A623; --error:#D92D20; --whatsapp:#25D366;
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:24px; --r-pill:999px;
  --sh-sm:0 1px 2px rgba(20,24,29,.06);
  --sh-md:0 4px 12px rgba(20,24,29,.08);
  --sh-lg:0 12px 32px rgba(20,24,29,.12);
  --font:'Gilroy','Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --container:1200px;
  --motion-fast:150ms; --motion-base:250ms;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--g900);background:var(--g50);line-height:1.6;-webkit-font-smoothing:antialiased;font-size:16px}
html,body{overflow-x:hidden}
@supports(overflow:clip){html,body{overflow-x:clip}}
img{max-width:100%;display:block}
a{color:var(--blue)}
a:hover{color:var(--navy)}
h1,h2,h3,h4{color:var(--navy);line-height:1.2;font-weight:800}
h1{font-size:clamp(32px,5vw,44px);letter-spacing:-.5px}
h2{font-size:clamp(26px,3.4vw,34px);font-weight:700}
h3{font-size:clamp(22px,2.6vw,26px);font-weight:700}
h4{font-size:clamp(18px,2vw,20px);font-weight:700}
p{max-width:70ch}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}
.section{padding:56px 0}
@media(min-width:1024px){.section{padding:80px 0}}
.section-head{margin-bottom:36px}
.section-head .overline{color:var(--blue);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.8px;margin-bottom:8px}
.section-head p{color:var(--g500);margin-top:10px;font-size:17px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:12px 20px;z-index:200;border-radius:0 0 var(--r-sm) 0}
.skip-link:focus{left:0;color:#fff}
.weave{background-image:
  repeating-linear-gradient(45deg,rgba(31,184,236,.10) 0 6px,transparent 6px 14px),
  repeating-linear-gradient(-45deg,rgba(25,65,132,.08) 0 6px,transparent 6px 14px)}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font);font-weight:600;font-size:16px;line-height:1;border:2px solid transparent;border-radius:var(--r-md);padding:12px 20px;min-height:44px;cursor:pointer;text-decoration:none;transition:background var(--motion-fast) ease,box-shadow var(--motion-fast) ease;letter-spacing:.2px}
.btn svg{flex:none}
.btn--primary{background:var(--navy);color:#fff}
.btn--primary:hover{background:var(--blue);color:#fff}
.btn--primary:active{background:#0B2A5B}
.btn--secondary{background:#fff;color:var(--navy);border-color:var(--navy)}
.btn--secondary:hover{background:var(--g50);color:var(--navy)}
.btn--ghost{background:transparent;color:var(--blue)}
.btn--ghost:hover{background:var(--g100);color:var(--navy)}
.btn--wa{background:var(--whatsapp);color:#fff}
.btn--wa:hover{filter:brightness(.94);color:#fff}
.btn--sm{min-height:36px;padding:8px 14px;font-size:14px;border-radius:var(--r-sm)}
.btn--lg{min-height:52px;padding:15px 28px;font-size:17px}
.btn--block{width:100%}
.btn.is-loading{color:transparent!important;position:relative;pointer-events:none}
.btn.is-loading::after{content:"";position:absolute;width:18px;height:18px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
[hidden]{display:none!important}
.btn--icon{padding:10px;border-radius:var(--r-pill)}

/* ---------- Chips y badges ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--g50);border:1px solid var(--g200);color:var(--g700);font-size:13px;padding:6px 14px;border-radius:var(--r-pill);cursor:pointer;font-family:var(--font)}
.chip[aria-pressed="true"],.chip.active{border-color:var(--blue);color:var(--navy);background:#eaf4fb;font-weight:600}
.badge{display:inline-block;font-size:12px;font-weight:600;padding:4px 10px;border-radius:var(--r-pill)}
.badge--min{background:#eaf4fb;color:var(--navy)}
.badge--hot{background:var(--accent);color:#fff}

/* ---------- Header ---------- */
.topbar-envio{background:var(--navy);color:#dce7f4;font-size:13px;text-align:center;padding:7px 16px}
.topbar-envio strong{color:#fff}
.site-header{position:sticky;top:0;z-index:90;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--g200);transition:box-shadow var(--motion-base) ease}
.site-header.is-scrolled{box-shadow:var(--sh-md)}
.header-inner{display:flex;align-items:center;gap:20px;min-height:72px}
.logo img{height:44px;width:auto}
.main-nav{display:flex;gap:4px;margin-left:8px}
.main-nav>li{list-style:none;position:relative}
.main-nav a.nav-link,.main-nav button.nav-link{display:flex;align-items:center;gap:6px;background:none;border:0;font-family:var(--font);font-size:15px;font-weight:500;color:var(--g700);text-decoration:none;padding:10px 14px;border-radius:var(--r-sm);cursor:pointer;min-height:44px}
.main-nav a.nav-link:hover,.main-nav button.nav-link:hover{color:var(--navy);background:var(--g50)}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:10px}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--r-pill);border:0;background:transparent;color:var(--g700);cursor:pointer;position:relative}
.icon-btn:hover{background:var(--g100);color:var(--navy)}
.icon-btn .cart-count{position:absolute;top:2px;right:0;background:var(--accent);color:#fff;font-size:11px;font-weight:700;min-width:18px;height:18px;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center;padding:0 4px}
.hamburger{display:none}
/* Mega menú */
.mega{position:absolute;left:50%;transform:translateX(-50%) translateY(8px);top:100%;width:min(860px,calc(100vw - 40px));background:#fff;border:1px solid var(--g200);border-radius:var(--r-lg);box-shadow:var(--sh-lg);padding:24px;display:none;grid-template-columns:1fr 1fr 1fr 220px;gap:24px;opacity:0;transition:opacity var(--motion-base) ease,transform var(--motion-base) ease}
.has-mega:hover .mega,.has-mega:focus-within .mega,.has-mega.is-open .mega{display:grid;opacity:1;transform:translateX(-50%) translateY(0)}
.mega h4{font-size:12px;text-transform:uppercase;letter-spacing:.8px;color:var(--g400);margin-bottom:12px}
.mega ul{list-style:none;display:grid;gap:2px}
.mega ul a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r-sm);text-decoration:none;color:var(--g700);font-size:14.5px;font-weight:500}
.mega ul a:hover{background:var(--g50);color:var(--navy)}
.mega ul a svg{color:var(--blue);flex:none}
.mega-feature{border-radius:var(--r-md);overflow:hidden;position:relative;min-height:200px;display:flex;align-items:flex-end;text-decoration:none}
.mega-feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mega-feature span{position:relative;background:rgba(25,65,132,.82);color:#fff;font-size:13px;font-weight:600;padding:8px 12px;margin:10px;border-radius:var(--r-sm);width:calc(100% - 20px);text-align:center}
/* Buscador header */
.header-search{display:flex;align-items:center}
.header-search input{width:0;opacity:0;border:1px solid var(--g200);border-radius:var(--r-pill);padding:9px 16px;font-family:var(--font);font-size:14px;transition:width var(--motion-base) ease,opacity var(--motion-base) ease}
.header-search.is-open input{width:220px;opacity:1;margin-right:6px}
.header-search input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(15,124,193,.15)}
@media(max-width:1023px){
  .main-nav,.header-search,.header-actions .btn{display:none}
  .hamburger{display:inline-flex}
}
/* Menú móvil */
.mobile-nav{position:fixed;inset:0;z-index:120;background:#fff;display:none;flex-direction:column;padding:20px;overflow:auto}
.mobile-nav.is-open{display:flex}
.mobile-nav a{color:var(--g700);text-decoration:none;font-size:18px;font-weight:600;padding:14px 4px;border-bottom:1px solid var(--g100)}
.mobile-nav a:hover{color:var(--navy)}
.mobile-nav .close-nav{align-self:flex-end}
/* Barra inferior móvil */
.mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:100;display:none;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid var(--g200);box-shadow:0 -4px 16px rgba(20,24,29,.08)}
.mobile-bar .btn{flex:1}
@media(max-width:1023px){.mobile-bar{display:flex}body{padding-bottom:74px}}

/* ---------- Hero ---------- */
.hero{background:linear-gradient(135deg,#eaf4fb 0%,var(--g50) 55%,#fff 100%);overflow:hidden}
.hero-grid{display:grid;gap:32px;align-items:center;padding:48px 0}
@media(min-width:1024px){.hero-grid{grid-template-columns:1.05fr .95fr;padding:64px 0}}
.hero h1{margin-bottom:16px}
.hero .lead{font-size:18px;color:var(--g700);margin-bottom:28px;max-width:54ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:26px}
.hero-media{position:relative}
.hero-media img{width:100%;height:100%;max-height:560px;object-fit:cover;border-radius:var(--r-xl);box-shadow:var(--sh-lg)}
.hero-card{position:absolute;left:16px;bottom:16px;background:rgba(255,255,255,.94);border-radius:var(--r-md);box-shadow:var(--sh-md);padding:12px 16px;font-size:13.5px;font-weight:600;color:var(--navy)}
.trust-strip{display:flex;flex-wrap:wrap;gap:10px;padding-bottom:40px}
.trust-strip span{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--g700);background:#fff;border:1px solid var(--g200);padding:8px 14px;border-radius:var(--r-pill)}
.trust-strip svg{color:var(--blue)}

/* ---------- Hero banner (portada estilo referencia) ---------- */
.hero-banner{position:relative;background:linear-gradient(90deg,#e9f2fb 0%,#e9f2fb 34%,rgba(255,255,255,.95) 46%,rgba(255,255,255,.8) 60%,rgba(255,255,255,0) 80%),url(assets/img/equipo-dotacion-empresarial.webp) right top/cover no-repeat,var(--g50);overflow:hidden}
.hero-banner-inner{max-width:700px;padding:96px 0}
.hero-kicker{display:flex;align-items:center;gap:10px;color:var(--accent);font-weight:700;font-size:12.5px;letter-spacing:1.4px;text-transform:uppercase;margin-bottom:18px}
.kicker-dash{width:34px;height:3px;background:var(--accent);border-radius:2px;flex:none}
.hero-banner h1{font-size:clamp(30px,4.4vw,52px);margin-bottom:18px}
.hero-banner .hero-lead{font-size:17.5px;color:var(--g700);max-width:52ch;margin-bottom:28px}
.hero-banner .hero-cta{margin-bottom:8px}
.hero-checks{list-style:none;display:flex;flex-wrap:wrap;gap:10px 22px;margin:22px 0 0;padding:0}
.hero-checks li{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--g700)}
.hero-checks svg{color:var(--blue);flex:none}
@media(max-width:900px){.hero-banner{background:linear-gradient(90deg,rgba(233,242,251,.96) 0%,rgba(233,242,251,.9) 100%),url(assets/img/equipo-dotacion-empresarial.webp) right top/cover no-repeat,var(--g50)}.hero-banner-inner{padding:56px 0}}
@media(max-width:560px){.hero-banner-inner{padding:44px 0}}

/* ---------- Banda de cifras (confianza en números) ---------- */
.stats-band{background:linear-gradient(135deg,var(--navy),#0f2a5c);color:#fff;position:relative;overflow:hidden}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:32px 24px;padding:44px 0;position:relative}
@media(min-width:1024px){.stats-grid{grid-template-columns:repeat(4,1fr);padding:52px 0}}
.stat{text-align:center}
.stat-num{font-size:clamp(34px,4.5vw,48px);font-weight:800;color:var(--accent-tint);line-height:1.1;letter-spacing:-.5px}
.stat-label{font-size:14px;color:#cfe0f2;margin:8px auto 0;max-width:26ch;line-height:1.45}

/* ---------- Enfoque de rostros: el recorte object-fit:cover no debe cortar cabezas ---------- */
img[src*="docente-camisa-blanca-colegio"],
img[src*="uniforme-administrativo-dama"],
img[src*="chaqueta-chef-delantal"],
img[src*="estudiantes-uniforme-colegio"],
img[src*="delantales-hotelera-pareja"],
img[src*="delantal-profesional-negro"],
img[src*="uniformes-meseros-restaurante"],
img[src*="camisa-corporativa-hombre"],
img[src*="blusa-administrativa-dama"],
img[src*="chaqueta-corporativa-isamoda"],
img[src*="casaca-asistencial-dama"],
img[src*="polo-blanco-unisex"],
img[src*="camiseta-estampada-dtf"],
img[src*="sudadera-institutional-dama"],
img[src*="camisa-administrativa-manga-larga"],
img[src*="camisa-administrativa-manga-corta"],
img[src*="chaqueta-corporativa"],
img[src*="bata-antifluido"],
img[src*="uniforme-hospitalario"],
img[src*="chaqueta-de-chef"],
img[src*="polo-institucional"]{object-position:center top}

/* ---------- Cards ---------- */
.grid-cards{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:640px){.grid-cards{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid-cards.cols-3{grid-template-columns:repeat(3,1fr)}.grid-cards.cols-4{grid-template-columns:repeat(4,1fr)}}
.card{background:#fff;border:1px solid var(--g200);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh-sm);transition:box-shadow var(--motion-fast) ease,transform var(--motion-fast) ease;display:flex;flex-direction:column}
.card:hover{box-shadow:var(--sh-md);transform:translateY(-2px)}
.card-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--g100)}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform var(--motion-base) ease}
.card:hover .card-media img{transform:scale(1.04)}
.card-media .badge{position:absolute;top:12px;left:12px;z-index:2}
.card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--g400);font-size:13px;font-weight:600;text-align:center;padding:20px}
.card-body{padding:16px;display:flex;flex-direction:column;gap:10px;flex:1}
.card-body h3,.card-body h4{font-size:17px}
.card-body h3 a,.card-body h4 a{color:inherit;text-decoration:none}
.card-body h3 a:hover,.card-body h4 a:hover{color:var(--accent)}
.card-body .desc{font-size:14px;color:var(--g500);flex:1}
.card-actions{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.card-actions .btn--ghost{align-self:flex-start;padding-left:0;min-height:36px}
/* Card línea con imagen superior y flecha */
.card-linea .card-body{display:flex;flex-direction:column;gap:10px}
.card-linea .linea-prependas{list-style:none;display:grid;gap:4px;margin:2px 0 4px}
.card-linea .linea-prependas li{font-size:14px;color:var(--g700);padding-left:18px;position:relative}
.card-linea .linea-prependas li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:2px;background:var(--cyan)}
.card-linea .card-body .btn-row{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px}
.card-linea .card-body .btn{font-size:14.5px}
.card-linea .card-body .btn--ghost{border:2px solid var(--blue);color:var(--blue);font-weight:700}
.card-linea .card-body .btn--ghost:hover{background:var(--blue);color:#fff}
.hero-quienes{font-size:14.5px;color:var(--g700);max-width:52ch;border-left:3px solid var(--cyan);padding-left:12px;margin:14px 0 18px}
.hero-quienes a{font-weight:700;white-space:nowrap}
.chips--sectores .chip{font-size:15px;padding:10px 20px;background:#fff;text-decoration:none}
.chips--sectores .chip:hover{border-color:var(--blue);color:var(--navy)}
.card-linea .card-body .arrow:hover{color:var(--accent)}

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{font-size:13px;color:var(--g500);padding:18px 0 0;display:flex;flex-wrap:wrap;gap:6px;list-style:none}
.breadcrumbs li{display:flex;gap:6px;align-items:center}
.breadcrumbs a{color:var(--blue);text-decoration:none}
.breadcrumbs a:hover{text-decoration:underline}
.breadcrumbs li[aria-current]{color:var(--g700);font-weight:600}

/* ---------- Página de línea / sector ---------- */
.page-hero{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.page-hero .weave-bg{position:absolute;inset:0;opacity:.5}
.page-hero-inner{position:relative;padding:56px 0;display:grid;gap:24px}
@media(min-width:1024px){.page-hero-inner{grid-template-columns:1.2fr .8fr;align-items:center}}
.page-hero h1{color:#fff;margin-bottom:14px}
.page-hero p{color:#cfe0f2;font-size:17px;max-width:60ch}
.page-hero .btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.page-hero img{border-radius:var(--r-lg);box-shadow:var(--sh-lg);max-height:340px;width:100%;object-fit:cover}
.breadcrumbs.on-dark,.breadcrumbs.on-dark a{color:#bcd2ea}
.breadcrumbs.on-dark li[aria-current]{color:#fff}

/* ---------- Catálogo: filtros + grid ---------- */
.catalog-layout{display:grid;gap:28px;padding-bottom:64px}
@media(min-width:1024px){.catalog-layout{grid-template-columns:250px 1fr;align-items:start}}
.filters{background:#fff;border:1px solid var(--g200);border-radius:var(--r-md);padding:20px;position:sticky;top:92px}
.filters h3{font-size:14px;text-transform:uppercase;letter-spacing:.6px;margin:18px 0 10px}
.filters h3:first-child{margin-top:0}
.filters .chip{margin:0 6px 8px 0}
.filters-actions{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.filters-toggle{display:none}
@media(max-width:1023px){
  .filters{position:fixed;inset:auto 0 0 0;z-index:130;border-radius:var(--r-lg) var(--r-lg) 0 0;max-height:82vh;overflow:auto;transform:translateY(105%);transition:transform var(--motion-base) ease;box-shadow:var(--sh-lg)}
  .filters.is-open{transform:translateY(0)}
  .filters-toggle{display:inline-flex}
}
.scrim{position:fixed;inset:0;background:rgba(20,24,29,.45);z-index:125;display:none}
.scrim.is-open{display:block}
.results-meta{font-size:14px;color:var(--g500);margin-bottom:16px}

/* ---------- Ficha de producto ---------- */
.product-layout{display:grid;gap:36px;padding:12px 0 64px}
@media(min-width:1024px){.product-layout{grid-template-columns:1fr 1fr;align-items:start}}
.product-gallery{background:#fff;border:1px solid var(--g200);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-sm)}
.product-gallery img{width:100%;max-height:600px;object-fit:cover}
.product-gallery img[src*="pantalon-de-vestir"],
.product-gallery img[src*="pantalon-escolar"],
.product-gallery img[src*="pantalon-de-trabajo"]{object-fit:contain;background:#f7f7f7;max-height:640px}
.product-gallery .card-placeholder{aspect-ratio:4/5}
.product-info h1{font-size:clamp(26px,3.4vw,34px);margin:6px 0 14px}
.product-info .desc{color:var(--g700);margin-bottom:20px;font-size:17px}
.spec-group{margin-bottom:18px}
.spec-group .label{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--g500);margin-bottom:8px}
.spec-group .value{color:var(--g700)}
.spec-group a{color:var(--blue)}
.product-ctas{display:grid;gap:10px;margin:24px 0;max-width:420px}
.related{padding-bottom:64px}

/* ---------- Telas ---------- */
.tela-swatch{height:120px;border-radius:var(--r-sm);margin-bottom:12px;border:1px solid var(--g200)}
.tela-patterns .card-body h4{font-size:16px}
/* Mini muestras de tela (CSS puro, tonos referenciales) */
.tk-antifluido{background:linear-gradient(135deg,#eef6fb,#dcebF5)}
.tk-drill{background:repeating-linear-gradient(45deg,#3d5a80 0 4px,#355072 4px 8px)}
.tk-gabardina{background:repeating-linear-gradient(115deg,#54719c 0 3px,#4a658c 3px 6px)}
.tk-oxford{background:repeating-linear-gradient(0deg,#e8eef5 0 2px,#dde6f0 2px 4px),repeating-linear-gradient(90deg,#e8eef5 0 2px,#dde6f0 2px 4px)}
.tk-popelina{background:linear-gradient(135deg,#f4f7fb,#e9eff6)}
.tk-ripstop{background:repeating-linear-gradient(0deg,#6b7f9e 0 10px,#5d7191 10px 11px),repeating-linear-gradient(90deg,#6b7f9e 0 10px,#5d7191 10px 11px)}
.tk-canvas{background:repeating-linear-gradient(90deg,#c9b48a 0 2px,#c0aa7e 2px 4px)}
.tk-sarga{background:repeating-linear-gradient(45deg,#31435f 0 3px,#2b3c56 3px 6px)}
.tk-jean{background:repeating-linear-gradient(90deg,#33517e 0 2px,#2d4871 2px 4px)}
.tk-lona{background:repeating-linear-gradient(0deg,#8a93a3 0 3px,#7e8797 3px 6px)}
.tk-polilana{background:linear-gradient(135deg,#f7f4ef,#eee8dc)}
.tk-algodon{background:linear-gradient(135deg,#fbfaf7,#f1ede4)}

/* ---------- Pilares / pasos / cobertura ---------- */
.pillars{display:grid;gap:20px}
@media(min-width:768px){.pillars{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.pillars{grid-template-columns:repeat(4,1fr)}}
.pillar{background:#fff;border:1px solid var(--g200);border-radius:var(--r-md);padding:24px;box-shadow:var(--sh-sm)}
.pillar .icon{width:48px;height:48px;border-radius:var(--r-md);background:#eaf4fb;color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.pillar h3{font-size:19px;margin-bottom:8px}
.pillar p{font-size:15px;color:var(--g500)}
.steps{display:grid;gap:20px;counter-reset:paso}
@media(min-width:768px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{background:#fff;border:1px solid var(--g200);border-radius:var(--r-md);padding:24px;position:relative;box-shadow:var(--sh-sm)}
.step::before{counter-increment:paso;content:counter(paso);display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--r-pill);background:var(--accent);color:#fff;font-weight:800;font-size:17px;margin-bottom:12px}
.step h3{font-size:18px;margin-bottom:6px}
.step p{font-size:15px;color:var(--g500)}

/* ---------- Banner personalización / CTA final ---------- */
.banner-split{background:var(--navy);border-radius:var(--r-xl);overflow:hidden;display:grid;color:#fff;position:relative}
@media(min-width:1024px){.banner-split{grid-template-columns:1.1fr .9fr}}
.banner-split .content{padding:40px 32px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
@media(min-width:1024px){.banner-split .content{padding:48px}}
.banner-split h2{color:#fff;margin-bottom:12px}
.banner-split p{color:#cfe0f2;margin-bottom:24px}
.banner-split img{width:100%;height:100%;min-height:280px;max-height:460px;object-fit:cover;object-position:center 35%}
.cta-final{background:linear-gradient(135deg,var(--navy),#0f2a5c);border-radius:var(--r-xl);color:#fff;text-align:center;padding:56px 24px;position:relative;overflow:hidden}
.cta-final h2{color:#fff;margin-bottom:12px}
.cta-final p{color:#cfe0f2;margin:0 auto 28px}
.cta-final .btn-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---------- FAQ ---------- */
.faq{max-width:820px}
.faq-item{background:#fff;border:1px solid var(--g200);border-radius:var(--r-md);margin-bottom:10px;overflow:hidden}
.faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;list-style:none;padding:18px 20px;font-weight:600;font-size:16px;color:var(--g900);min-height:44px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .chev{flex:none;color:var(--blue);transition:transform var(--motion-fast) ease}
.faq-item[open] summary .chev{transform:rotate(180deg)}
.faq-item .faq-a{padding:0 20px 18px;color:var(--g700);font-size:15px}

/* ---------- Formularios ---------- */
.form-card{background:#fff;border:1px solid var(--g200);border-radius:var(--r-lg);padding:28px;box-shadow:var(--sh-md)}
.field{margin-bottom:16px}
.field label{display:block;font-size:13.5px;font-weight:600;color:var(--g700);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;font-family:var(--font);font-size:15px;padding:12px 14px;border:1px solid var(--g200);border-radius:var(--r-md);background:#fff;color:var(--g900);min-height:44px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(15,124,193,.15)}
.field .hint{font-size:12.5px;margin-top:6px;color:var(--g500)}
.field.has-error input,.field.has-error select{border-color:var(--error)}
.field.has-error .hint{color:var(--error)}
.field.is-ok input{border-color:var(--success)}
.check-row{display:flex;gap:10px;align-items:flex-start;margin:16px 0}
.check-row input{width:20px;height:20px;margin-top:2px;accent-color:var(--accent);flex:none}
.check-row label{font-size:13.5px;color:var(--g700)}
.form-note{font-size:13px;color:var(--g500);margin-top:14px;text-align:center}
.quote-summary{background:var(--g50);border:1px dashed var(--g300);border-radius:var(--r-md);padding:14px 16px;margin-bottom:18px;font-size:14px}
.quote-summary ul{list-style:none;margin-top:8px;display:grid;gap:4px}
.quote-summary .empty{color:var(--g500);font-style:italic}

/* ---------- Drawer "Mi cotización" ---------- */
.quote-fab{position:fixed;right:20px;bottom:20px;z-index:110;display:inline-flex;align-items:center;gap:8px;background:var(--navy);color:#fff;border:0;border-radius:var(--r-pill);padding:12px 18px;font-family:var(--font);font-weight:600;font-size:14.5px;cursor:pointer;box-shadow:var(--sh-lg);min-height:48px}
.quote-fab:hover{background:#122f66}
.quote-fab .cart-count{background:var(--accent);border-radius:var(--r-pill);min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:800}
@media(max-width:1023px){.quote-fab{bottom:86px;right:14px;padding:12px 14px}}
.quote-drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,100vw);background:#fff;z-index:140;box-shadow:var(--sh-lg);transform:translateX(105%);transition:transform var(--motion-base) ease;display:flex;flex-direction:column}
.quote-drawer.is-open{transform:translateX(0)}
.quote-drawer header{display:flex;align-items:center;justify-content:space-between;background:var(--navy);color:#fff;padding:16px 20px;font-weight:700;font-size:17px}
.quote-drawer header button{background:none;border:0;color:#fff;cursor:pointer;width:40px;height:40px;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center}
.quote-drawer header button:hover{background:rgba(255,255,255,.14)}
.quote-items{flex:1;overflow:auto;padding:12px 20px}
.quote-item{display:flex;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--g100)}
.quote-item .thumb{width:52px;height:52px;border-radius:var(--r-sm);object-fit:cover;background:var(--g100);flex:none}
.quote-item .meta{flex:1;min-width:0}
.quote-item .name{font-size:14.5px;font-weight:600;color:var(--g900);line-height:1.3}
.quote-item .variant{font-size:12.5px;color:var(--g500)}
.stepper{display:flex;align-items:center;gap:8px;margin-top:6px}
.stepper button{width:28px;height:28px;border:1px solid var(--g200);background:#fff;border-radius:6px;font-size:15px;font-weight:700;color:var(--navy);cursor:pointer;line-height:1}
.stepper button:hover{background:var(--g50)}
.stepper .qty{min-width:26px;text-align:center;font-weight:700;font-size:14px}
.quote-item .remove{background:none;border:0;color:var(--g400);cursor:pointer;width:36px;height:36px;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center}
.quote-item .remove:hover{color:var(--error);background:var(--g50)}
.quote-empty{text-align:center;padding:48px 20px;color:var(--g500)}
.quote-empty svg{color:var(--g300);margin-bottom:12px}
.quote-drawer footer{border-top:1px solid var(--g200);padding:16px 20px;display:grid;gap:10px}
.quote-drawer footer .total{font-size:14px;font-weight:600;color:var(--g700);text-align:center}

/* ---------- WhatsApp flotante ---------- */
.wa-fab{position:fixed;right:20px;bottom:86px;z-index:110;display:inline-flex;align-items:center;gap:8px;background:var(--whatsapp);color:#fff;text-decoration:none;font-weight:700;font-size:14.5px;border-radius:var(--r-pill);padding:13px 20px;box-shadow:var(--sh-lg);min-height:48px}
.wa-fab:hover{filter:brightness(.94);color:#fff}
@media(max-width:1023px){.wa-fab{display:none}}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy);color:#cfe0f2;position:relative;overflow:hidden}
.site-footer .weave-bg{position:absolute;inset:0;opacity:.35}
.footer-grid{position:relative;display:grid;gap:36px;padding:56px 0 40px}
@media(min-width:768px){.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.footer-grid{grid-template-columns:1.3fr 1fr 1fr 1.2fr}}
.footer-col h4{color:#fff;font-size:14px;text-transform:uppercase;letter-spacing:.8px;margin-bottom:16px}
.footer-col ul{list-style:none;display:grid;gap:10px}
.footer-col a{color:#cfe0f2;text-decoration:none;font-size:14.5px}
.footer-col a:hover{color:#fff;text-decoration:underline}
.footer-brand img{height:40px;width:auto;margin-bottom:16px}
.footer-brand p{font-size:14px;max-width:34ch}
.footer-contact li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px}
.footer-contact svg{flex:none;color:var(--cyan);margin-top:3px}
.footer-bottom{position:relative;border-top:1px solid rgba(255,255,255,.15);padding:20px 0;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;font-size:13px}
.footer-bottom nav{display:flex;gap:18px;flex-wrap:wrap}
.footer-bottom a{color:#cfe0f2;text-decoration:none}
.footer-bottom a:hover{color:#fff}

/* ---------- Blog ---------- */
.blog-layout{display:grid;gap:36px}
@media(min-width:1024px){.article-layout{grid-template-columns:1fr 300px;align-items:start}}
.article-body{font-size:17px;color:var(--g700);display:grid;gap:18px}
.article-body h2{margin-top:14px}
.article-body ul,.article-body ol{padding-left:22px;display:grid;gap:8px}
.article-body .cta-box{background:#eaf4fb;border-left:4px solid var(--blue);border-radius:var(--r-sm);padding:18px 20px;font-size:15.5px}
.article-table{width:100%;border-collapse:collapse;font-size:15px;background:#fff;border-radius:var(--r-sm);overflow:hidden}
.article-table th{background:var(--navy);color:#fff;text-align:left;padding:10px 14px;font-size:14px}
.article-table td{padding:10px 14px;border-bottom:1px solid var(--g100)}
.article-side{position:sticky;top:96px;display:grid;gap:20px}
.toc{background:#fff;border:1px solid var(--g200);border-radius:var(--r-md);padding:18px;font-size:14px}
.toc h4{font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:var(--g400);margin-bottom:10px}
.toc a{display:block;color:var(--g700);text-decoration:none;padding:5px 0}
.toc a:hover{color:var(--blue)}
.side-cta{background:var(--navy);color:#fff;border-radius:var(--r-md);padding:20px;font-size:14.5px}
.side-cta h4{color:#fff;font-size:16px;margin-bottom:8px}
.side-cta p{color:#cfe0f2;margin-bottom:14px;font-size:14px}

/* ---------- Utilidades ---------- */
.bg-white{background:#fff}
.bg-navy{background:var(--navy)}
.text-center{text-align:center}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.two-col{display:grid;gap:36px}
@media(min-width:1024px){.two-col{grid-template-columns:1fr 1fr;align-items:center}}
.check-list{list-style:none;display:grid;gap:12px}
.check-list li{display:flex;gap:12px;align-items:flex-start;color:var(--g700)}
.check-list svg{flex:none;color:var(--success);margin-top:4px}
.notice{background:#fdf1e3;border:1px solid #f5d9b8;color:#7a4a00;border-radius:var(--r-md);padding:14px 18px;font-size:14px}
.map-embed{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--g200);box-shadow:var(--sh-sm)}
.map-embed iframe{width:100%;height:340px;border:0;display:block}

/* ---------- Banner cookies ---------- */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:150;background:#fff;border:1px solid var(--g200);border-radius:var(--r-lg);box-shadow:var(--sh-lg);padding:20px;display:none;gap:14px;max-width:560px}
.cookie-banner.is-visible{display:flex;flex-direction:column}
@media(min-width:640px){.cookie-banner{left:auto;right:20px;bottom:20px}}
.cookie-banner p{font-size:14px;color:var(--g700)}
.cookie-banner .actions{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- Gracias / 404 ---------- */
.state-page{max-width:680px;margin:0 auto;text-align:center;padding:72px 20px}
.state-page .icon-lg{width:80px;height:80px;border-radius:var(--r-pill);background:#eaf4fb;color:var(--blue);display:flex;align-items:center;justify-content:center;margin:0 auto 24px}
.state-page h1{margin-bottom:14px}
.state-page p{color:var(--g500);margin:0 auto 28px;font-size:17px}
.state-page .btn-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---------- Animación de aparición ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ---------- Impresión de ficha ---------- */
@media print{.site-header,.site-footer,.mobile-bar,.quote-fab,.wa-fab,.cookie-banner,.product-ctas{display:none!important}}

/* Honeypot antispam: oculto para personas, fuera del flujo visual */
.hp-field{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden}
