/* Mediterránea · páginas interiores. Cada página tiene su propio lenguaje de movimiento:
   Empresa = máscara · Qué hacemos = lateral · Productos = escala y giro · Contacto = desenfoque.
   Todo movimiento depende de html.mx-motion. */

/* ---------- Revelados propios de cada página ---------- */
.mx-motion body[data-page='company'] .rv { opacity:0; transform:none; clip-path:inset(0 0 55% 0); transition:opacity .9s ease,clip-path 1.4s var(--ease); transition-delay:calc(var(--i,0) * 110ms); }
.mx-motion body[data-page='company'] .rv.in { opacity:1; clip-path:inset(-40px -40px -80px -40px); }
.mx-motion body[data-page='services'] .rv { transform:translateX(-56px); }
.mx-motion body[data-page='services'] .rv.in { transform:none; }
.mx-motion body[data-page='products'] .rv { transform:scale(.93); transform-origin:50% 100%; }
.mx-motion body[data-page='products'] .rv.in { transform:none; }
.mx-motion body[data-page='contact'] .rv { transform:none; filter:blur(14px); transition:opacity 1s var(--ease),filter 1.2s var(--ease); }
.mx-motion body[data-page='contact'] .rv.in { filter:none; }

.mediterranean .breadcrumb { font-size:12px; }

/* ================= EMPRESA ================= */
.cx-hero { position:relative; overflow:hidden; padding-block:30px 96px; background:radial-gradient(70% 80% at 90% 30%,#e9edde,transparent 65%),var(--bg); border-bottom:1px solid var(--line); }
.cx-hero-grid { display:grid; grid-template-columns:1fr 1.05fr; gap:60px; align-items:center; margin-top:34px; }
.cx-hero-copy h1 { font:500 clamp(46px,5.2vw,84px)/1 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.062em; margin:24px 0 26px; }
.cx-hero-copy h1 em { color:var(--accent); }
.cx-hero-copy .lead { max-width:50ch; }
.cx-facts { display:grid; grid-template-columns:repeat(3,auto); justify-content:start; gap:10px 40px; margin:34px 0 0; padding-top:22px; border-top:1px solid var(--line); }
.cx-facts dt { font-size:10px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--earth); }
.cx-facts dd { margin:5px 0 0; font:600 15px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.01em; }
.cx-year-wrap { position:relative; text-align:right; }
.cx-year { position:relative; margin:0; font:500 clamp(150px,19.5vw,320px)/.82 'Fraunces','Fraunces Fallback',Georgia,serif; letter-spacing:-.065em; color:var(--accent); background:url(images/mediterranean/familia-conservas.webp) 30% 40%/140% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; padding-right:.04em; }
.cx-year::after { content:'2000'; position:absolute; inset:0; padding-right:.04em; -webkit-text-fill-color:transparent; -webkit-text-stroke:1px rgba(39,88,61,.28); transform:translate(.06em,.05em); z-index:-1; }
.mx-motion .cx-year { animation:cx-year-in 1.8s var(--ease) .1s both,cx-drift 22s ease-in-out 2s infinite alternate; }
@keyframes cx-year-in { from { opacity:0; letter-spacing:.12em; filter:blur(16px); } }
@keyframes cx-drift { to { background-position:70% 60%; } }
.cx-year-caption { display:inline-block; margin-top:18px; padding-left:16px; border-left:2px solid var(--citrus); font-size:14px; line-height:1.6; color:var(--muted); max-width:32ch; text-align:left; }

.cx-manifesto { padding-block:130px; }
.cx-words { margin-top:28px; max-width:26ch; font:500 clamp(32px,3.9vw,60px)/1.18 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.045em; }
.cx-words .w { color:#c5cdbf; transition:color .45s ease; }
.cx-words .w.on { color:var(--ink); }
.cx-words .w.em.on { color:var(--accent); font-family:'Fraunces','Fraunces Fallback',serif; font-style:italic; font-weight:400; }

.cx-story-grid { display:grid; grid-template-columns:1.05fr 1fr; gap:80px; align-items:center; }
.cx-curtain { position:relative; overflow:hidden; border-radius:10px; aspect-ratio:1; max-height:600px; }
.cx-curtain img { width:100%; height:100%; object-fit:cover; }
.cx-curtain-panel { position:absolute; inset:0; background:var(--accent); transform-origin:100% 50%; transform:scaleX(0); }
.mx-motion .cx-curtain-panel { transform:scaleX(1); transition:transform 1.3s cubic-bezier(.77,0,.18,1) .15s; }
.mx-motion .cx-curtain img { transform:scale(1.25); transition:transform 2s var(--ease) .3s; }
.mx-motion .cx-curtain.in .cx-curtain-panel { transform:scaleX(0); }
.mx-motion .cx-curtain.in img { transform:none; }
.cx-story-copy h2 { margin:20px 0 24px; }
.cx-story-copy p { color:var(--muted); font-size:15.5px; line-height:1.85; margin-top:14px; }

.cx-values { background:var(--soft); }
.cx-tilt-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; perspective:1200px; }
.cx-tilt-inner { position:relative; height:100%; background:#fff; border:1px solid #e0e5d8; border-radius:22px; overflow:hidden; transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .6s var(--ease),box-shadow .6s; transform-style:preserve-3d; }
.cx-tilt:hover .cx-tilt-inner { box-shadow:0 40px 70px -40px rgba(15,43,33,.55); transition:transform .15s linear,box-shadow .6s; }
.cx-tilt figure { margin:0; aspect-ratio:4/3; overflow:hidden; }
.cx-tilt figure img { width:100%; height:100%; object-fit:cover; }
.cx-tilt-body { position:relative; padding:26px 28px 30px; }
.cx-tilt-n { position:absolute; right:24px; top:-34px; width:62px; height:62px; border-radius:50%; display:grid; place-items:center; background:var(--citrus); color:var(--deep); font:500 24px 'Fraunces','Fraunces Fallback',serif; box-shadow:0 10px 24px -10px rgba(15,43,33,.5); }
.cx-tilt .kicker { color:var(--earth); font-size:10px; font-weight:700; }
.cx-tilt h3 { font:600 25px/1.15 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.04em; margin-top:8px; }
.cx-tilt p { color:var(--muted); font-size:14px; line-height:1.7; margin-top:10px; }
.cx-glare { position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.45),transparent 45%); opacity:0; transition:opacity .4s; mix-blend-mode:soft-light; }
.cx-tilt:hover .cx-glare { opacity:1; }

.cx-proof .section-heading h2 { max-width:20ch; }

/* ================= QUÉ HACEMOS ================= */
.sx-hero { position:relative; overflow:hidden; padding-block:30px 100px; background:radial-gradient(60% 80% at 85% 20%,#1f4a39,transparent 70%),var(--deep); color:var(--cream); }
.sx-hero .breadcrumb,.sx-hero .breadcrumb a { color:#c9d8cc; }
.sx-hero .breadcrumb [aria-current] { color:#fff; }
.sx-hero-grid { display:grid; grid-template-columns:1fr 1.05fr; gap:64px; align-items:center; margin-top:40px; }
.sx-hero .eyebrow { color:var(--citrus); }
.sx-hero h1 { font:500 clamp(44px,4.9vw,78px)/1.02 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.06em; color:#fff; margin:22px 0 26px; }
.sx-hero h1 em { color:var(--citrus); }
.sx-hero .lead { color:#c9d8cc; max-width:48ch; }
.sx-hero .actions { margin-top:32px; gap:26px; }
.sx-hero .button { background:var(--citrus); color:var(--deep); }
.sx-hero .text-link { color:#fff; }
.mx-motion .sx-hero-copy>* { animation:sx-in 1s var(--ease) both; }
.mx-motion .sx-hero-copy>:nth-child(2) { animation-delay:.08s; } .mx-motion .sx-hero-copy>:nth-child(3) { animation-delay:.16s; } .mx-motion .sx-hero-copy>:nth-child(4) { animation-delay:.24s; }
@keyframes sx-in { from { opacity:0; transform:translateX(-50px); } }
.sx-brief { margin:0; display:grid; grid-template-columns:1fr 64px 1fr; align-items:center; }
.sx-card { position:relative; background:#fff; color:var(--ink); border-radius:22px; padding:22px 24px 26px; box-shadow:0 40px 80px -40px rgba(0,0,0,.6); }
.sx-card-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.sx-card .kicker { color:var(--earth); font-size:10px; font-weight:700; }
.sx-dots { display:flex; gap:5px; } .sx-dots i { width:7px; height:7px; border-radius:50%; background:#dfe4d8; }
.sx-need dl { margin:0; }
.sx-need dl>div { display:grid; gap:2px; padding:11px 0; border-top:1px dashed #d9dfd2; }
.sx-need dt { font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.sx-need dd { margin:0; min-height:1.45em; font:600 15px/1.45 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.01em; }
.sx-need dd.typing::after { content:''; display:inline-block; width:2px; height:1em; margin-left:2px; background:var(--accent); vertical-align:-2px; animation:sx-caret .8s steps(1) infinite; }
@keyframes sx-caret { 50% { opacity:0; } }
.sx-live { display:inline-flex; align-items:center; gap:7px; font-size:11px; font-weight:600; color:var(--accent); }
.sx-live::before { content:''; width:7px; height:7px; border-radius:50%; background:var(--citrus); box-shadow:0 0 0 0 rgba(233,165,58,.6); }
.mx-motion .sx-live::before { animation:sx-ping 1.6s ease-out infinite; }
@keyframes sx-ping { to { box-shadow:0 0 0 9px rgba(233,165,58,0); } }
.sx-offer { margin-top:70px; }
.sx-offer ul { list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.sx-offer li,.sx-panel li { display:flex; gap:11px; align-items:center; font-size:14px; }
.sx-offer li svg,.sx-panel li svg { width:22px; height:22px; flex:none; border-radius:50%; background:var(--accent); padding:4px; fill:none; stroke:#fff; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; transition:background .4s; }
.mx-motion .sx-offer li { opacity:.3; transition:opacity .5s; }
.mx-motion .sx-offer li svg { background:#e3e8dc; }
.mx-motion .sx-offer li.done { opacity:1; }
.mx-motion .sx-offer li.done svg { background:var(--accent); }
.sx-stamp { position:absolute; right:18px; bottom:-16px; padding:7px 13px; border:2px solid #a8492a; border-radius:7px; background:#fff; color:#a8492a; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; rotate:-6deg; }
.mx-motion .sx-stamp { opacity:0; scale:1.8; transition:opacity .25s,scale .45s cubic-bezier(.3,1.6,.5,1); }
.mx-motion .sx-brief.stamped .sx-stamp { opacity:1; scale:1; }
.sx-arrow svg { width:60px; height:60px; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.sx-arrow circle { stroke:rgba(233,165,58,.6); stroke-dasharray:4 5; }
.sx-arrow path { stroke:var(--citrus); }
.mx-motion .sx-arrow circle { animation:mx-spin 14s linear infinite; transform-origin:center; transform-box:fill-box; }
.sx-brief figcaption { grid-column:1/-1; margin-top:28px; font-size:11px; color:var(--mint); letter-spacing:.04em; }

.sx-audience .section-heading h2 { max-width:18ch; }
.sx-tabs { margin-bottom:34px; }
.sx-tablist { position:relative; display:inline-flex; gap:2px; padding:6px; background:#fff; border:1px solid var(--line); border-radius:99px; isolation:isolate; max-width:100%; overflow-x:auto; scrollbar-width:none; }
.sx-tab { position:relative; z-index:1; display:inline-flex; align-items:center; gap:10px; border:0; background:transparent; color:var(--ink); padding:12px 22px; border-radius:99px; font-size:14px; font-weight:600; white-space:nowrap; transition:color .35s; }
.sx-tab span { font:500 13px 'Fraunces','Fraunces Fallback',serif; color:var(--earth); transition:color .35s; }
.sx-tab[aria-selected='true'] { color:#fff; }
.sx-tab[aria-selected='true'] span { color:var(--citrus); }
.sx-tab-ink { position:absolute; z-index:0; top:6px; bottom:6px; left:var(--x,6px); width:var(--w,0); border-radius:99px; background:var(--ink); transition:left .55s var(--ease),width .55s var(--ease); }
.sx-panels { display:grid; gap:90px; }
.sx-panels.is-tabbed { display:block; }
.sx-panel { display:grid; grid-template-columns:1.05fr 1fr; gap:64px; align-items:center; scroll-margin-top:120px; }
.sx-panel-img { position:relative; margin:0; aspect-ratio:5/4; border-radius:26px; overflow:hidden; }
.sx-panel-img img { width:100%; height:100%; object-fit:cover; }
.sx-panel-tag { position:absolute; left:18px; bottom:18px; padding:8px 14px; border-radius:99px; background:rgba(255,255,255,.88); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); font:600 12px 'Manrope','Manrope Fallback',sans-serif; }
.sx-panel-body .kicker { color:var(--earth); font-size:10px; font-weight:700; }
.sx-panel-body h2 { font-size:clamp(34px,3.4vw,52px); margin:12px 0 18px; }
.sx-panel-body p { color:var(--muted); font-size:15.5px; line-height:1.85; }
.sx-panel ul { list-style:none; padding:0; margin:24px 0 30px; display:grid; gap:12px; }
.mx-motion .sx-panel.is-entering .sx-panel-img { animation:sx-wipe 1s cubic-bezier(.77,0,.18,1) both; }
.mx-motion .sx-panel.is-entering .sx-panel-body>* { animation:sx-in .8s var(--ease) both; }
.mx-motion .sx-panel.is-entering .sx-panel-body>:nth-child(2) { animation-delay:.06s; } .mx-motion .sx-panel.is-entering .sx-panel-body>:nth-child(3) { animation-delay:.12s; } .mx-motion .sx-panel.is-entering .sx-panel-body>:nth-child(n+4) { animation-delay:.18s; }
@keyframes sx-wipe { from { clip-path:inset(0 100% 0 0 round 26px); } to { clip-path:inset(0 0 0 0 round 26px); } }

.sx-process { background:var(--soft); padding-block:110px; }
.sx-process-head .section-heading { margin-bottom:30px; }
.sx-meter { height:2px; background:#d7ddcf; border-radius:2px; overflow:hidden; margin-bottom:34px; display:none; }
.sx-meter span { display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--citrus)); transform-origin:left; transform:scaleX(var(--p,0)); }
.sx-viewport { max-width:1440px; margin-inline:auto; padding-inline:var(--gutter); }
.sx-rail { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
.sx-step { background:#fff; border:1px solid #e0e5d8; border-radius:22px; overflow:hidden; padding-bottom:26px; }
.sx-step figure { margin:0 0 20px; aspect-ratio:16/11; overflow:hidden; }
.sx-step figure img { width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.sx-step:hover figure img { transform:scale(1.05); }
.sx-step-n { display:block; padding-inline:26px; font:400 40px/1 'Fraunces','Fraunces Fallback',serif; color:var(--earth); }
.sx-step h3 { padding-inline:26px; margin-top:12px; font:600 23px/1.15 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.035em; }
.sx-step p { padding-inline:26px; margin-top:10px; font-size:14px; line-height:1.7; color:var(--muted); }
/* Carril horizontal fijado al scroll (solo con JS, movimiento y pantalla amplia) */
.sx-process.is-rail { padding-block:0; }
.sx-process.is-rail .sx-pin { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; justify-content:center; overflow:hidden; }
.sx-process.is-rail .sx-meter { display:block; }
.sx-process.is-rail .sx-viewport { max-width:none; padding:0; }
.sx-process.is-rail .sx-rail { display:flex; width:max-content; gap:28px; padding-inline:max(var(--gutter),calc((100vw - 1440px) / 2 + var(--gutter))); transform:translate3d(var(--tx,0px),0,0); will-change:transform; }
.sx-process.is-rail .sx-step { width:min(410px,30vw); flex:none; opacity:1; transform:none; }
.sx-process.is-rail .sx-step figure { aspect-ratio:4/3; }

.sx-docs-grid { display:grid; grid-template-columns:1fr 1.05fr; gap:80px; align-items:center; }
.sx-docs-grid h2 { margin:20px 0 22px; }
.sx-docs-grid p { color:var(--muted); line-height:1.85; margin-bottom:24px; }
.sx-sheet { position:relative; background:#fff; border:1px solid #e2e5da; border-radius:20px; box-shadow:0 50px 90px -50px rgba(15,43,33,.5); background-image:repeating-linear-gradient(0deg,transparent 0 31px,#f3f4ee 31px 32px); transition:rotate 1.2s var(--ease),translate 1.2s var(--ease); }
.mx-motion .sx-sheet:not(.in) { rotate:-3deg; translate:0 40px; }
.sx-sheet-head,.sx-sheet-foot { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:18px 26px; background:#fff; border-radius:20px 20px 0 0; }
.sx-sheet-head { border-bottom:1px solid var(--line); font:700 11px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.sx-sheet-head span:last-child { padding:4px 10px; border-radius:99px; background:var(--soft); color:var(--muted); letter-spacing:.06em; }
.sx-sheet ul { list-style:none; margin:0; padding:0; }
.sx-sheet li { display:grid; grid-template-columns:64px 1fr 30px; gap:16px; align-items:center; padding:13px 26px; border-bottom:1px dashed #dfe3d7; font:600 15px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.01em; background:rgba(255,255,255,.7); }
.sx-sheet li figure { margin:0; width:64px; height:48px; border-radius:8px; overflow:hidden; }
.sx-sheet li figure img { width:100%; height:100%; object-fit:cover; }
.sx-tick { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--accent); transition:background .4s; transition-delay:calc(var(--i) * .35s + .5s); }
.sx-tick svg { width:16px; fill:none; stroke:#fff; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:20; stroke-dashoffset:0; transition:stroke-dashoffset .5s; transition-delay:calc(var(--i) * .35s + .6s); }
.mx-motion .sx-sheet:not(.in) .sx-tick { background:#fff; box-shadow:inset 0 0 0 1.5px #cfd6c7; }
.mx-motion .sx-sheet:not(.in) .sx-tick svg { stroke-dashoffset:20; }
.sx-sheet-foot { border-radius:0 0 20px 20px; font-size:12px; color:var(--muted); }
.sx-seal { padding:7px 13px; border:2px solid var(--accent); border-radius:7px; color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; rotate:-4deg; transition:opacity .3s 2.4s,scale .5s cubic-bezier(.3,1.6,.5,1) 2.4s; }
.mx-motion .sx-sheet:not(.in) .sx-seal { opacity:0; scale:1.8; }

/* ================= PRODUCTOS ================= */
.px-hero { padding-block:30px 80px; background:radial-gradient(70% 60% at 10% 0%,#eef0e3,transparent 60%),var(--bg); }
.px-head { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:end; margin:34px 0 44px; }
.px-head h1 { font:500 clamp(48px,5.6vw,92px)/.98 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.065em; margin-top:22px; }
.px-head h1 em { color:var(--accent); }
.px-stats { display:flex; flex-wrap:wrap; gap:14px 30px; margin:22px 0 14px; }
.px-stats span { font-size:12px; color:var(--muted); max-width:14ch; line-height:1.4; }
.px-stats strong { display:block; font:400 36px/1 'Fraunces','Fraunces Fallback',serif; color:var(--accent); letter-spacing:-.03em; margin-bottom:4px; }
.px-jump { display:flex; flex-wrap:wrap; gap:10px 28px; }
.px-bento { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:230px; gap:14px; perspective:1600px; }
.mediterranean .px-tile { position:relative; display:block; border:0; border-radius:24px; overflow:hidden; background:var(--deep); color:#fff; isolation:isolate; box-shadow:none; }
.px-tile:nth-child(1) { grid-column:span 2; grid-row:span 2; }
.px-tile:nth-child(2),.px-tile:nth-child(5),.px-tile:nth-child(6) { grid-column:span 2; }
.mediterranean .px-tile .med-family-photo { position:absolute; inset:0; height:auto; z-index:-2; }
.mediterranean .px-tile .med-family-photo img { transform:scale(1.03); transition:transform 1.2s var(--ease); }
.px-tile::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(10,32,24,.92),rgba(10,32,24,.25) 55%,rgba(10,32,24,.05)); transition:background .5s; }
.px-tile:hover::after,.px-tile:focus-visible::after { background:linear-gradient(0deg,rgba(10,32,24,.95),rgba(10,32,24,.55) 65%,rgba(10,32,24,.2)); }
.mediterranean .px-tile:hover .med-family-photo img { transform:scale(1.12); }
.mediterranean .med-family-card.px-tile:hover { transform:none; border-color:transparent; }
.px-tile-body { position:absolute; left:0; right:0; bottom:0; padding:22px 24px; }
.px-tile-n { display:inline-block; padding:5px 10px; border-radius:99px; background:rgba(255,255,255,.18); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); font:600 11px 'Manrope','Manrope Fallback',sans-serif; }
.px-tile h2 { font:600 23px/1.12 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.04em; margin-top:12px; color:#fff; }
.px-tile:nth-child(1) h2 { font-size:clamp(30px,2.8vw,42px); }
.px-tile p { font-size:13px; line-height:1.6; color:#dfe8dc; margin-top:8px; max-width:40ch; max-height:0; opacity:0; overflow:hidden; transition:max-height .6s var(--ease),opacity .4s; }
.px-tile:nth-child(1) p,.px-tile:hover p,.px-tile:focus-visible p { max-height:90px; opacity:1; }
.px-tile-cta { display:inline-flex; align-items:center; gap:10px; margin-top:12px; font-size:12px; font-weight:700; border-bottom:1px solid currentColor; padding-bottom:4px; }
.px-tile:focus-visible { outline:3px solid var(--citrus); outline-offset:3px; }
.mx-motion .px-tile { animation:px-flip 1.2s var(--ease) both; animation-delay:calc(var(--i) * 90ms + .15s); transform-origin:50% 0; }
@keyframes px-flip { from { opacity:0; transform:rotateX(-60deg) translateY(50px); } }
.mx-motion .px-head>* { animation:mx-fade-up 1s var(--ease) both; }
.mx-motion .px-head>:nth-child(2) { animation-delay:.12s; }
@media (min-width:901px) {
  .px-controls { position:sticky; top:82px; z-index:6; padding:14px 18px; border:1px solid var(--line); border-radius:18px; background:rgba(248,248,242,.86); -webkit-backdrop-filter:blur(14px) saturate(1.4); backdrop-filter:blur(14px) saturate(1.4); box-shadow:0 16px 36px -28px rgba(15,43,33,.45); }
}
.px-catalog .med-product-card { background:#fff; border:1px solid #e5e8de; border-radius:20px; padding:10px 10px 22px; transition:transform .5s var(--ease),box-shadow .5s; }
.px-catalog .med-product-card:hover { transform:translateY(-6px); box-shadow:0 30px 50px -35px rgba(15,43,33,.5); }
.px-catalog .med-product-card .product-photo { border-radius:14px; border:0; }
.px-catalog .med-product-card .product-photo img { transition:transform .8s var(--ease); }
.px-catalog .med-product-card:hover .product-photo img { transform:scale(1.07); }
.px-catalog .med-product-card .product-info { padding-inline:8px; }
::view-transition-group(.pcard) { animation-duration:.55s; }
html.mx-vt-local::view-transition-old(root),html.mx-vt-local::view-transition-new(root) { animation:none; }
html.mx-vt-local .site-header,html.mx-vt-local .mx-progress { view-transition-name:none; }

/* ================= CONTACTO ================= */
.ctx-hero { position:relative; overflow:hidden; padding-block:30px 90px; background:radial-gradient(50% 60% at 100% 0%,rgba(233,165,58,.14),transparent 70%),var(--bg); }
.ctx-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center; margin-top:34px; }
.ctx-copy h1 { font:500 clamp(44px,5vw,80px)/1.02 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.06em; margin:22px 0 24px; }
.ctx-copy h1 em { display:inline-block; color:var(--accent); }
.ctx-copy .lead { max-width:50ch; }
.ctx-direct { display:flex; flex-wrap:wrap; gap:14px; margin-top:32px; }
.ctx-direct a { display:flex; flex-direction:column; gap:4px; padding:15px 22px; border:1px solid var(--line); border-radius:16px; background:#fff; font:600 17px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.02em; transition:border-color .3s,transform .4s var(--ease); }
.ctx-direct a:hover { border-color:var(--accent); transform:translateY(-3px); }
.ctx-direct .kicker { font-size:9px; color:var(--muted); font-weight:700; }
.ctx-office { display:grid; grid-template-columns:1fr 1fr; grid-template-areas:'top top' 'clock map' 'info info'; gap:0 20px; align-items:center; padding:28px 30px; border-radius:28px; background:radial-gradient(80% 90% at 90% 20%,#1d4738,transparent 70%),var(--deep); color:var(--cream); box-shadow:0 50px 90px -50px rgba(15,43,33,.8); }
.ctx-office-top { grid-area:top; display:flex; justify-content:space-between; align-items:center; gap:14px; }
.ctx-office .kicker { color:var(--mint); font-size:10px; font-weight:700; }
.ctx-status { display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:99px; background:rgba(255,255,255,.08); font-size:12px; }
.ctx-status::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--terra); }
.ctx-status.is-open::before { background:#7fd49a; box-shadow:0 0 0 0 rgba(127,212,154,.6); }
.mx-motion .ctx-status.is-open::before { animation:ctx-ping 1.8s ease-out infinite; }
@keyframes ctx-ping { to { box-shadow:0 0 0 9px rgba(127,212,154,0); } }
.ctx-clock { grid-area:clock; margin:22px 0 10px; }
.ctx-clock time { display:block; margin-top:6px; font:400 clamp(44px,4.6vw,72px)/1 'Fraunces','Fraunces Fallback',serif; letter-spacing:-.03em; color:#fff; font-variant-numeric:tabular-nums; }
.ctx-map { grid-area:map; }
.ctx-iberia { width:100%; height:auto; max-height:200px; }
.ib-land { fill:#27543f; }
.ib-spain { fill:#3c7a5c; stroke:#6fa287; stroke-width:.12; }
.ib-pin { fill:var(--citrus); }
.ib-ring { fill:none; stroke:var(--citrus); stroke-width:.2; transform-box:fill-box; transform-origin:center; }
.mx-motion .ib-ring { animation:mx-pulse 2.2s ease-out infinite; }
.ctx-office dl { grid-area:info; display:grid; grid-template-columns:1fr 1fr; gap:14px 24px; margin:14px 0 0; padding-top:18px; border-top:1px solid rgba(255,255,255,.14); }
.ctx-office dt { font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--mint); font-weight:700; }
.ctx-office dd { margin:5px 0 0; font-size:13px; line-height:1.55; }
.mx-motion .ctx-copy>*,.mx-motion .ctx-office { animation:ctx-blur 1.2s var(--ease) both; }
.mx-motion .ctx-copy>:nth-child(2) { animation-delay:.08s; } .mx-motion .ctx-copy>:nth-child(3) { animation-delay:.16s; } .mx-motion .ctx-copy>:nth-child(4) { animation-delay:.24s; } .mx-motion .ctx-office { animation-delay:.3s; }
@keyframes ctx-blur { from { opacity:0; filter:blur(18px); transform:scale(1.03); } }
.ctx-routes { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:56px; }
.ctx-route { position:relative; overflow:hidden; isolation:isolate; display:flex; flex-direction:column; padding:28px 28px 26px; border:1px solid var(--line); border-radius:24px; background:#fff; transition:color .45s,border-color .45s; }
.ctx-route::before { content:''; position:absolute; z-index:-1; right:-30%; bottom:-120%; width:160%; aspect-ratio:1; border-radius:50%; background:var(--deep); transform:scale(0); transform-origin:80% 80%; transition:transform .8s var(--ease); }
.ctx-route:hover,.ctx-route:focus-visible { color:var(--cream); border-color:var(--deep); }
.ctx-route:hover::before,.ctx-route:focus-visible::before { transform:scale(1); }
.ctx-route-n { font:400 36px/1 'Fraunces','Fraunces Fallback',serif; color:var(--earth); transition:color .45s; }
.ctx-route:hover .ctx-route-n,.ctx-route:focus-visible .ctx-route-n { color:var(--citrus); }
.ctx-route h2 { font:600 25px/1.15 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.04em; margin-top:18px; }
.ctx-route p { font-size:14px; line-height:1.65; color:var(--muted); margin-top:8px; transition:color .45s; }
.ctx-route:hover p,.ctx-route:focus-visible p { color:#c9d8cc; }
.ctx-route-go { margin-top:auto; padding-top:22px; display:inline-flex; gap:12px; align-items:center; font-size:12.5px; font-weight:700; }
.mx-motion .ctx-route { animation:ctx-blur 1s var(--ease) both; animation-delay:calc(var(--i) * 100ms + .45s); }

.ctx-form-section { background:linear-gradient(#f8f8f2,#eef1e6); }
.mediterranean .ctx-next { position:sticky; top:110px; align-self:start; }
.ctx-next h2 { margin:18px 0 28px; }
.ctx-next ol { list-style:none; margin:0; padding:0; display:grid; gap:0; }
.ctx-next li { position:relative; display:grid; grid-template-columns:48px 1fr; gap:6px; padding-bottom:26px; }
.ctx-next li::before { content:''; position:absolute; left:15px; top:36px; bottom:4px; width:1px; background:var(--line); }
.ctx-next li:last-child::before { display:none; }
.ctx-next li>span { width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:var(--deep); color:var(--citrus); font:500 12px 'Fraunces','Fraunces Fallback',serif; }
.ctx-next strong { font:600 17px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.02em; }
.ctx-next li p { font-size:13.5px; color:var(--muted); line-height:1.6; margin-top:4px; }
.ctx-next-note { margin:6px 0 22px; font-size:13px; }
.mediterranean .med-contact-form { position:relative; border-radius:26px; border-color:#e1e5d9; box-shadow:0 50px 90px -60px rgba(15,43,33,.5); }
.mediterranean .med-contact-form input:focus,.mediterranean .med-contact-form select:focus,.mediterranean .med-contact-form textarea:focus { box-shadow:0 0 0 4px rgba(39,88,61,.14); }
.ctx-meter { position:absolute; top:30px; right:32px; display:grid; grid-template-columns:44px auto; grid-template-rows:auto auto; column-gap:10px; align-items:center; }
.ctx-meter svg { grid-row:span 2; width:44px; height:44px; rotate:-90deg; fill:none; stroke-width:3; }
.ctx-meter circle { stroke:#e2e6dc; }
.ctx-meter .ctx-meter-fill { stroke:var(--accent); stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--m,0)); transition:stroke-dashoffset .6s var(--ease),stroke .3s; }
.ctx-meter.is-complete .ctx-meter-fill { stroke:var(--citrus); }
.ctx-meter span { font:600 15px 'Manrope','Manrope Fallback',sans-serif; }
.ctx-meter small { font-size:10px; color:var(--muted); letter-spacing:.04em; }
html:not(.mx-js-ready) .ctx-meter { display:none; }
.mediterranean .faq-item { interpolate-size:allow-keywords; }
.mediterranean .faq-item::details-content { height:0; overflow:clip; transition:height .5s var(--ease),content-visibility .5s allow-discrete; }
.mediterranean .faq-item[open]::details-content { height:auto; }
.mediterranean .faq-item summary { font:600 16px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.015em; transition:color .3s,padding .4s var(--ease); }
.mediterranean .faq-item summary:hover { color:var(--accent); padding-left:8px; }
.mediterranean .faq-item summary::after { content:''; flex:none; width:30px; height:30px; border-radius:50%; background-color:var(--soft); background-image:linear-gradient(var(--accent),var(--accent)),linear-gradient(var(--accent),var(--accent)); background-size:12px 1.6px,1.6px 12px; background-position:center; background-repeat:no-repeat; transition:rotate .45s var(--ease),background-color .3s; }
.mediterranean .faq-item[open] summary::after { content:''; rotate:135deg; background-color:#fbecd0; }

/* ---------- Adaptación ---------- */
@media (max-width:1100px) {
  .sx-brief { grid-template-columns:1fr; }
  .sx-arrow { justify-self:center; rotate:90deg; margin:10px 0; }
  .sx-offer { margin-top:0; }
  .sx-rail { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ctx-office { grid-template-columns:1fr; grid-template-areas:'top' 'clock' 'map' 'info'; }
  .ctx-iberia { max-height:160px; }
}
@media (max-width:900px) {
  .cx-hero-grid,.cx-story-grid,.sx-hero-grid,.sx-panel,.sx-docs-grid,.px-head,.ctx-grid { grid-template-columns:1fr; gap:40px; }
  .cx-year-wrap { text-align:left; }
  .cx-year { font-size:clamp(120px,34vw,220px); }
  .cx-manifesto { padding-block:80px; }
  .cx-tilt-grid { grid-template-columns:1fr; max-width:520px; }
  .sx-panels { gap:70px; }
  .px-bento { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:190px; }
  .px-tile:nth-child(1) { grid-column:span 2; grid-row:span 1; }
  .px-tile:nth-child(n+2) { grid-column:span 1; }
  .px-tile:nth-child(6) { grid-column:span 2; }
  .px-tile p { display:none; }
  .px-tile:nth-child(1) p { display:block; }
  .ctx-routes { grid-template-columns:1fr; }
  .mediterranean .ctx-next { position:static; }
}
@media (max-width:600px) {
  .cx-facts { grid-template-columns:1fr 1fr; }
  .cx-words { font-size:clamp(28px,8vw,40px); }
  .sx-rail { grid-template-columns:1fr; }
  .sx-tab { padding:10px 14px; font-size:13px; }
  .sx-sheet li { grid-template-columns:48px 1fr 28px; padding-inline:16px; font-size:13.5px; }
  .sx-sheet li figure { width:48px; height:40px; }
  .sx-sheet-head,.sx-sheet-foot { padding-inline:16px; }
  .px-bento { grid-auto-rows:160px; gap:10px; }
  .px-tile-body { padding:16px; }
  .px-tile h2 { font-size:18px; }
  .ctx-office { padding:22px; }
  .ctx-office dl { grid-template-columns:1fr; }
  .ctx-meter { position:static; margin:6px 0 16px; }
}


/* ---------- Empresa · apertura única (trayectoria + idea) ---------- */
.cx-idea { display:grid; grid-template-columns:250px minmax(0,1fr); gap:60px; margin-top:64px; padding-top:44px; border-top:1px solid var(--line); }
.cx-idea-side .kicker { color:var(--earth); font-size:10px; font-weight:700; }
.cx-idea .cx-facts { grid-template-columns:1fr; gap:16px; margin:22px 0 0; padding-top:0; border-top:0; }
.cx-idea .cx-words { margin-top:0; max-width:30ch; font-size:clamp(28px,3.1vw,48px); }

/* ---------- Empresa · lo que aportamos: filas en zigzag con imagen siempre visible ---------- */
.cx-rows { list-style:none; margin:0; padding:0; display:grid; gap:72px; }
.cx-rows li { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:70px; align-items:center; }
.cx-rows li:nth-child(even) .cx-row-img { order:2; }
.cx-row-img { position:relative; margin:0; aspect-ratio:16/10; border-radius:24px; overflow:hidden; box-shadow:0 40px 70px -45px rgba(15,43,33,.55); }
.cx-row-img img { width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease); }
.cx-rows li:hover .cx-row-img img { transform:scale(1.05); }
.cx-row-n { display:block; font:400 64px/1 'Fraunces','Fraunces Fallback',serif; letter-spacing:-.03em; color:var(--earth); margin-bottom:14px; }
.cx-row-body .kicker { color:var(--muted); font-size:10px; font-weight:700; }
.cx-row-body h3 { font:600 clamp(28px,2.8vw,42px)/1.1 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.045em; margin:10px 0 16px; }
.cx-row-body p { color:var(--muted); font-size:16px; line-height:1.8; max-width:42ch; }

/* ---------- Productos · marca de distribuidor: tarro interactivo ---------- */
.px-brand { background:linear-gradient(180deg,#f4f0e4,#eee6d2); overflow:hidden; }
.px-brand-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:70px; align-items:center; }
.px-brand-copy h2 { margin:20px 0; }
.px-brand-copy h2 em { color:var(--accent); }
.px-brand-copy>p { color:var(--muted); font-size:15.5px; line-height:1.8; max-width:48ch; }
.px-brand-tool { margin:28px 0 26px; padding:20px 22px 22px; background:#fff; border:1px solid #e4dccb; border-radius:20px; box-shadow:0 30px 60px -45px rgba(90,60,20,.45); }
.px-brand-tool label { display:block; font-size:10px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--earth); }
.px-brand-tool input { width:100%; margin-top:6px; padding:4px 0 10px; border:0; border-bottom:2px solid var(--line); border-radius:0; background:transparent; font:italic 400 30px 'Fraunces','Fraunces Fallback',Georgia,serif; color:var(--ink); transition:border-color .3s; }
.px-brand-tool input:focus { outline:none; border-bottom-color:var(--accent); }
.px-brand-tool input:focus-visible { outline:none; box-shadow:0 2px 0 0 var(--accent); }
.px-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.px-chip { border:1px solid var(--line); background:var(--bg); color:var(--ink); border-radius:99px; padding:8px 15px; font-size:13px; font-weight:600; transition:background .25s,color .25s,border-color .25s; }
.px-chip:hover { border-color:var(--accent); }
.px-chip[aria-pressed='true'] { background:var(--ink); border-color:var(--ink); color:#fff; }
.px-brand-steps { list-style:none; margin:0 0 30px; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 24px; }
.px-brand-steps li { display:flex; align-items:baseline; gap:10px; font:600 14.5px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.01em; }
.px-brand-steps span { font:400 15px 'Fraunces','Fraunces Fallback',serif; color:var(--earth); }
.px-brand-copy .actions { gap:26px; }
.px-shelf { --fill:#b8a947; --item:#7f8c2f; --lid:#23513b; margin:0; display:grid; justify-items:center; }
.px-shelf[data-jar='pimientos'] { --fill:#b8331d; --item:#e25a3b; --lid:#7a2517; }
.px-shelf[data-jar='alcachofas'] { --fill:#d2c690; --item:#98a257; --lid:#41602f; }
.px-shelf[data-jar='melocoton'] { --fill:#f1bd62; --item:#e59431; --lid:#94561d; }
.px-shelf-stage { position:relative; width:min(440px,100%); display:flex; justify-content:center; align-items:flex-end; padding-bottom:16px; }
.px-shelf-stage::before { content:''; position:absolute; inset:0 0 10%; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.9),rgba(255,255,255,0) 68%); }
.px-jar { position:relative; z-index:1; width:74%; height:auto; overflow:visible; transform-origin:50% 100%; margin-bottom:-24px; }
.px-shelf-board { position:absolute; left:0; right:0; bottom:0; height:18px; border-radius:6px; background:linear-gradient(#c9a476,#a47d55); box-shadow:0 20px 30px -14px rgba(80,50,20,.55); }
.px-jar-shadow { fill:rgba(60,40,20,.2); }
.px-jar-fill { fill:var(--fill); transition:fill .7s ease; }
#jar-items circle { fill:var(--item); transition:fill .7s ease; }
.px-jar-glass { fill:rgba(255,255,255,.1); stroke:rgba(15,43,33,.28); stroke-width:2; }
.px-jar-neck { fill:rgba(255,255,255,.45); stroke:rgba(15,43,33,.2); stroke-width:1.5; }
.px-jar-lid { fill:var(--lid); transition:fill .7s ease; }
.px-jar-ridges { stroke:rgba(255,255,255,.2); stroke-width:3; }
.mx-motion .px-jar { animation:px-sway 6s ease-in-out infinite alternate; }
@keyframes px-sway { from { rotate:-1.3deg; } to { rotate:1.3deg; } }
@keyframes px-pop { from { scale:.88; opacity:.4; } }
.px-shelf figcaption { margin-top:16px; font-size:11px; color:var(--muted); text-align:center; max-width:38ch; }

@media (max-width:900px) {
  .cx-idea { grid-template-columns:1fr; gap:24px; margin-top:48px; padding-top:32px; }
  .cx-idea .cx-facts { grid-template-columns:repeat(3,auto); gap:10px 28px; }
  .cx-rows { gap:54px; }
  .cx-rows li { grid-template-columns:1fr; gap:24px; }
  .cx-rows li:nth-child(even) .cx-row-img { order:0; }
  .cx-row-n { font-size:48px; margin-bottom:8px; }
  .px-brand-grid { grid-template-columns:1fr; gap:40px; }
}
@media (max-width:600px) {
  .cx-idea .cx-facts { grid-template-columns:1fr 1fr; }
  .px-brand-steps { grid-template-columns:1fr; }
  .px-brand-tool input { font-size:26px; }
}

/* ================= LEGALES, 404 Y PIE ================= */
.lx-hero { position:relative; overflow:hidden; padding-block:30px 60px; border-bottom:1px solid var(--line); background:radial-gradient(60% 90% at 100% 0%,#e9edde,transparent 70%),var(--bg); }
.lx-hero .breadcrumb { margin-bottom:34px; }
.lx-hero h1 { font:500 clamp(42px,4.6vw,72px)/1.02 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.06em; margin:20px 0 18px; }
.lx-hero .lead { max-width:60ch; }
.lx-updated { margin-top:18px; font-size:12px; color:var(--muted); }
.lx-grid { display:grid; grid-template-columns:240px minmax(0,1fr); gap:70px; align-items:start; }
.lx-toc { position:sticky; top:110px; }
.lx-toc .kicker { color:var(--earth); font-size:10px; font-weight:700; }
.lx-toc ol { list-style:none; margin:14px 0 0; padding:0; border-left:1px solid var(--line); counter-reset:lx; }
.lx-toc li { counter-increment:lx; }
.lx-toc a { display:block; padding:7px 0 7px 16px; margin-left:-1px; border-left:2px solid transparent; font-size:13.5px; color:var(--muted); transition:color .2s,border-color .2s; }
.lx-toc a::before { content:counter(lx,decimal-leading-zero) '  '; font:500 11px 'Fraunces','Fraunces Fallback',serif; color:var(--earth); }
.lx-toc a:hover { color:var(--ink); border-left-color:var(--accent); }
.lx-doc { max-width:72ch; }
.lx-section { padding-bottom:40px; margin-bottom:40px; border-bottom:1px solid var(--line); scroll-margin-top:110px; }
.lx-section:last-child { border-bottom:0; margin-bottom:0; }
.lx-section h2 { font:600 clamp(24px,2.2vw,32px)/1.15 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.04em; margin-bottom:18px; }
.lx-section p,.lx-section li { font-size:15.5px; line-height:1.85; color:#3f5448; }
.lx-section p+p,.lx-section p+ul,.lx-section ul+p,.lx-section dl+p,.lx-section table+p { margin-top:14px; }
.lx-section ul { padding-left:20px; margin:10px 0 0; }
.lx-section li+li { margin-top:6px; }
.lx-section a { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.lx-id { margin:18px 0 0; border:1px solid var(--line); border-radius:16px; background:#fff; overflow:hidden; }
.lx-id>div { display:grid; grid-template-columns:180px minmax(0,1fr); gap:20px; padding:13px 20px; border-top:1px solid var(--line); }
.lx-id>div:first-child { border-top:0; }
.lx-id dt { font-size:11px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:var(--muted); padding-top:3px; }
.lx-id dd { margin:0; font-size:15px; overflow-wrap:anywhere; }
.lx-pending { background:#fbe3c2; color:#6b3510; padding:2px 8px; border-radius:6px; font-size:13px; font-weight:600; }
.lx-callout { padding:20px 24px; border-radius:16px; background:var(--soft); border-left:3px solid var(--accent); }
.lx-table { width:100%; border-collapse:collapse; margin-top:6px; font-size:14.5px; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.lx-table th,.lx-table td { text-align:left; padding:12px 16px; border-top:1px solid var(--line); vertical-align:top; }
.lx-table thead th { border-top:0; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); background:#f7f8f2; }
.lx-table tbody th { font-weight:600; width:38%; }
.lx-footer-legal { display:flex; flex-wrap:wrap; gap:6px 20px; }
.lx-footer-legal a:hover { color:var(--accent); }
.lx-basic { margin:4px 0 22px; border:1px solid var(--line); border-radius:14px; background:#fafbf6; font-size:12.5px; }
.lx-basic summary { cursor:pointer; padding:12px 16px; font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:10px; }
.lx-basic summary::-webkit-details-marker { display:none; }
.lx-basic summary::after { content:'+'; color:var(--accent); font-size:17px; line-height:1; }
.lx-basic[open] summary::after { content:'−'; }
.lx-basic dl { margin:0; padding:0 16px; }
.lx-basic dl>div { display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; padding:7px 0; border-top:1px solid var(--line); }
.lx-basic dt { font-weight:700; color:var(--ink); }
.lx-basic dd { margin:0; color:var(--muted); }
.lx-basic p { padding:8px 16px 12px; }
.lx-basic a { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.nf-hero { padding-block:90px 110px; background:radial-gradient(60% 80% at 90% 10%,#e9edde,transparent 70%),var(--bg); }
.nf-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:70px; align-items:center; }
.nf-hero h1 { font:500 clamp(44px,5vw,80px)/1.02 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.06em; margin:20px 0 22px; }
.nf-hero h1 em { color:var(--accent); }
.nf-hero .actions { margin-top:30px; gap:26px; }
.nf-card { padding:28px 30px; border-radius:24px; background:var(--deep); color:var(--cream); }
.nf-card .kicker { color:var(--citrus); font-size:10px; font-weight:700; }
.nf-card ul { list-style:none; margin:14px 0 0; padding:0; }
.nf-card li { border-top:1px solid rgba(255,255,255,.14); }
.nf-card a { display:block; padding:12px 0; font:600 16px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.02em; transition:color .2s,padding .3s var(--ease); }
.nf-card a:hover { color:var(--citrus); padding-left:6px; }
@media (max-width:900px) {
  .lx-grid,.nf-grid { grid-template-columns:1fr; gap:34px; }
  .lx-toc { position:static; }
  .lx-id>div { grid-template-columns:1fr; gap:4px; }
}

/* ================= RONDA 5 ================= */
/* Empresa · apertura como una sola composición */
.cx-hero-copy .cx-words { margin:0 0 6px; max-width:34ch; font:500 clamp(21px,1.75vw,28px)/1.45 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.025em; }
.cx-hero-copy .cx-facts { margin-top:30px; }
.cx-hero-grid { align-items:center; }

/* Productos · catálogo */
.px-controls { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; }
.mediterranean .px-controls .filters { flex-wrap:wrap; }
.px-search { position:relative; }
.px-search label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.mediterranean .px-search svg { position:absolute; left:20px; top:50%; translate:0 -50%; width:20px; height:20px; color:var(--muted); pointer-events:none; }
.mediterranean .px-search input { width:100%; height:60px; padding:0 64px 0 54px; border:1px solid var(--line); border-radius:16px; background:#fff; font:500 17px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.01em; color:var(--ink); transition:border-color .3s,box-shadow .3s; }
.mediterranean .px-search input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 5px rgba(39,88,61,.12); }
.px-kbd { position:absolute; right:18px; top:50%; translate:0 -50%; min-width:26px; padding:3px 7px; border:1px solid var(--line); border-bottom-width:2px; border-radius:7px; background:var(--bg); font:600 12px 'DM Sans','DM Sans Fallback',sans-serif; color:var(--muted); text-align:center; }
.px-filter-row { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.mediterranean .px-controls .filters { gap:6px; }
.mediterranean .px-controls .med-filter { display:inline-flex; align-items:center; gap:8px; border-radius:99px; padding:8px 8px 8px 15px; }
.px-count { min-width:24px; padding:2px 7px; border-radius:99px; background:rgba(25,61,48,.08); color:var(--ink); font-size:11px; font-weight:700; text-align:center; }
.med-filter[aria-pressed='true'] .px-count { background:rgba(255,255,255,.2); color:#fff; }
.px-family-select { display:flex; align-items:center; gap:10px; }
.px-family-select label { font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--muted); }
.mediterranean .px-family-select select { min-width:230px; height:42px; border-radius:99px; padding-inline:16px 36px; }
.px-fams { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
.px-fam { flex:none; display:inline-flex; align-items:center; gap:8px; padding:7px 14px 7px 8px; border:1px solid var(--line); border-radius:99px; background:#fff; color:var(--ink); font-size:12.5px; font-weight:600; transition:background .25s,color .25s,border-color .25s; }
.px-fam-n { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--soft); font:500 11px 'Fraunces','Fraunces Fallback',serif; color:var(--earth); }
.px-fam[aria-pressed='true'] { background:var(--accent); border-color:var(--accent); color:#fff; }
.px-fam[aria-pressed='true'] .px-fam-n { background:rgba(255,255,255,.18); color:#fff; }
.px-view { display:inline-flex; padding:4px; border:1px solid var(--line); border-radius:99px; background:#fff; margin-left:auto; margin-right:18px; }
.px-view button { border:0; background:transparent; padding:6px 13px; border-radius:99px; font-size:12px; font-weight:600; color:var(--muted); }
.px-view button[aria-pressed='true'] { background:var(--ink); color:#fff; }
.px-catalog .med-results-line { display:flex; align-items:center; }
.px-catalog .med-product-card { position:relative; cursor:pointer; }
.px-catalog .product-photo { position:relative; }
.px-card-cons { position:absolute; left:10px; bottom:10px; padding:5px 10px; border-radius:99px; background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); font-size:10.5px; font-weight:600; color:var(--ink); }
.px-open { all:unset; cursor:pointer; font:inherit; letter-spacing:inherit; transition:color .25s; }
.px-open:focus-visible { outline:3px solid var(--accent); outline-offset:4px; border-radius:4px; }
.px-catalog .med-product-card:hover .px-open { color:var(--accent); }
.px-card-tags { display:flex; flex-wrap:wrap; gap:5px; margin:12px 0 4px; }
.px-card-tags span { padding:3px 9px; border-radius:99px; background:var(--soft); font-size:10.5px; font-weight:600; color:#4c5f51; }
.px-catalog .med-product-actions { align-items:center; gap:12px; }
.px-add { display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line); background:#fff; border-radius:99px; padding:5px 12px 5px 6px; font-size:12px; font-weight:700; color:var(--ink); transition:background .25s,color .25s,border-color .25s; }
.px-add-icon { position:relative; width:20px; height:20px; border-radius:50%; background:var(--soft); }
.px-add-icon::before,.px-add-icon::after { content:''; position:absolute; left:50%; top:50%; width:9px; height:1.6px; background:var(--accent); translate:-50% -50%; transition:rotate .35s var(--ease),width .3s,translate .3s; }
.px-add-icon::after { rotate:90deg; }
.px-add[aria-pressed='true'] { background:var(--accent); border-color:var(--accent); color:#fff; }
.px-add[aria-pressed='true'] .px-add-icon { background:rgba(255,255,255,.2); }
.px-add[aria-pressed='true'] .px-add-icon::before { background:#fff; width:5px; translate:-95% 20%; rotate:45deg; }
.px-add[aria-pressed='true'] .px-add-icon::after { background:#fff; width:9px; translate:-30% -30%; rotate:-45deg; }
.px-grid.is-list { grid-template-columns:1fr; gap:10px; }
.px-grid.is-list .med-product-card { display:grid; grid-template-columns:120px minmax(0,1fr); gap:20px; align-items:center; padding:10px 18px 10px 10px; }
.px-grid.is-list .product-photo { aspect-ratio:1; }
.px-grid.is-list .px-card-cons { display:none; }
.px-grid.is-list .product-info { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:24px; align-items:center; }
.px-grid.is-list .product-info>*:not(.med-product-actions) { grid-column:1; }
.px-grid.is-list .med-product-actions { grid-column:2; grid-row:1/span 4; }
.px-grid.is-list .product-info p { min-height:0; }

/* Mi selección */
.px-tray { position:fixed; z-index:60; left:50%; bottom:18px; translate:-50% 0; width:min(820px,calc(100vw - 24px)); padding:14px 16px 10px 22px; border-radius:22px; background:rgba(15,43,33,.95); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); color:var(--cream); box-shadow:0 30px 60px -20px rgba(0,0,0,.5); }
.mx-motion .px-tray:not([hidden]) { animation:px-tray-in .6s var(--ease); }
@keyframes px-tray-in { from { translate:-50% 140%; } }
.px-tray-inner { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.px-tray .kicker { color:var(--citrus); font-size:10px; font-weight:700; }
.px-tray p { font:600 14px/1.4 'Manrope','Manrope Fallback',sans-serif; margin-top:3px; }
.px-tray-actions { display:flex; align-items:center; gap:10px; flex:none; }
.px-tray-clear { border:0; background:transparent; color:#c9d8cc; font-size:12px; text-decoration:underline; text-underline-offset:3px; }
.px-tray .button { background:var(--citrus); color:var(--deep); min-height:44px; }
.px-tray-note { margin-top:6px; font-size:10.5px; color:#b9cabd; }

/* Ficha de producto */
.px-dialog { width:min(1080px,calc(100vw - 32px)); max-height:calc(100dvh - 40px); padding:0; border:0; border-radius:28px; background:var(--bg); color:var(--ink); box-shadow:0 60px 120px -30px rgba(0,0,0,.55); overflow:hidden; }
.px-dialog::backdrop { background:rgba(12,30,23,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.mx-motion .px-dialog[open] { animation:pd-in .55s var(--ease); }
.mx-motion .px-dialog[open]::backdrop { animation:pd-fade .4s ease; }
@keyframes pd-in { from { opacity:0; transform:translateY(40px) scale(.97); } }
@keyframes pd-fade { from { opacity:0; } }
.pd { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); max-height:calc(100dvh - 40px); }
.pd-media { position:relative; background:#fff; display:grid; place-items:center; padding:30px; }
.pd-media img { width:100%; max-width:420px; aspect-ratio:1; object-fit:cover; border-radius:22px; }
.pd-cons { position:absolute; left:28px; top:28px; padding:6px 12px; border-radius:99px; background:var(--deep); color:var(--cream); font-size:11px; font-weight:600; }
.pd-body { overflow:auto; padding:34px 38px 26px; }
.pd-top { display:flex; justify-content:space-between; align-items:center; gap:14px; }
.pd-top .kicker { color:var(--earth); font-size:10px; font-weight:700; }
.pd-close { flex:none; width:42px; height:42px; border-radius:50%; border:1px solid var(--line); background:#fff; font-size:20px; line-height:1; color:var(--ink); transition:rotate .4s var(--ease),background .2s; }
.pd-close:hover { rotate:90deg; background:var(--soft); }
.pd-body h2 { font:600 clamp(30px,3vw,44px)/1.05 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.05em; margin:12px 0 10px; }
.pd-lead { color:var(--muted); font-size:15.5px; line-height:1.7; }
.pd-tags { display:flex; flex-wrap:wrap; gap:6px; margin:14px 0 22px; }
.pd-tags span { padding:4px 11px; border-radius:99px; background:var(--soft); font-size:11px; font-weight:700; color:var(--accent); }
.pd-cols { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; padding:20px 0; border-block:1px solid var(--line); }
.pd-cols h3,.pd-spec h3 { font:700 10px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
.pd-cols ul { list-style:none; margin:0; padding:0; display:grid; gap:7px; }
.pd-cols li { font-size:13.5px; line-height:1.45; padding-left:14px; position:relative; }
.pd-cols li::before { content:''; position:absolute; left:0; top:.55em; width:6px; height:6px; border-radius:50%; background:var(--accent); }
.pd-spec { padding:20px 0 6px; }
.pd-spec ol { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; counter-reset:spec; }
.pd-spec li { counter-increment:spec; display:inline-flex; align-items:center; gap:8px; padding:7px 13px 7px 7px; border:1px solid var(--line); border-radius:99px; background:#fff; font-size:13px; font-weight:600; }
.pd-spec li::before { content:counter(spec); display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--deep); color:var(--citrus); font:500 11px 'Fraunces','Fraunces Fallback',serif; }
.pd-note { margin:18px 0 22px; padding:16px 18px; border-left:3px solid var(--citrus); border-radius:0 14px 14px 0; background:#fbf3e2; }
.pd-note span { display:block; font-size:10px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:#7a4e12; margin-bottom:5px; }
.pd-note p { font-size:14px; line-height:1.65; }
.pd-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; }
.pd-nav { display:flex; justify-content:space-between; gap:12px; margin-top:24px; padding-top:16px; border-top:1px solid var(--line); }
.pd-nav button { border:0; background:transparent; font-size:12.5px; font-weight:600; color:var(--muted); padding:6px 0; max-width:48%; text-align:left; }
.pd-nav button:last-child { text-align:right; margin-left:auto; }
.pd-nav button:hover { color:var(--accent); }
.pd-nav small { display:block; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.pd-disclaimer { margin-top:14px; font-size:11px; color:var(--muted); }

/* Productos · estudio de marca propia */
.px-brand-head { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; margin-bottom:44px; }
.px-brand-head h2 { margin-top:18px; }
.px-brand-head h2 em { color:var(--accent); }
.px-brand-head p { color:var(--muted); font-size:15.5px; line-height:1.8; max-width:52ch; }
.px-studio { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr) minmax(0,.8fr); gap:36px; align-items:center; }
.px-studio-tools { display:grid; gap:22px; }
.px-step { margin:0; padding:0; border:0; min-width:0; }
.px-step legend,.px-step>label { display:flex; align-items:center; gap:10px; margin-bottom:12px; font:700 11px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); }
.px-step legend span,.px-step>label span { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--deep); color:var(--citrus); font:500 12px 'Fraunces','Fraunces Fallback',serif; letter-spacing:0; }
.px-studio .px-chips { margin-top:0; }
.px-chip { display:inline-flex; align-items:center; gap:8px; }
.px-chip-dot { width:12px; height:12px; border-radius:50%; background:#8e9a34; box-shadow:inset 0 -2px 3px rgba(0,0,0,.2); }
.px-chip[data-jar='pimientos'] .px-chip-dot { background:#c73a22; }
.px-chip[data-jar='alcachofas'] .px-chip-dot { background:#cfc783; }
.px-chip[data-jar='melocoton'] .px-chip-dot { background:#f0a13c; }
.px-studio .px-step input { width:100%; padding:8px 0 10px; border:0; border-bottom:2px solid var(--line); border-radius:0; background:transparent; font:italic 400 28px 'Fraunces','Fraunces Fallback',Georgia,serif; color:var(--ink); transition:border-color .3s; }
.px-studio .px-step input:focus { outline:none; border-bottom-color:var(--accent); }
.px-styles { display:flex; flex-wrap:wrap; gap:8px; }
.px-style { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--bg); border-radius:12px; padding:7px 12px 7px 7px; font-size:13px; font-weight:600; color:var(--ink); transition:border-color .25s,box-shadow .25s; }
.px-style span { width:26px; height:18px; border-radius:4px; background:#fbf8ef; border:1px solid rgba(15,43,33,.2); }
.px-style[data-style='moderna'] span { background:#193d30; }
.px-style[data-style='natural'] span { background:#d9c39c; }
.px-style[aria-pressed='true'] { border-color:var(--ink); box-shadow:0 0 0 1px var(--ink); }
.px-studio .px-brand-steps { margin:4px 0 0; padding-top:18px; border-top:1px solid rgba(90,60,20,.18); }
.jar-content { display:none; }
.jar-content.is-active { display:inline; }
.px-jar-meniscus { fill:none; stroke:rgba(255,255,255,.55); stroke-width:2; }
.mx-motion .jar-content.pour .it { animation:jar-pour .75s cubic-bezier(.3,1.25,.5,1) both; animation-delay:var(--d); }
@keyframes jar-pour { from { translate:0 -70px; opacity:0; } }
.px-jar-lid { transition:fill .5s; }
.px-shelf[data-jar='aceitunas'] .px-jar-lid { fill:#2d5a36; }
.px-shelf[data-jar='pimientos'] .px-jar-lid { fill:#8f2618; }
.px-shelf[data-jar='alcachofas'] .px-jar-lid { fill:#556b2f; }
.px-shelf[data-jar='melocoton'] .px-jar-lid { fill:#a55d1c; }
.px-ref { padding:24px 24px 22px; border-radius:22px; background:#fff; border:1px solid #e4dccb; box-shadow:0 40px 70px -50px rgba(90,60,20,.5); display:grid; gap:16px; }
.px-ref .kicker { color:var(--earth); font-size:10px; font-weight:700; }
.px-sheet { margin:0; display:grid; }
.px-sheet>div { display:grid; gap:2px; padding:10px 0; border-top:1px dashed #e0d8c6; }
.px-sheet dt { font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:700; }
.px-sheet dd { margin:0; font:600 15px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.01em; overflow-wrap:anywhere; }
.px-ref .button { justify-content:space-between; }

@media (max-width:1100px) {
  .px-studio { grid-template-columns:1fr 1fr; }
  .px-ref { grid-column:1/-1; }
  .px-ref .px-sheet { grid-template-columns:repeat(4,minmax(0,1fr)); gap:0 14px; }
  .pd-cols { grid-template-columns:1fr 1fr; }
}
@media (max-width:900px) {
  .px-brand-head,.px-studio { grid-template-columns:1fr; gap:28px; }
  .px-ref .px-sheet { grid-template-columns:1fr 1fr; }
  .px-view { display:none !important; }
  .pd { grid-template-columns:1fr; overflow:auto; }
  .pd-media { padding:18px; }
  .pd-media img { max-width:none; aspect-ratio:16/10; }
  .pd-body { overflow:visible; padding:24px 22px; }
  .px-dialog { width:100vw; max-width:100vw; max-height:100dvh; height:100dvh; border-radius:0; }
  .pd { max-height:100dvh; }
  .px-tray-inner { flex-direction:column; align-items:stretch; }
}
@media (max-width:600px) {
  .pd-cols { grid-template-columns:1fr; }
  .mediterranean .px-family-select { width:100%; }
  .mediterranean .px-family-select select { flex:1; min-width:0; }
  .px-kbd { display:none; }
}
.mediterranean .px-family-select select { font-size:14px; font-weight:600; }
@media (max-width:900px) { .pd-close { position:fixed; top:14px; right:14px; z-index:3; box-shadow:0 8px 20px -8px rgba(0,0,0,.35); } .pd-top { padding-right:52px; } }


/* ================= RONDA 6 · Marca propia: envase y etiquetas ================= */
.px-shelf { --tone:#56662a; --tone-2:#e9a53a; --liquid:#e8e1b0; }
.px-shelf[data-jar='pimientos'] { --tone:#a3241a; --tone-2:#f1b546; --liquid:#f2cdbd; }
.px-shelf[data-jar='alcachofas'] { --tone:#617331; --tone-2:#e9c46a; --liquid:#efe9c8; }
.px-shelf[data-jar='melocoton'] { --tone:#c8661a; --tone-2:#2f5d3a; --liquid:#fbe2b2; }
.pk,.lbl { display:none; }
.px-shelf[data-pack='tarro'] .pk-tarro,.px-shelf[data-pack='lata'] .pk-lata { display:inline; }
.px-shelf[data-style='clasica'] .lbl-clasica,.px-shelf[data-style='moderna'] .lbl-moderna,.px-shelf[data-style='natural'] .lbl-natural { display:inline; }
.pk,.lbl { transform-box:fill-box; transform-origin:50% 100%; }
.lbl { transform-origin:50% 50%; }
.mx-motion .pk.enter { animation:pk-in .75s var(--ease); }
@keyframes pk-in { from { opacity:0; translate:0 26px; scale:.94; } }
.mx-motion .px-shelf.swap .lbl { animation:px-pop .55s cubic-bezier(.3,1.5,.5,1); }
.vig-bg { fill:var(--liquid); transition:fill .5s; }
/* Clásica: medallón y filetes */
.lc-bg { fill:#fbf8ef; stroke:rgba(15,43,33,.16); }
.lc-ring,.lc-window { fill:none; stroke:var(--tone); stroke-width:1.5; transition:stroke .5s; }
.lc-window { stroke-width:2.2; }
.lc-rule,.lc-orn { stroke:var(--tone); stroke-width:1.2; transition:stroke .5s; }
.lc-dot { fill:var(--tone); }
.lc-top { font:700 8.5px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:3px; fill:#596b5d; }
.lc-brand { font:italic 400 22px 'Fraunces','Fraunces Fallback',Georgia,serif; fill:#193d30; }
.lc-product { font:700 9.5px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:1.6px; fill:var(--tone); transition:fill .5s; }
/* Moderna: banda de color */
.lm-bg { fill:var(--tone); transition:fill .5s; }
.lm-paper { fill:#f4f1e8; }
.lm-stripe { fill:var(--tone-2); transition:fill .5s; }
.lm-top { font:700 8.5px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:3px; fill:rgba(255,255,255,.78); }
.lm-brand { font:800 20px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:.4px; text-transform:uppercase; fill:#fff; }
.lm-product { font:800 9.5px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:1.3px; fill:rgba(255,255,255,.9); text-transform:uppercase; }
.pk-lata .lm-product { fill:var(--tone); font-size:10.5px; }
.lm-window { fill:none; stroke:#fff; stroke-width:4; }
.lm-for { font:700 8px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:2px; fill:#596b5d; }
.lm-num { font:500 24px 'Fraunces','Fraunces Fallback',serif; fill:var(--tone); transition:fill .5s; }
/* Natural: papel kraft */
.ln-bg { fill:#d9c39c; }
.ln-edge { fill:none; stroke:#6b4a26; stroke-width:1.2; stroke-dasharray:4 3; opacity:.75; }
.ln-string { fill:none; stroke:#8a6a44; stroke-width:1.6; }
.ln-hole { fill:#f4efe3; stroke:#8a6a44; }
.ln-leaf { fill:#5f7a3a; stroke:#5f7a3a; stroke-width:1.2; stroke-linecap:round; }
.ln-brand { font:500 20px 'Fraunces','Fraunces Fallback',Georgia,serif; fill:#4a3520; }
.ln-product { font:700 8.5px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:1.4px; fill:#6b4a26; }
.ln-window { fill:none; stroke:#6b4a26; stroke-width:1.4; }
/* Controles */
.px-packs { display:flex; flex-wrap:wrap; gap:8px; }
.px-pack { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--bg); border-radius:12px; padding:8px 14px 8px 10px; font-size:13px; font-weight:600; color:var(--ink); transition:background .25s,color .25s,border-color .25s; }
.px-pack svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linejoin:round; }
.px-pack[aria-pressed='true'] { background:var(--ink); border-color:var(--ink); color:#fff; }
.px-styles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.mediterranean .px-style { display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:10px; align-items:center; text-align:left; padding:9px 10px; }
.mediterranean .px-style span { grid-row:span 2; width:30px; height:38px; border-radius:5px; border:1px solid rgba(15,43,33,.18); }
.px-style b { font-size:13px; }
.px-style small { font-size:10.5px; color:var(--muted); font-weight:500; line-height:1.3; }
.mediterranean .px-style[data-style='clasica'] span { background:radial-gradient(ellipse 42% 30% at 50% 55%,#fbf8ef 88%,#a8492a 90%,#a8492a 96%,transparent 98%),#efe8d6; }
.mediterranean .px-style[data-style='moderna'] span { background:linear-gradient(170deg,#193d30 0 58%,#e9a53a 58% 64%,#f4f1e8 64%); }
.mediterranean .px-style[data-style='natural'] span { background:#d9c39c; outline:1px dashed #6b4a26; outline-offset:-5px; }
.px-ref .px-brand-steps { margin:4px 0 0; padding-top:14px; border-top:1px dashed #e0d8c6; grid-template-columns:1fr; gap:8px; }
.px-ref .px-brand-steps li { font-size:13px; }
@media (max-width:600px) {
  .px-styles { grid-template-columns:1fr; }
}

/* ================= RONDA 7 ================= */
/* Empresa · cabecera compacta, a la escala del resto de páginas */
.cx-hero-compact { padding-block:30px 72px; }
.cx-hero-compact .cx-hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:70px; align-items:end; margin-top:30px; }
.cx-hero-compact h1 { margin:20px 0 0; font-size:clamp(44px,4.8vw,76px); }
.cx-hero-compact .cx-words { max-width:none; font-size:clamp(18px,1.45vw,22px); line-height:1.55; margin:0; }
.cx-hero-compact .cx-facts { grid-template-columns:auto repeat(3,auto); justify-content:space-between; gap:10px 26px; margin-top:26px; padding-top:20px; border-top:1px solid var(--line); }
.cx-fact-year dd { margin-top:0; }
.cx-year-mini { display:block; font:500 46px/.9 'Fraunces','Fraunces Fallback',Georgia,serif; letter-spacing:-.04em; color:var(--accent); background:url(images/mediterranean/familia-conservas.webp) 30% 45%/260% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.mx-motion .cx-year-mini { animation:cx-drift 18s ease-in-out infinite alternate; }

/* Productos · estudio realista */
.px-chip img { width:28px; height:28px; border-radius:50%; object-fit:cover; background:#fff; margin:-4px 0 -4px -8px; box-shadow:0 0 0 2px #fff; }
.px-more { margin-top:12px; }
.px-more summary { cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; color:var(--accent); }
.px-more summary::-webkit-details-marker { display:none; }
.px-more summary::after { content:'+'; font-size:16px; line-height:1; transition:rotate .3s; }
.px-more[open] summary::after { rotate:45deg; }
.px-more .px-chips { margin-top:10px; }
.px-any { margin-top:14px; font-size:13px; line-height:1.55; color:var(--muted); }
.px-any strong { color:var(--ink); }
.px-other { margin-top:10px; }
.px-other label { display:block; font-size:11px; font-weight:700; color:var(--muted); margin-bottom:4px; }
.mediterranean .px-other input { width:100%; padding:9px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; font:500 14px 'DM Sans','DM Sans Fallback',sans-serif; color:var(--ink); }
.mediterranean .px-other input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 4px rgba(39,88,61,.12); }
.px-shelf.is-real .px-shelf-stage { width:min(470px,100%); padding:34px 0 34px; border-radius:30px; background:radial-gradient(90% 70% at 50% 30%,#fffdf8 0,#f3ecdd 55%,#e5dac4 100%); box-shadow:inset 0 -60px 60px -40px rgba(120,90,50,.18); perspective:900px; overflow:hidden; }
.px-shelf.is-real .px-shelf-stage::before { display:none; }
.px-shelf.is-real .px-shelf-board { left:-10%; right:-10%; bottom:0; height:92px; border-radius:0; background:linear-gradient(180deg,#cdb391 0,#b8976d 30%,#9c7a52 100%); box-shadow:inset 0 3px 0 rgba(255,255,255,.35),inset 0 18px 30px -20px rgba(0,0,0,.35); transform:perspective(500px) rotateX(38deg); transform-origin:bottom; z-index:0; }
.px-shelf.is-real .px-jar { width:72%; z-index:1; margin-bottom:10px; transform:rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg)); transition:transform .5s var(--ease); animation:none !important; }
.px-shelf.is-real .r-spec { transform:translateX(var(--sx,0px)); transition:transform .5s var(--ease); }
.r-liquid { fill:var(--liquid,#c9bf7e); transition:fill .6s; }
.r-liquid-over { fill:var(--liquid,#c9bf7e); opacity:.28; mix-blend-mode:multiply; transition:fill .6s; }
.mx-motion .r-fill.pour image { animation:jar-pour .7s cubic-bezier(.3,1.2,.5,1) both; }
.mx-motion .r-fill.pour image:nth-child(3n) { animation-delay:.06s; } .mx-motion .r-fill.pour image:nth-child(3n+1) { animation-delay:.12s; }
.can-strip { transition:transform .12s linear; }
.cb-brand { font:italic 400 15px 'Fraunces','Fraunces Fallback',Georgia,serif; }
.lbl-moderna .cb-brand { font:800 13px 'Manrope','Manrope Fallback',sans-serif; text-transform:uppercase; font-style:normal; }
.cb-small { font:700 6.5px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:1.6px; opacity:.75; }
.cb-brand-2 { font:700 8px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:1px; }
.cb-text { font:500 8px 'DM Sans','DM Sans Fallback',sans-serif; opacity:.8; }
.cb-code rect { fill:#111; }
.cb-code rect:first-child { fill:#fff; }
.cb-code text { font:500 6px 'DM Sans','DM Sans Fallback',sans-serif; fill:#111; letter-spacing:.8px; }
.px-rotate-hint { position:absolute; left:50%; bottom:14px; translate:-50% 0; z-index:2; padding:5px 12px; border-radius:99px; background:rgba(255,255,255,.75); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); font-size:11px; font-weight:600; color:var(--ink); opacity:0; transition:opacity .4s; pointer-events:none; }
.px-shelf.is-real[data-pack='lata'] .px-rotate-hint { opacity:1; }
@media (hover:none) { .px-rotate-hint { content:''; } }
@media (max-width:900px) {
  .cx-hero-compact .cx-hero-grid { grid-template-columns:1fr; gap:24px; }
  .cx-hero-compact .cx-facts { grid-template-columns:repeat(2,auto); justify-content:start; }
}
@media (max-width:900px) { .px-studio .px-shelf { order:-1; } .px-shelf.is-real .px-shelf-stage { width:min(360px,100%); margin-inline:auto; } }

/* ================= RONDA 8 · Compradores y fabricantes ================= */
.aud-switch { display:inline-flex; gap:4px; padding:5px; border:1px solid var(--line); border-radius:99px; background:#fff; box-shadow:0 10px 24px -18px rgba(15,43,33,.35); max-width:100%; }
.aud-switch button { border:0; background:transparent; border-radius:99px; padding:9px 18px; font:600 13px 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.01em; color:#4c5f51; transition:background .3s,color .3s; }
.aud-switch button:hover { color:var(--ink); }
.aud-switch button[aria-pressed='true'] { background:var(--ink); color:#fff; }
.aud-ready [data-show]:not(.is-on) { display:none !important; }
.aud-label { font:700 11px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--earth); margin:10px 0 18px; }
.aud-ready .aud-label { display:none; }
.mx-motion .aud-in { animation:aud-in .6s var(--ease) both; }
@keyframes aud-in { from { opacity:0; transform:translateY(14px); } }
.mx-hero-copy .aud-switch { margin:0 0 24px; }
.cx-proof .aud-switch,.sx-process .aud-switch { margin:-10px 0 34px; }
.sx-docs .aud-switch { margin:4px 0 22px; }
.sx-process.is-rail .aud-switch { margin:-14px 0 22px; }
/* Puente: lo que gana cada parte */
.mx-gain { margin:18px 0 0; padding:12px 14px; border-radius:12px; background:var(--soft); font-size:13px; line-height:1.5; color:var(--ink); }
.mx-gain span { display:block; font:700 10px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--earth); margin-bottom:3px; }
/* Inicio · para fabricantes */
.mx-maker { position:relative; overflow:hidden; background:linear-gradient(#f8f8f2,#f1ede1); }
.mx-maker::before { content:''; position:absolute; right:-220px; top:-220px; width:640px; height:640px; border-radius:50%; background:radial-gradient(circle,rgba(233,165,58,.13),transparent 65%); pointer-events:none; }
.mx-maker .section-heading h2 { max-width:18ch; }
.mx-strengths { position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.mx-strength { position:relative; padding:28px 26px 26px; background:#fff; border:1px solid #e6e2d4; border-radius:22px; transition:transform .5s var(--ease),box-shadow .5s,border-color .3s; }
.mx-strength:hover { transform:translateY(-6px); box-shadow:0 30px 50px -35px rgba(15,43,33,.45); border-color:#cfd9c8; }
.mx-strength-icon { display:grid; place-items:center; width:52px; height:52px; border-radius:16px; background:var(--deep); color:var(--citrus); margin-bottom:22px; transition:transform .5s var(--ease); }
.mx-strength:hover .mx-strength-icon { transform:rotate(-8deg) scale(1.06); }
.mx-strength-icon svg,.px-maker-note svg,.px-maker-strip svg { width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.mx-strength-n { position:absolute; top:24px; right:24px; font:400 30px 'Fraunces','Fraunces Fallback',serif; color:#8a7f64; }
.mx-strength h3 { font:600 21px/1.2 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.035em; max-width:16ch; }
.mx-strength p { margin-top:10px; font-size:14px; line-height:1.7; color:var(--muted); }
.mx-promise { display:flex; align-items:center; gap:16px; margin:22px 0 40px; padding:18px 24px; border-radius:18px; border:1px dashed #b9c6b0; background:rgba(255,255,255,.6); }
.mx-promise svg { flex:none; width:34px; height:34px; padding:7px; border-radius:50%; background:var(--accent); fill:none; stroke:#fff; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.mx-promise p { font-size:15px; line-height:1.6; color:var(--ink); max-width:none; }
.mx-needs { position:relative; padding:34px 36px 30px; border-radius:28px; background:radial-gradient(70% 90% at 100% 0%,#1e4838,transparent 70%),var(--deep); color:var(--cream); box-shadow:0 50px 90px -50px rgba(15,43,33,.8); }
.mx-needs-head { display:flex; justify-content:space-between; align-items:end; gap:24px; flex-wrap:wrap; margin-bottom:26px; }
.mx-needs .kicker { color:var(--citrus); font-size:10px; font-weight:700; }
.mx-needs h3 { font:600 clamp(26px,2.4vw,36px)/1.1 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.04em; color:#fff; margin-top:8px; }
.mx-needs-head p { color:#c9d8cc; font-size:14px; margin-top:6px; }
.mx-needs-tabs { display:inline-flex; flex-wrap:wrap; gap:4px; padding:5px; border-radius:22px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); }
.mx-needs-tab { border:0; background:transparent; color:#dbe6de; border-radius:99px; padding:9px 16px; font:600 13px 'Manrope','Manrope Fallback',sans-serif; transition:background .3s,color .3s; }
.mx-needs-tab[aria-selected='true'] { background:var(--citrus); color:var(--deep); }
.mx-needs-tab:focus-visible { outline-color:var(--citrus); }
.mx-needs-panel + .mx-needs-panel { margin-top:34px; }
.mx-needs.is-tabbed .mx-needs-panel + .mx-needs-panel { margin-top:0; }
.mx-needs.is-tabbed .mx-needs-name { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.mx-needs-panel:focus-visible { outline:2px solid var(--citrus); outline-offset:8px; border-radius:12px; }
.mx-needs-name { font:600 18px 'Manrope','Manrope Fallback',sans-serif; color:#fff; margin-bottom:6px; }
.mx-needs-who { color:var(--mint); font-size:14px; margin-bottom:20px; }
.mx-needs-cols { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.mx-needs-col { padding:18px 18px 16px; border-radius:18px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); }
.mx-needs-col h5 { font:700 10px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--citrus); margin:0 0 12px; }
.mx-needs-col ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.mx-needs-col li { position:relative; padding-left:16px; font-size:13.5px; line-height:1.5; color:#eef3ef; }
.mx-needs-col li::before { content:''; position:absolute; left:0; top:.5em; width:7px; height:7px; border-radius:2px; background:var(--citrus); transform:rotate(45deg); }
.mx-motion .mx-needs-panel.cascade li { animation:needs-in .55s var(--ease) both; animation-delay:calc(var(--i) * 45ms); }
@keyframes needs-in { from { opacity:0; transform:translateX(-12px); } }
.mx-needs-value { margin-top:18px; padding:14px 18px; border-radius:14px; background:rgba(233,165,58,.12); border-left:3px solid var(--citrus); font-size:14px; line-height:1.6; color:#f5f1e4; max-width:none; }
.mx-maker-actions { display:flex; flex-wrap:wrap; gap:16px 26px; align-items:center; margin-top:34px; }
/* Productos */
.px-maker-note { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:-14px 0 22px; padding:12px 18px; border-radius:14px; background:var(--soft); font-size:13.5px; max-width:none; color:var(--ink); }
.px-maker-note svg,.px-maker-strip svg { color:var(--accent); flex:none; width:22px; height:22px; }
.px-maker-note a,.px-maker-strip a { margin-left:auto; font-weight:700; color:var(--accent); white-space:nowrap; }
.px-maker-note a:hover,.px-maker-strip a:hover { text-decoration:underline; text-underline-offset:3px; }
.px-maker-strip { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:34px 0 0; padding:16px 22px; border-radius:18px; border:1px dashed rgba(90,60,20,.3); background:rgba(255,255,255,.6); font-size:14px; max-width:none; color:var(--ink); }
.pd-maker { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-top:20px; padding:14px 18px; border-radius:14px; border:1px dashed var(--line); font-size:13.5px; color:var(--ink); transition:border-color .3s,background .3s; }
.pd-maker:hover { border-color:var(--accent); background:#fff; }
.pd-maker strong { color:var(--accent); white-space:nowrap; }
.fx-maker { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:50px; align-items:center; padding:44px; border-radius:28px; background:radial-gradient(70% 90% at 100% 0%,#1e4838,transparent 70%),var(--deep); color:var(--cream); }
.fx-maker .eyebrow { color:var(--citrus); }
.fx-maker h2 { color:#fff; margin:16px 0; }
.fx-maker h2 em { color:var(--citrus); }
.fx-maker p { color:#c9d8cc; line-height:1.8; margin-bottom:24px; }
.fx-maker .button { background:var(--citrus); color:var(--deep); }
.fx-maker-data h3 { font:700 10px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--mint); margin:0 0 12px; }
.fx-chips { list-style:none; margin:0 0 24px; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.fx-chips:last-child { margin-bottom:0; }
.fx-chips li { padding:8px 14px; border-radius:99px; border:1px solid rgba(255,255,255,.24); font-size:13px; font-weight:600; color:#fff; transition:background .3s,border-color .3s; }
.fx-chips li:hover { background:rgba(233,165,58,.15); border-color:var(--citrus); }
.fx-chips-soft li { background:rgba(255,255,255,.07); border-color:transparent; color:#dbe6de; }
/* Contacto */
.faq-group { font:700 11px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--earth); margin:30px 0 4px; }
.faq-group:first-child { margin-top:0; }
@media (max-width:1100px) {
  .mx-strengths { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mx-needs-cols { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .fx-maker { grid-template-columns:1fr; gap:28px; padding:30px 24px; }
}
@media (max-width:600px) {
  .mx-strengths,.mx-needs-cols { grid-template-columns:1fr; }
  .mx-needs { padding:26px 20px; }
  .aud-switch button { padding:8px 12px; font-size:12.5px; }
  .px-maker-note a,.px-maker-strip a { margin-left:0; }
  .mx-promise { align-items:flex-start; }
}
.sx-panel:focus { outline:none; }
.sx-panel:focus-visible { outline:2px solid var(--line); outline-offset:12px; border-radius:28px; }

/* ================= RONDA 9 · Un modo para toda la web: comprador o fabricante ================= */
html[data-aud='compro'] [data-show='fabrico'],html[data-aud='fabrico'] [data-show='compro'] { display:none !important; }
html[data-aud] .aud-label { display:none; }
.mx-motion .aud-swap { animation:aud-swap .75s var(--ease) both; }
@keyframes aud-swap { from { opacity:0; transform:translateY(18px); filter:blur(6px); } }
/* Hover con «translate» para no chocar con los revelados que usan «transform» */
.mx-strength { transition:translate .5s var(--ease),box-shadow .5s,border-color .3s,opacity .9s var(--ease),transform 1.1s var(--ease),clip-path 1.3s var(--ease),filter 1.2s var(--ease); }
.mx-strength:hover { transform:none; translate:0 -6px; }
/* Inicio · ¿Compras o fabricas? */
.mx-choose { position:relative; overflow:hidden; background:radial-gradient(60% 80% at 50% 0%,#eaeede,transparent 70%),var(--bg); }
.mx-choose-head { max-width:660px; margin:0 auto 48px; text-align:center; }
.mx-choose-head .eyebrow { justify-content:center; }
.mx-choose-head :is(h1,h2) { font-size:clamp(44px,5.2vw,82px); line-height:.98; letter-spacing:-.065em; margin:18px 0 20px; }
.mx-choose-head :is(h1,h2) em { color:var(--accent); }
.mx-choose-head p { margin-inline:auto; color:var(--muted); font-size:16px; line-height:1.7; }
.mx-choose-cards { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.mx-choice { all:unset; box-sizing:border-box; position:relative; display:flex; flex-direction:column; cursor:pointer; overflow:hidden; isolation:isolate; border-radius:28px; background:#fff; border:1px solid #e3e4d6; box-shadow:0 30px 60px -45px rgba(15,43,33,.45); transition:translate .6s var(--ease),box-shadow .6s,background-color .5s,border-color .4s,opacity .5s,filter .5s,transform 1.1s var(--ease); }
.mx-choice:hover { translate:0 -6px; box-shadow:0 40px 70px -40px rgba(15,43,33,.55); }
.mx-choice:focus-visible { outline:3px solid var(--citrus); outline-offset:4px; }
.mx-choice-img { display:block; aspect-ratio:16/9; overflow:hidden; }
.mx-choice-img img { width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease),filter .5s; }
.mx-choice:hover .mx-choice-img img { transform:scale(1.06); }
.mx-choice-body { display:flex; flex-direction:column; gap:10px; padding:26px 30px 30px; }
.mx-choice-k { font:700 10px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--earth); transition:color .4s; }
.mx-choice strong { font:600 clamp(28px,2.8vw,42px)/1.04 'Manrope','Manrope Fallback',sans-serif; letter-spacing:-.05em; color:var(--ink); transition:color .4s; }
.mx-choice-d { font-size:15px; line-height:1.65; color:var(--muted); max-width:46ch; transition:color .4s; }
.mx-choice-go { display:inline-flex; gap:12px; align-items:center; margin-top:8px; font-size:13px; font-weight:700; color:var(--accent); transition:color .4s,gap .4s; }
.mx-choice:hover .mx-choice-go { gap:18px; }
.mx-choice-check { position:absolute; top:18px; right:18px; display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:var(--citrus); box-shadow:0 8px 20px -8px rgba(0,0,0,.4); opacity:0; transform:scale(.5) rotate(-30deg); transition:transform .55s cubic-bezier(.3,1.6,.5,1),opacity .3s; }
.mx-choice-check svg { width:22px; fill:none; stroke:var(--deep); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.mx-choice[aria-checked='true'] { background:var(--deep); border-color:var(--deep); box-shadow:0 50px 90px -45px rgba(15,43,33,.8); }
.mx-choice[aria-checked='true'] strong { color:#fff; }
.mx-choice[aria-checked='true'] .mx-choice-k,.mx-choice[aria-checked='true'] .mx-choice-go { color:var(--citrus); }
.mx-choice[aria-checked='true'] .mx-choice-d { color:#c9d8cc; }
.mx-choice[aria-checked='true'] .mx-choice-check { opacity:1; transform:none; }
.mx-choice[aria-checked='false'] { opacity:.8; }
.mx-choice[aria-checked='false'] .mx-choice-img img { filter:saturate(.55); }
.mx-choice[aria-checked='false']:hover { opacity:1; }
.mx-choice[aria-checked='false']:hover .mx-choice-img img { filter:none; }
.mx-choose-or { position:absolute; left:50%; top:50%; z-index:2; translate:-50% -50%; display:grid; place-items:center; width:58px; height:58px; border-radius:50%; background:var(--bg); border:1px solid var(--line); font:italic 400 22px 'Fraunces','Fraunces Fallback',serif; color:var(--ink); box-shadow:0 12px 30px -12px rgba(15,43,33,.45); pointer-events:none; }
.mx-motion .mx-choice.rv[data-aud='compro']:not(.in) { transform:translateX(-70px) rotate(-1.5deg); }
.mx-motion .mx-choice.rv[data-aud='fabrico']:not(.in) { transform:translateX(70px) rotate(1.5deg); }
/* Pastilla fija: en qué modo estás y cambio rápido */
.aud-pill { position:fixed; left:18px; bottom:18px; z-index:70; display:flex; align-items:center; gap:10px; padding:7px 7px 7px 14px; border-radius:99px; background:rgba(15,43,33,.93); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); color:var(--cream); font-size:12.5px; box-shadow:0 20px 40px -18px rgba(0,0,0,.55); transition:translate .55s var(--ease),opacity .4s,bottom .4s var(--ease); }
.aud-pill.is-away { translate:0 160%; opacity:0; pointer-events:none; }
.aud-pill-dot { width:8px; height:8px; border-radius:50%; background:var(--citrus); box-shadow:0 0 0 4px rgba(233,165,58,.2); }
.aud-pill strong { color:#fff; }
.aud-pill button { border:0; border-radius:99px; background:var(--citrus); color:var(--deep); padding:7px 13px; font:700 12px 'Manrope','Manrope Fallback',sans-serif; transition:filter .2s; }
.aud-pill button:hover { filter:brightness(1.08); }
.aud-pill button:focus-visible { outline:2px solid #fff; outline-offset:2px; }
body.has-tray .aud-pill { bottom:150px; }
@media (max-width:900px) {
  .mx-choose-cards { grid-template-columns:1fr; gap:18px; }
  .mx-choose-or { width:46px; height:46px; font-size:18px; }
  .mx-motion .mx-choice.rv[data-aud]:not(.in) { transform:translateY(30px); }
}
@media (max-width:600px) {
  .mx-choice-body { padding:22px 22px 24px; }
  .aud-pill { left:10px; right:10px; bottom:10px; justify-content:space-between; }
  .aud-pill-text { font-size:11.5px; }
  body.has-tray .aud-pill { bottom:auto; top:84px; }
}

/* ================= RONDA 10 · La elección como puerta ================= */
.header-cta .cta-neutral { display:none; }
html:not([data-aud]) .header-cta [data-show] { display:none !important; }
html:not([data-aud]) .header-cta .cta-neutral { display:inline; }
.mx-choose--gate { display:none; }
html.aud-gate .mx-choose--gate { display:block; }
html.aud-gate main > .mx-choose--home ~ * { display:none !important; }
html.aud-gate main.gate-page > :not(.mx-choose) { display:none !important; }
html.aud-gate [data-show='fabrico'] { display:none !important; }
html.aud-gate .aud-pill { display:none !important; }
html[data-aud] .mx-choose--gate { display:none; }
html[data-aud='fabrico'] .sx-tabs { display:none !important; }
.mx-choose--gate { min-height:calc(100vh - 88px); padding-block:64px 100px; }
.mx-choose--gate .mx-choose-head :is(h1,h2) { font-size:clamp(40px,4.6vw,70px); }
.mx-choose--gate .eyebrow { color:var(--earth); }
.mx-motion .mx-choose--gate .mx-choose-head { animation:mx-fade-up 1s var(--ease) both; }
.mx-motion .mx-choose--gate .mx-choice { animation:gate-card 1s var(--ease) both; animation-delay:.18s; }
.mx-motion .mx-choose--gate .mx-choice[data-aud='fabrico'] { animation-delay:.3s; }
@keyframes gate-card { from { opacity:0; transform:translateY(46px) scale(.97); } }
.mx-motion .gate-in { animation:gate-in .9s var(--ease) both; animation-delay:calc(min(var(--gi,0),4) * 70ms); }
@keyframes gate-in { from { opacity:0; transform:translateY(46px); } }
/* Sin elección no se atenúa ninguna tarjeta; con elección, la no elegida queda en segundo plano */
.mx-choice[aria-checked='false'] { opacity:1; }
.mx-choice[aria-checked='false'] .mx-choice-img img { filter:none; }
.mx-choose-cards:has([aria-checked='true']) .mx-choice[aria-checked='false'] { opacity:.8; }
.mx-choose-cards:has([aria-checked='true']) .mx-choice[aria-checked='false'] .mx-choice-img img { filter:saturate(.55); }
.mx-choose-cards:has([aria-checked='true']) .mx-choice[aria-checked='false']:hover { opacity:1; }
.ctx-routes { grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
/* Sin elección, el pie conserva solo lo legal */
html.aud-gate .site-footer .footer-top,html.aud-gate .site-footer .footer-wordmark { display:none; }
@media (max-width:640px) {
  .mx-choose--gate { min-height:0; padding-block:36px 64px; }
  .mx-choose--gate .mx-choose-head { margin-bottom:28px; }
  .mx-choose--gate .mx-choose-head :is(h1,h2) { font-size:clamp(34px,10vw,44px); }
  .mx-choose--gate .mx-choice-img { aspect-ratio:16/7; }
}

/* ================= RONDA 11 · Logotipo de las cuatro piezas ================= */
.mediterranean .brand { gap:12px; }
.mediterranean .brand-symbol { width:40px; height:44px; transition:transform .6s var(--ease); }
.mediterranean .brand:hover .brand-symbol { transform:rotate(-8deg) scale(1.06); }
.mx-hub-mark .ibf-mark { width:54px; height:auto; filter:drop-shadow(0 6px 10px rgba(0,0,0,.35)); }
.mx-badge>span { width:46px; }
.mx-badge>span .ibf-mark { display:block; width:100%; height:auto; }
@media (max-width:850px) { .mediterranean .brand-symbol { width:34px; height:38px; } }
@media (max-width:640px) { .mx-badge>span { width:36px; } }
@media (prefers-reduced-motion:reduce) { .mediterranean .brand:hover .brand-symbol { transform:none; } }
/* La barra de lectura lleva los cuatro colores del logotipo, en el orden de sus piezas */
.mx-progress { background:linear-gradient(90deg,#fdce03 0 25%,#03b91e 25% 50%,#006cfb 50% 75%,#fe8602 75%); }

/* ================= RONDA 12 · Acabado ================= */
/* Página preparada en segundo plano: las entradas esperan a que se muestre */
html.mx-prerender *,html.mx-prerender *::before,html.mx-prerender *::after { animation-play-state:paused !important; }
/* Tipografía: titulares equilibrados, párrafos sin viudas, cifras que no bailan */
:root { color-scheme:light; }
html { scrollbar-gutter:stable; }
.mediterranean { font-kerning:normal; font-optical-sizing:auto; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; -webkit-tap-highlight-color:transparent; }
.mediterranean :is(h1,h2,h3,h4,.kicker,.eyebrow,blockquote) { text-wrap:balance; }
.mediterranean :is(p,li,dd,figcaption,summary,label) { text-wrap:pretty; }
.mediterranean :is([data-count],.px-stats strong,.mx-figures strong,time,.ctx-clock) { font-variant-numeric:tabular-nums; }
.mediterranean ::selection { background:rgba(233,165,58,.32); color:inherit; }
.mediterranean [id] { scroll-margin-top:96px; }
.mediterranean dialog { overscroll-behavior:contain; }
/* Contacto: copiar el correo */
.ctx-mail { position:relative; display:flex; }
.ctx-mail a { flex:1; padding-right:104px; }
.ctx-mailcopy { position:absolute; top:50%; right:12px; translate:0 -50%; display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 14px; border:1px solid var(--line); border-radius:99px; background:var(--bg); color:var(--ink); font:700 12px 'DM Sans','DM Sans Fallback',sans-serif; cursor:pointer; transition:background-color .25s,border-color .25s,color .25s; }
.ctx-mailcopy:hover { border-color:var(--accent); }
.ctx-mailcopy.is-done { background:var(--deep); border-color:var(--deep); color:var(--cream); }
/* Pastilla de perfil: se aparta al bajar leyendo y vuelve al subir */
.aud-pill { transition:translate .45s var(--ease),opacity .35s; }
.aud-pill.is-tucked { translate:0 160%; opacity:0; pointer-events:none; }
@media (max-width:640px) { .aud-pill.is-tucked { translate:0 calc(100% + 24px); } }
/* Listas numeradas de marca propia (briefing y referenciación) */
.med-documentation li>strong { font:400 26px/1 'Fraunces','Fraunces Fallback',Georgia,serif; color:var(--accent); letter-spacing:-.02em; }
@media (max-width:640px) { .med-documentation li { grid-template-columns:48px 1fr; } .med-documentation li>strong { font-size:22px; } }
.med-documentation li:has(>strong) { grid-template-columns:56px 1fr; }
/* Selector de perfil en la cabecera */
.hdr-end { display:flex; align-items:center; gap:14px; }
.hdr-aud { display:none; padding:3px; border:1px solid var(--line); border-radius:99px; background:rgba(255,255,255,.6); }
.hdr-aud button { position:relative; min-height:34px; padding:0 13px; border:0; border-radius:99px; background:transparent; color:var(--muted); font:600 12px 'DM Sans','DM Sans Fallback',sans-serif; cursor:pointer; transition:background-color .3s var(--ease),color .3s; }
.hdr-aud button:hover { color:var(--ink); }
.hdr-aud button[aria-pressed='true'] { background:var(--deep); color:var(--cream); }
@media (min-width:1180px) {
  html[data-aud] .hdr-aud { display:inline-flex; }
  .aud-pill { display:none !important; }
}
html.aud-gate .hdr-aud { display:none !important; }
.hdr-aud-label { display:none; }
@media (max-width:1179px) {
  html[data-aud] .hdr-aud--menu { display:inline-flex; margin-top:26px; }
  html[data-aud] .hdr-aud-label { display:block; margin:30px 0 0 !important; font:700 10px 'DM Sans','DM Sans Fallback',sans-serif !important; letter-spacing:.14em; text-transform:uppercase; }
  .hdr-aud--menu + p { margin-top:26px; }
  .hdr-aud--menu button { min-height:42px; padding:0 18px; font-size:14px; }
}
/* Catálogo: pie de tarjeta en una fila, familia como enlace, etiqueta de conservación legible */
.px-catalog .med-product-family { display:block; width:fit-content; min-height:0; font-size:10px; font-weight:700; letter-spacing:.1em; line-height:1.4; color:var(--earth); text-decoration:none; }
.px-catalog a.med-product-family:hover { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.px-catalog .med-product-actions { display:flex; flex-wrap:nowrap; align-items:center; justify-content:space-between; gap:10px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.px-catalog .med-product-actions>[data-show] { display:inline-flex; }
.px-catalog .med-product-actions .text-link { display:inline-flex; align-items:center; gap:8px; min-height:34px; padding:0; border:0; font-size:12.5px; }
.px-catalog .med-product-actions .text-link:hover { gap:12px; color:var(--accent); }
@media (max-width:640px) {
  .px-catalog .med-product-card .product-info p { min-height:0; }
  .px-catalog .med-product-actions { gap:6px; }
  .px-catalog .med-product-actions .text-link { font-size:12px; gap:5px; }
  .px-catalog .px-add { padding:4px 10px 4px 5px; }
}
/* Pie: enlace de acción como el resto de enlaces con flecha y fila legal legible y pulsable */
.mediterranean .footer-col .text-link { display:inline-flex; width:fit-content; gap:12px; margin-top:8px; line-height:1.4; color:var(--ink); }
.mediterranean .footer-col .text-link:hover { gap:18px; text-decoration:none; }
.mediterranean .footer-bottom { font-size:12px; }
@media (max-width:640px) {
  .mediterranean .footer-bottom { font-size:12px; gap:4px; }
  .mediterranean .lx-footer-legal { gap:0 22px; }
  .mediterranean .lx-footer-legal a, .mediterranean .footer-bottom>a { display:inline-flex; align-items:center; min-height:44px; }
}
.mediterranean br.br-keep { display:inline !important; }
/* Titulares de tracking muy cerrado: un poco más de aire entre palabras */
.mediterranean :is(h1,h2) { word-spacing:.06em; }
/* Elegidor: la opción no elegida pierde color en la foto, no legibilidad en el texto */
.mx-choose-cards:has([aria-checked='true']) .mx-choice[aria-checked='false'] { opacity:1; }
.mx-choose-cards:has([aria-checked='true']) .mx-choice[aria-checked='false'] .mx-choice-img img { filter:saturate(.35) brightness(1.04); }
/* Contacto en móvil: correo y teléfono con el mismo ancho */
@media (max-width:640px) { .ctx-direct>* { flex:1 1 100%; } }
@media (max-width:640px) {
  /* Tarjetas estrechas: «Añadir» como botón de icono (el nombre accesible se mantiene) y sin etiqueta sobre la foto */
  .px-grid:not(.is-list) .px-card-cons { display:none; }
  .px-catalog .px-add { padding:5px; }
  .px-catalog .px-add .px-add-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
  .px-catalog .px-add-icon { width:24px; height:24px; }
  .mediterranean .footer-col .text-link { white-space:nowrap; }
}
.ctx-grid>* { min-width:0; }
@media (max-width:640px) {
  .ctx-mail a { padding-right:22px; }
  .ctx-mailcopy { top:10px; translate:none; min-height:28px; padding:0 11px; font-size:11px; }
}
/* Calendario: clave de colores en los filtros, aviso de filas atenuadas y nombres completos en móvil */
.mx-chip .mx-dot { width:7px; height:7px; margin:0 7px 0 0; }
.mx-chip[aria-pressed='true'] .mx-dot { box-shadow:0 0 0 2px rgba(255,255,255,.7); }
.mx-season-hint { display:block; margin-top:2px; font-size:12px; opacity:.8; }
@media (max-width:640px) {
  .mx-season-table tr>:first-child { width:112px; }
  .mx-season-table tbody th { white-space:normal; overflow:visible; text-overflow:clip; font-size:13px; line-height:1.2; padding-right:10px; }
}
.aud-pill { transition:translate .45s var(--ease),opacity .35s,visibility 0s; }
.aud-pill.is-tucked { visibility:hidden; transition:translate .45s var(--ease),opacity .35s,visibility 0s linear .45s; }
html:not(.mx-motion) .aud-pill,html:not(.mx-motion) .aud-pill.is-tucked { transition:none; }

/* ================= RONDA 13 · Idiomas ================= */
.lang-menu { position:relative; }
.lang-menu summary { list-style:none; display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:0 13px 0 11px; border:1px solid var(--line); border-radius:99px; background:rgba(255,255,255,.6); color:var(--ink); font:700 12px 'DM Sans','DM Sans Fallback',sans-serif; letter-spacing:.06em; cursor:pointer; transition:border-color .25s,background-color .25s; }
.lang-menu summary::-webkit-details-marker { display:none; }
.lang-menu summary:hover,.lang-menu[open] summary { border-color:var(--deep); background:#fff; }
.lang-menu summary svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.4; }
.lang-list { position:absolute; right:0; top:calc(100% + 8px); z-index:60; display:grid; min-width:190px; padding:6px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 24px 50px -24px rgba(15,43,33,.35); }
.lang-list a { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 12px; border-radius:10px; color:var(--ink); font-size:14px; }
.lang-list a:hover { background:var(--soft); }
.lang-list a[aria-current] { color:var(--accent); font-weight:700; }
.lang-list a[aria-current]::after { content:''; width:6px; height:10px; margin-right:3px; border:solid currentColor; border-width:0 2px 2px 0; rotate:45deg; translate:0 -2px; }
.mx-motion .lang-menu[open] .lang-list { animation:lang-pop .28s var(--ease) both; }
@keyframes lang-pop { from { opacity:0; translate:0 -6px; } }
.lang-row { display:flex; flex-wrap:wrap; gap:8px; }
.lang-row a span { display:none; }
.mobile-nav .lang-row { margin-top:22px; }
.mobile-nav .lang-row a { display:inline-flex; align-items:center; min-height:40px; padding:0 15px; border:1px solid var(--line); border-radius:99px; font:600 14px 'DM Sans','DM Sans Fallback',sans-serif; }
.mobile-nav .lang-row a[aria-current] { border-color:var(--deep); background:var(--deep); color:var(--cream); }
.lang-row--footer { gap:4px 18px; }
.lang-row--footer a { color:var(--muted); }
.lang-row--footer a[aria-current] { color:var(--ink); font-weight:700; }
.lang-row--footer a:hover { color:var(--accent); }
.lang-legal-note { max-width:880px; margin:26px auto 0; padding:14px 18px; border-left:3px solid var(--citrus); border-radius:0 12px 12px 0; background:var(--soft); color:var(--ink); font-size:14px; line-height:1.6; }
@media (max-width:1100px) { .lang-legal-note { margin-inline:var(--gutter); } }
/* Idiomas de palabras largas: guionado en titulares y corte seguro en espacios estrechos */
:is(:lang(de),:lang(fr)) :is(h1,h2,h3,.kicker,.eyebrow,button,.button) { hyphens:auto; -webkit-hyphens:auto; overflow-wrap:break-word; }
:lang(de) :is(p,li,dd) { hyphens:auto; -webkit-hyphens:auto; }
@media (max-width:640px) { .hdr-end { gap:8px; } .lang-menu summary { padding:0 10px 0 9px; } }
@media (max-width:400px) {
  .lang-menu summary { gap:0; width:38px; padding:0; justify-content:center; }
  .lang-menu summary span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
}
/* Tablas de las páginas legales: siempre al ancho disponible, partiendo palabras largas (alemán) */
.mediterranean main table { width:100%; max-width:100%; table-layout:fixed; }
.mediterranean main :is(th,td) { overflow-wrap:anywhere; hyphens:auto; -webkit-hyphens:auto; }
/* Imagen exclusiva de Empresa: los envases están en la mitad inferior de la foto */
.cx-row-img img[src*="empresa-fabricantes-mercado"] { object-position:50% 64%; }

/* ================= RONDA 15 · Seguridad ================= */
/* Sin JavaScript (antes era un <style> en línea dentro de <noscript>, incompatible con la CSP) */
.no-js .menu-toggle { display:none; }
/* Sin animaciones (movimiento reducido), el elegidor cambia de estado al instante */
html:not(.mx-motion) :is(.mx-choice,.mx-choice *) { transition:none !important; }

/* ================= WhatsApp ================= */
.wa-icon { width:1.15em; height:1.15em; flex:none; fill:currentColor; }
.ctx-direct a.ctx-wa { flex-direction:row; align-items:center; gap:12px; }
.ctx-direct a.ctx-wa .wa-icon { width:26px; height:26px; color:#1f7a4d; }
.ctx-direct a.ctx-wa > span { display:flex; flex-direction:column; gap:4px; }
.mediterranean .footer-col a.footer-wa { display:inline-flex; align-items:center; gap:8px; }
.mobile-nav a.menu-wa { display:inline-flex !important; align-items:center; gap:8px; margin-top:10px; font:14px 'DM Sans','DM Sans Fallback',sans-serif; border:0; padding:0; }
@media (max-width:640px) { .ctx-direct a.ctx-wa { flex:1 1 100%; } }