.direct{grid-template-columns:.9fr 1.25fr 2.7fr;min-height:360px;background:#fff}
.direct-copy{padding:58px 48px}
.direct-copy h2{font-size:clamp(2.5rem,3.8vw,4rem);color:#062c3d}
.direct-copy p{font-size:1.08rem;line-height:1.72;color:#344f59;max-width:600px}
.values{grid-template-columns:repeat(4,1fr);align-self:stretch;background:#fff;gap:0}
.values article{min-height:360px;padding:42px 22px;justify-content:center;background:#fff;border-left:1px solid #d4dfe1;overflow:visible;transition:transform .4s ease,background .4s ease}
.values article:before{display:none}
.values article:hover{transform:translateY(-10px);background:linear-gradient(180deg,#fff 0%,#edf6f5 100%)}
.values i{width:100px;height:100px;margin:0 auto 20px;background:transparent;box-shadow:none;color:#073547;border-radius:0;animation:icon-float 4s ease-in-out infinite}
.values article:nth-child(2) i{animation-delay:.35s}
.values article:nth-child(3) i{animation-delay:.7s}
.values article:nth-child(4) i{animation-delay:1.05s}
.values article:hover i{transform:scale(1.12);box-shadow:none;color:#23737b}
.values svg{width:76px;height:76px;stroke-width:1.8;filter:drop-shadow(0 8px 10px rgba(5,48,65,.14))}
.values b{font-size:1.12rem;line-height:1.2;max-width:125px;margin:8px auto 10px;color:#082f40}
.values small{font-size:.9rem;color:#536b73}
.js .values article.reveal{transform:translateY(28px) scale(.94);opacity:0}
.js .values article.reveal.in{transform:translateY(0) scale(1);opacity:1}
@keyframes icon-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(prefers-reduced-motion:reduce){.values i{animation:none}}
@media(max-width:1180px){.direct{grid-template-columns:1fr 1fr}.values{grid-column:1/-1}.values article{min-height:280px}}
@media(max-width:760px){.direct{grid-template-columns:1fr}.direct-copy{padding:48px 28px}.direct-copy p{font-size:1rem}.values{grid-template-columns:repeat(2,1fr)}.values article{min-height:260px;border-top:1px solid #d4dfe1}.values svg{width:68px;height:68px}}
@media(max-width:430px){.values{grid-template-columns:1fr}.values article{min-height:230px}}

/* Fondo marino claro y animado, conservando pictogramas y textos */
.direct{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(125deg,#f7fcfc 0%,#dceff1 48%,#b8dce0 100%)}
.direct:before{content:'';position:absolute;z-index:-1;width:760px;height:760px;right:8%;top:-510px;border-radius:50%;border:1px solid rgba(37,118,130,.2);box-shadow:0 0 0 65px rgba(80,157,165,.08),0 0 0 130px rgba(80,157,165,.055),0 0 0 195px rgba(80,157,165,.035);animation:sea-pulse 8s ease-in-out infinite}
.direct:after{content:'';position:absolute;z-index:-1;left:18%;right:-8%;bottom:-70px;height:180px;background:repeating-radial-gradient(ellipse at 50% 110%,transparent 0 38px,rgba(255,255,255,.65) 40px 42px,transparent 44px 72px);opacity:.65;animation:sea-drift 14s linear infinite}
.direct-copy,.values{position:relative;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.52),rgba(232,246,247,.32));backdrop-filter:blur(3px)}
.direct-copy{border-left:1px solid rgba(255,255,255,.75)}
.values{background:rgba(255,255,255,.24)}
.values article{background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(231,245,246,.22));border-left-color:rgba(55,116,124,.22)}
.values article:hover{background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(213,239,239,.68));box-shadow:inset 0 3px 0 rgba(255,255,255,.9),0 18px 40px rgba(22,87,99,.13)}
.values i{background:radial-gradient(circle,rgba(255,255,255,.9) 0%,rgba(220,242,242,.62) 58%,transparent 72%)}
@keyframes sea-pulse{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-28px,24px,0) scale(1.07)}}
@keyframes sea-drift{0%{transform:translateX(0)}50%{transform:translateX(55px)}100%{transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.direct:before,.direct:after{animation:none}}

/* Productos con mayor presencia horizontal */
.products .wrap{width:min(calc(100% - 80px),1680px)}
.products .section-head{margin-bottom:52px}
.products .section-head p{max-width:470px;font-size:1.05rem}
.products .product-grid{gap:18px}
.products .product{height:570px}
.products .product>div{padding:32px}
.products .product h3{font-size:2.15rem}
.products .product>span{top:22px;right:22px}
@media(max-width:1050px){.products .wrap{width:min(calc(100% - 48px),1680px)}.products .product{height:520px}}
@media(max-width:760px){.products .wrap{width:min(calc(100% - 28px),1680px)}.products .product{height:470px}}

/* Bloque marino inspirado en el diseño original de Viking */
.direct{grid-template-columns:1.2fr 2.8fr;min-height:470px;background:linear-gradient(90deg,rgba(0,25,39,.93),rgba(0,38,57,.72)),url('assets/images/calidad-fondo-mar-noruega.webp') center 58%/cover no-repeat fixed}
.direct:before{display:block;z-index:0;inset:0;width:auto;height:auto;right:auto;top:auto;border:0;border-radius:0;box-shadow:none;background:linear-gradient(180deg,rgba(0,17,29,.08),rgba(0,22,35,.48));animation:none}
.direct:after{display:block;z-index:0;left:0;right:0;bottom:0;height:7px;background:linear-gradient(90deg,transparent,#72c8e8 22%,#d4f5ff 50%,#72c8e8 78%,transparent);opacity:.55;animation:sea-shimmer 5s ease-in-out infinite}
.direct-img{display:none}
.direct-copy{padding:68px 58px;background:rgba(0,31,47,.54);border-left:0;border-right:1px solid rgba(137,211,235,.34);backdrop-filter:blur(2px)}
.direct-copy .eyebrow,.direct-copy h2,.direct-copy p{color:#fff}
.direct-copy .eyebrow:before{background:#82d3ee}
.direct-copy p{color:rgba(255,255,255,.88)}
.values{background:rgba(0,35,52,.45);backdrop-filter:blur(2px)}
.values article{min-height:470px;background:rgba(0,30,46,.18);border-left-color:rgba(150,219,240,.33)}
.values article{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.values article:hover{background:rgba(6,69,90,.58);box-shadow:inset 0 3px 0 rgba(129,213,239,.8),0 18px 40px rgba(0,15,25,.28)}
.values i{background:none;color:#7fd3ef}
.values i img{display:block;width:100%;height:100%;object-fit:contain;margin:auto}
.values article:hover i{color:#d7f7ff}
.values svg{stroke-width:1.65;filter:drop-shadow(0 5px 10px rgba(0,0,0,.32))}
.values b{display:block;width:100%;max-width:210px;margin:8px auto 10px;color:#fff;font-size:1.18rem;text-align:center}
.values small{display:block;width:100%;max-width:220px;margin:0 auto;color:rgba(255,255,255,.9);font-size:.96rem;line-height:1.45;text-align:center}
@keyframes sea-shimmer{0%,100%{opacity:.35;transform:scaleX(.96)}50%{opacity:.75;transform:scaleX(1.02)}}
@media(max-width:1180px){.direct{grid-template-columns:1fr;background-attachment:scroll}.direct-copy{border-right:0;border-bottom:1px solid rgba(137,211,235,.34)}.values article{min-height:300px}}
@media(max-width:760px){.direct-copy{padding:48px 28px}.values article{min-height:260px}}

/* Ajuste móvil: las cuatro tarjetas conservan completo el marco lateral. */
@media(max-width:760px){
  .direct{padding-bottom:18px}
  .values{margin:0 16px;gap:12px;background:transparent}
  .values article{min-width:0;min-height:240px;border:1px solid rgba(150,219,240,.38)}
}
@media(max-width:430px){
  .values{grid-template-columns:1fr}
  .values article{min-height:220px}
}