/* Personal accents and scroll-driven statement cards. */
:root{--electric:#05c3de}
body{background:#f6f6f3}
.professional-followup{margin-top:18px}
.section-main>.professional-motto{margin-top:24px;font-size:clamp(22px,2.5vw,30px);line-height:1.25;font-weight:600;letter-spacing:-.025em;color:#31515c;max-width:650px}
.hero-minimal__place::before{background:var(--electric);box-shadow:0 0 0 3px #31515c}
.hero-actions .button-primary{background:var(--electric);color:#0a0b0d;border:1px solid #0a0b0d}
.hero-actions .button-primary:hover{background:#0a0b0d;color:var(--electric)}
#proyectos .project-action{color:var(--electric)}
#proyectos .project-action span{background:var(--electric);color:#0a0b0d}
.kafer-offer-tag{background:var(--electric);color:#0a0b0d}
.contact{border-top:6px solid var(--electric)}
.contact .links a.contact-primary:first-child{background:var(--electric);color:#0a0b0d}
.contact .links a.contact-primary:first-child svg,.contact .links a.contact-primary:first-child b{color:#0a0b0d}
.contact .links a.contact-primary:first-child:hover{background:#fff;color:#0a0b0d}


/* Large overlapping statements: yellow, cyan, then ink. */
.belief-deck{width:min(1000px,calc(100% - 44px));margin:64px auto 72px}
.belief-deck__stage{display:grid;gap:24px}
.belief-card{position:relative;min-height:380px;padding:50px 52px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:32px;color:#0a0b0d;isolation:isolate}
.belief-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23888' filter='url(%23n)' opacity='.35' d='M0 0h180v180H0z'/%3E%3C/svg%3E");z-index:-1}
.belief-card--yellow{background:#fffd38}
.belief-card--cyan{background:#05c3de}
.belief-card--black{background:#0a0b0d;color:#fff}
.belief-card p{font:550 clamp(38px,5.5vw,74px)/1.03 var(--sans);letter-spacing:-.055em;max-width:800px;text-wrap:balance}
.belief-card__number{position:absolute;top:26px;left:30px;font-size:12px;letter-spacing:.12em}
.belief-card__caption{font-size:clamp(16px,1.8vw,21px);line-height:1.45;max-width:520px;margin-top:28px;text-wrap:balance}
.belief-deck.has-motion{height:150svh;position:relative}
.belief-deck.has-motion .belief-deck__stage{position:sticky;top:110px;height:min(66svh,640px);min-height:380px;display:block;overflow:clip;padding-bottom:40px}
.belief-deck.has-motion .belief-card{position:absolute;inset:0 0 40px;min-height:0;transform-origin:center bottom;will-change:transform}
.belief-deck.has-motion .belief-card:nth-child(2){transform:translate3d(0,110%,0)}
.belief-deck.has-motion .belief-card:nth-child(3){transform:translate3d(0,110%,0)}
@media(max-width:760px){.belief-deck{width:calc(100% - 32px);margin:38px auto 48px}.belief-card{padding:54px 26px 40px;border-radius:26px;min-height:360px}.belief-card p{font-size:clamp(33px,8.1vw,52px);line-height:1.08}.belief-card__caption{font-size:16px;margin-top:24px}.belief-deck.has-motion .belief-deck__stage{top:86px;height:68svh;min-height:390px}.belief-card__number{top:22px;left:24px}}
@media(prefers-reduced-motion:reduce),(max-height:540px){.belief-deck.has-motion{height:auto}.belief-deck.has-motion .belief-deck__stage{position:static;height:auto;min-height:0;display:grid;overflow:visible;padding:0}.belief-deck.has-motion .belief-card{position:relative;inset:auto;min-height:340px;transform:none!important;will-change:auto}}

.message-ribbon{position:relative;display:flex;align-items:center;width:100%;max-width:100%;overflow:hidden;background:var(--electric);color:#0a0b0d;border-block:1px solid #0a0b0d;padding-block:25px;margin:0 0 28px}
.message-ribbon__window{flex:1;min-width:0;overflow:hidden}
.message-ribbon__track{display:flex;width:max-content;animation:jp-messages 46s linear infinite;will-change:transform}
.message-ribbon__group{display:flex;flex:none;align-items:center;gap:40px;padding-right:40px;white-space:nowrap}
.message-ribbon__item{font:600 clamp(27px,4.1vw,62px)/1.14 var(--sans);letter-spacing:-.045em}
.message-ribbon__star{font-size:clamp(26px,3.6vw,50px);line-height:1;font-weight:400}
.message-ribbon__toggle{flex:none;display:grid;place-items:center;width:46px;height:46px;margin:0 18px;border:1px solid #0a0b0d;border-radius:50%;background:var(--electric);color:#0a0b0d;font-size:21px;cursor:pointer;z-index:1}
.message-ribbon__toggle:focus-visible{outline:3px solid #0a0b0d;outline-offset:4px}
.message-ribbon.is-paused .message-ribbon__track{animation-play-state:paused}
@media(hover:hover){.message-ribbon:hover .message-ribbon__track{animation-play-state:paused}}
@keyframes jp-messages{to{transform:translateX(-50%)}}
@media(max-width:760px){.message-ribbon{padding-block:22px;margin-bottom:10px}.message-ribbon__group{gap:26px;padding-right:26px}.message-ribbon__toggle{margin-inline:10px;width:44px;height:44px}}
@media(prefers-reduced-motion:reduce){.message-ribbon__track{animation:none;transform:none;width:100%;will-change:auto}.message-ribbon__group{white-space:normal;flex-wrap:wrap;gap:12px 22px;padding:0 22px;width:100%}.message-ribbon__item{font-size:clamp(20px,3vw,34px)}.message-ribbon__group[aria-hidden=true],.message-ribbon__toggle{display:none}.message-ribbon__star{font-size:20px}}
.message-ribbon.is-reactive .message-ribbon__track{animation:none}

/* Keyword ribbon: ink and electric yellow. */
.message-ribbon{background:#0a0b0d;color:#fffd38}
.message-ribbon__toggle{background:#0a0b0d;color:#fffd38;border-color:#fffd38}
.message-ribbon__toggle:focus-visible{outline-color:#fffd38}
/* Compact keyword line. */
.message-ribbon{padding-block:10px;margin-bottom:12px}
.message-ribbon__item{font-size:clamp(19px,2.5vw,32px);letter-spacing:-.025em}
.message-ribbon__star{font-size:22px}.message-ribbon__group{gap:25px;padding-right:25px}
.message-ribbon__toggle{width:34px;height:34px;font-size:16px;margin-inline:12px}
@font-face{font-family:JPHand;src:url('fonts/caveat.ttf') format('truetype');font-display:swap;font-weight:400 700}
.work-board{background:#0a0b0d;color:#fff;padding:80px 24px;margin:40px 0;overflow:hidden}
.work-board__inner{max-width:1120px;margin:auto}.work-eyebrow{color:#fffd38;font-size:12px;letter-spacing:.13em;text-transform:uppercase;margin-bottom:18px}
.work-board h2{font-size:clamp(38px,6vw,72px);font-weight:600;letter-spacing:-.055em;line-height:1.05;max-width:740px;margin-bottom:70px}.work-board h2 em{font-style:normal;color:#fffd38}
.work-row{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center;padding:0 0 64px;margin-bottom:64px;border-bottom:1px solid #ffffff26}.work-row:last-child{margin-bottom:0;border-bottom:0;padding-bottom:0}.work-row__copy{min-width:0}.work-number{display:block;font-size:clamp(68px,8vw,110px);font-weight:600;line-height:1.1;letter-spacing:-.07em;color:#0a0b0d;-webkit-text-stroke:1.5px #fffd38;margin-bottom:18px}.work-row h3{font-size:clamp(28px,3.4vw,43px);font-weight:500;letter-spacing:-.045em;line-height:1.12;margin:0 0 20px}.work-row__copy p{color:#bdbebf;font-size:17px;line-height:1.6;max-width:470px}
.work-carousel{min-width:0}.work-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:12px 4px 18px;overscroll-behavior-x:contain;scroll-behavior:smooth}.work-track::-webkit-scrollbar{display:none}.work-track:focus-visible{outline:2px solid #fffd38;outline-offset:4px}
.work-card{flex:0 0 91%;min-width:0;min-height:350px;display:flex;flex-direction:column;justify-content:center;padding:32px;border-radius:26px;scroll-snap-align:start;color:#0a0b0d;position:relative;transform:rotate(-1deg)}.work-card--1{background:#fffd38}.work-card--2{background:#05c3de;transform:rotate(1deg)}.work-card--3{background:#f0f0e9}.work-card__label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:24px}.work-card h4{font-size:clamp(26px,3vw,38px);font-weight:600;line-height:1.08;letter-spacing:-.04em;margin:0 0 20px}.work-card p{font-size:16px;line-height:1.5}.work-card__count{align-self:flex-end;margin-top:28px;font-size:12px;letter-spacing:.1em}.work-controls{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:12px}.work-progress{font-size:12px;letter-spacing:.1em;color:#bdbebf;margin-right:14px}.work-controls button{width:46px;height:46px;border-radius:50%;border:1px solid #fff5;color:#fff;background:transparent;cursor:pointer;font-size:24px}.work-controls button:disabled{opacity:.25;cursor:default}.work-controls button:focus-visible{outline:2px solid #fffd38}
.personal-note{width:min(850px,calc(100% - 48px));margin:64px auto 80px;transform:rotate(-2deg)}.personal-note p{font:500 clamp(28px,4vw,43px)/1.3 JPHand,cursive}.personal-note>span{display:block;font:600 27px/1.3 JPHand,cursive;margin-top:18px;color:#31515c}
/* Full-screen numbered index, outside the blurred header. */
.nav-lock{overflow:hidden}header[data-smart-header]{z-index:60}.menu-button{display:grid;place-items:center;width:42px;height:42px;padding:0;border:0;background:transparent;cursor:pointer}.menu-button span{position:relative;display:block;width:22px;height:1.5px;background:var(--ink)}.menu-button span::before,.menu-button span::after{content:"";position:absolute;width:22px;height:1.5px;left:0;background:var(--ink)}.menu-button span::before{top:-7px}.menu-button span::after{top:7px}.menu-button[aria-expanded=true] span{background:transparent}.menu-button[aria-expanded=true] span::before{top:0;transform:rotate(45deg);background:#fff}.menu-button[aria-expanded=true] span::after{top:0;transform:rotate(-45deg);background:#fff}
#main-nav{display:none;position:fixed;inset:0;z-index:50;background:#0a0b0d;color:#fff;padding:112px max(28px,calc((100vw - 900px)/2)) 40px;border:0;border-radius:0;max-height:none;height:100dvh;overflow-y:auto;box-shadow:none;counter-reset:none}
#main-nav.open{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:0}
#main-nav a,#main-nav a:last-child{display:flex;align-items:baseline;gap:22px;font-size:clamp(28px,4.6vh,48px);line-height:1.12;letter-spacing:-.045em;padding:7px 0;border:0;border-radius:0;background:none;color:#fff;box-shadow:none}
#main-nav a:hover,#main-nav a[aria-current=true]{color:#fffd38;box-shadow:none}.nav-number{font-size:13px;font-weight:600;letter-spacing:.08em;color:#fffd38;min-width:24px}
.nav-lock header[data-smart-header]{background:#0a0b0d;border-color:#ffffff30;backdrop-filter:none;transform:none}.nav-lock .jp,.nav-lock .jp-accent{color:#fff}.nav-lock .site-language-picker{visibility:hidden}
@media(max-width:760px){.work-board{padding:48px 22px;margin:24px 0}.work-board h2{margin-bottom:40px}.work-row{grid-template-columns:1fr;gap:24px;margin-bottom:38px;padding-bottom:38px}.work-row__copy p{font-size:16px}.work-card{padding:28px 25px;min-height:320px}.personal-note{margin-block:40px 55px}#main-nav.open{justify-content:flex-start;padding-top:110px}#main-nav a,#main-nav a:last-child{font-size:clamp(29px,4.6vh,40px);padding:8px 0}.message-ribbon__item{font-size:20px}.message-ribbon__group{gap:20px;padding-right:20px}}
@media(prefers-reduced-motion:reduce){.work-track{scroll-behavior:auto}.personal-note,.work-card{transform:none}}

.personal-note p+p{margin-top:24px}

/* Blue separators in the moving keyword ribbon. */
.message-ribbon__dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#05c3de;flex:0 0 8px;align-self:center}
