:root{--ink:#002e3d;--petrol:#006b79;--teal:#80cdd3;--light:#f7fafb}
*{box-sizing:border-box}html,body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--light);background:var(--ink);-webkit-font-smoothing:antialiased}
.page{max-width:1920px;margin:auto;overflow:hidden}
.topline{height:48px;padding:0 60px;display:flex;align-items:center;justify-content:space-between;font-size:13px;letter-spacing:.12em}
.status{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.22em;font-weight:700}.status::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.brand{margin:0;line-height:0}.brand img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.masthead{padding:33px 105px 37px;position:relative;isolation:isolate}
.stage{position:relative;isolation:isolate;overflow:hidden;line-height:0}
.photograph{display:block;width:100%;height:auto}
.shade{position:absolute;inset:0;pointer-events:none;z-index:1}
.message{position:absolute;margin:0;line-height:1;z-index:3;max-width:calc(100% - 100px)}
.message .lead{display:block;font-size:28px;line-height:1.15;margin-bottom:7px;letter-spacing:.01em;font-weight:500}
.message .impact{display:block;font-size:105px;line-height:.98;letter-spacing:-.055em;font-weight:900;text-shadow:0 2px 22px #00212d80}
.categories{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:26px 60px;min-height:87px;position:relative}
.categories span{font-size:14px;letter-spacing:.18em;font-weight:700;white-space:nowrap}.categories i{font-size:25px;font-style:normal;font-weight:300;opacity:.7}
.mobile-domain{display:none}
/* 01 — Vínculo: luz natural, composición editorial y color suave. */
.vinculo{background:#d9eeee;color:var(--ink)}
.vinculo .topline{border-bottom:1px solid #006b792e;background:#d9eeee;color:#005969}
.vinculo .masthead{background:linear-gradient(110deg,#d9eeee,#b9e1e4);padding-top:36px;padding-bottom:42px}
.vinculo .stage{border-top:6px solid #006b79}
.vinculo .shade{background:linear-gradient(0deg,rgba(0,42,45,.75),rgba(0,42,45,.13) 21%,transparent 35%)}
.vinculo .message{right:57px;bottom:27px;text-align:right;color:#fff}
.vinculo .message .lead{font-size:30px;font-weight:500;margin-right:4px}
.vinculo .message .impact{font-size:102px;letter-spacing:-.06em;font-style:normal;color:#e6f7f6}
.vinculo .categories{border-bottom:7px solid #006b79;background:#d9eeee;color:#005664}
.vinculo .categories i{width:30px;height:1px;background:#006b79;font-size:0}
/* 02 — Pulso: energía de competición y diagonales de la identidad web. */
.pulso{background:#002735}
.pulso .topline{background:#002735;color:#91d8dd}
.pulso .masthead{background:#80cdd3;padding:28px 74px 50px}
.pulso .masthead::after{content:'';position:absolute;bottom:-1px;right:0;width:43%;height:28px;background:#002735;clip-path:polygon(7% 0,100% 0,100% 100%,0 100%)}
.pulso .stage{border-top:1px solid #80cdd363}
.pulso .shade{background:linear-gradient(0deg,rgba(0,24,36,.86),rgba(0,24,36,.19) 22%,transparent 34%)}
.pulso .message{left:50%;transform:translateX(-50%) skewX(-3deg);bottom:22px;text-align:center;width:max-content}
.pulso .message .lead{font-size:23px;letter-spacing:.23em;font-weight:700;margin:0 0 10px 6px}
.pulso .message .impact{font-size:112px;font-style:italic;white-space:nowrap;color:#fff}
.pulso .message em{font-style:inherit;color:#8bdae0}
.pulso .slash{position:absolute;right:42px;top:28px;width:110px;height:7px;transform:skewX(-35deg);background:#80cdd3;box-shadow:25px 15px 0 -1px #006b79;z-index:2}
.pulso .categories{border-top:4px solid #80cdd3;background:#002735}
.pulso .categories i{color:#80cdd3;font-style:italic}
/* 03 — Punto de encuentro: logotipo y lema dentro de la fotografía. */
.encuentro .topline{background:#006b79;color:#f7fafb}
.encuentro .brand{position:absolute;top:23px;left:8%;right:8%;z-index:3;mix-blend-mode:multiply}
.encuentro .brand img{mix-blend-mode:normal}
.encuentro .shade{background:linear-gradient(0deg,rgba(0,44,47,.74),rgba(0,44,47,.06) 20%,transparent 29%),linear-gradient(180deg,rgba(220,246,247,.32),transparent 23%)}
.encuentro .message{left:56px;bottom:30px;color:white;text-align:left}
.encuentro .message .lead{font-size:26px;letter-spacing:.04em;margin-left:4px}
.encuentro .message .impact{font-size:100px;letter-spacing:-.05em;font-style:italic;color:#edfcfc}
.encuentro .categories{background:#80cdd3;color:#003b49;border-top:4px solid #006b79}
.encuentro .categories i{display:block;flex:0 0 2px;width:2px;height:19px;background:#006b79;border-radius:1px;font-size:0;opacity:1}
@media(min-width:1750px){.message .impact,.pulso .message .impact{font-size:130px}.vinculo .message .impact,.encuentro .message .impact{font-size:116px}.encuentro .brand{top:28px}}
@media(max-width:1100px) and (min-width:721px){.masthead{padding-left:65px;padding-right:65px}.topline{padding:0 36px}.categories{padding:23px 36px;gap:12px}.categories span{font-size:11px;letter-spacing:.13em}.message .lead,.vinculo .message .lead,.encuentro .message .lead{font-size:20px}.message .impact,.vinculo .message .impact,.encuentro .message .impact{font-size:70px}.pulso .message .impact{font-size:80px}.pulso .message .lead{font-size:16px}.encuentro .brand{top:15px}}
@media(max-width:720px){
 .topline{height:40px;padding:0 18px;font-size:9px;letter-spacing:.04em}.status{font-size:8px;gap:7px;letter-spacing:.13em}.status::before{width:4px;height:4px}
 .masthead,.vinculo .masthead,.pulso .masthead{padding:22px 20px 28px}.pulso .masthead::after{height:13px}
 .message{max-width:calc(100% - 24px)}
 .vinculo .message{bottom:7px;right:14px}.vinculo .message .lead{font-size:11px;margin-bottom:3px;margin-right:0}.vinculo .message .impact{font-size:32px;line-height:1}
 .pulso .message{bottom:7px}.pulso .message .lead{font-size:9px;letter-spacing:.12em;margin:0 0 4px}.pulso .message .impact{font-size:37px;line-height:1;letter-spacing:-.06em}.pulso .slash{width:40px;right:13px;top:11px;height:3px;box-shadow:8px 6px 0 -1px #006b79}
 .encuentro .brand{top:7px;left:6%;right:6%}.encuentro .message{left:auto;right:13px;bottom:7px;text-align:right}.encuentro .message .lead{font-size:10px;letter-spacing:0;margin:0 0 3px}.encuentro .message .impact{font-size:32px;line-height:1}
 .categories{min-height:95px;padding:22px 19px;gap:18px 22px;justify-content:center;flex-wrap:wrap}.categories span{font-size:10px;letter-spacing:.1em}.categories i{display:none}.vinculo .categories{border-bottom-width:4px}.pulso .categories,.encuentro .categories{border-top-width:3px}
 .encuentro .categories{flex-wrap:nowrap;justify-content:space-between;gap:5px;padding:22px 12px}.encuentro .categories span{font-size:clamp(7px,2vw,10px);letter-spacing:.08em}.encuentro .categories i{height:13px;flex-basis:1px;width:1px}
 .mobile-domain{display:block;text-align:center;padding:18px;font-size:12px;letter-spacing:.04em;border-top:1px solid #80cdd34d;background:#002e3d;color:#80cdd3}.vinculo .mobile-domain{background:#d9eeee;color:#006b79;border-color:#006b7930}.encuentro .mobile-domain{background:#80cdd3;color:#003b49;border-color:#006b7930}
}