/* Heebo (OFL), solo el bloque hebreo: DiDi Sans no tiene alfabeto hebreo. fonts/Heebo-hebrew.woff2 sale de tools (fontTools) a partir de la fuente variable. */
@font-face{font-family:"Heebo";src:url("fonts/Heebo-hebrew.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0590-05FF,U+FB1D-FB4F,U+20AA}
/* Layout del sitio. Los componentes viven en assets/didi-ui.css. */
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--d-surface);color:var(--d-on);font-family:var(--d-sans);min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:inherit}
.s-head{position:sticky;top:0;z-index:20;background:var(--d-surface);border-bottom:1px solid var(--d-outline-var)}
.s-head .d-appbar{border-bottom:0;padding:0;background:transparent;height:72px;gap:var(--d-5)}
.s-head .d-logo{width:88px}
.s-head nav:not(.s-lang){display:none}
.s-head .d-navi{height:72px}
.s-menu{position:relative}
.s-menu summary{list-style:none;cursor:pointer}.s-menu summary::-webkit-details-marker{display:none}
.s-menu .d-menu{position:absolute;right:0;top:56px;min-width:220px;z-index:30}
.s-cta{margin-inline-start:0}
@media(min-width:760px){.s-head nav:not(.s-lang){display:flex}.s-menu{display:none}}
@media(max-width:759px){.s-cta{display:none}}
.s-hero{padding:clamp(48px,9vw,112px) 0 clamp(32px,6vw,56px)}
.s-hero h1{font:700 clamp(2.5rem,7vw,4rem)/1.02 var(--d-sans);letter-spacing:-.02em;margin:0 0 20px}
.s-hero p{font:400 clamp(1.0625rem,2.2vw,1.25rem)/1.6 var(--d-sans);max-width:58ch;margin:0 0 28px;color:var(--d-on)}
.s-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
a.d-tile{display:block;text-decoration:none;color:inherit}
a.d-tile:hover{background:var(--d-container)}
.s-sec{padding:clamp(40px,7vw,80px) 0}
.s-sec+.s-sec{border-top:1px solid var(--d-outline-var)}
.s-h2{font:600 clamp(1.5rem,3.4vw,2rem)/1.25 var(--d-sans);margin:0 0 8px;letter-spacing:-.01em}
.s-sub{font:400 1rem/1.6 var(--d-sans);color:var(--d-on-var);max-width:64ch;margin:0 0 28px}
.s-list .d-item{padding-left:var(--d-3);padding-right:var(--d-3)}
.s-list .d-item b{font-size:1.125rem}
.s-feature{display:grid;gap:20px;align-items:start}
@media(min-width:900px){.s-feature{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}}
.s-feature .d-card{max-width:none}
.s-feature .d-media{height:clamp(200px,32vw,300px)}
.s-method{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.s-method .d-card{max-width:none}
.s-foot{margin-top:clamp(56px,9vw,112px);background:var(--d-dim);border-top:1px solid var(--d-outline-var)}
.s-foot .d-container{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center;padding:36px 0}
.s-foot .d-label-m{color:var(--d-on-var)}
.s-foot a{color:var(--d-on);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--d-nav) 50%,transparent)}
.s-foot a:hover{border-bottom-color:var(--d-nav)}
/* ---- caso ---- */
.s-case{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;padding-bottom:24px}
.s-art{min-width:0}
@media(min-width:1100px){.s-case{grid-template-columns:200px minmax(0,780px);gap:56px;justify-content:start}}
.s-rail{display:none}
@media(min-width:1100px){.s-rail{display:block;position:sticky;top:96px;align-self:start}.s-rail .d-rail{display:flex;width:100%;background:transparent;padding:0}.s-rail .d-raili{height:44px;padding-left:13px}}
.s-art h1{font:700 clamp(1.875rem,5vw,2.75rem)/1.12 var(--d-sans);letter-spacing:-.015em;margin:20px 0 16px}
.s-art .s-lead{font:400 1.1875rem/1.65 var(--d-sans);max-width:62ch;margin:0 0 8px;color:var(--d-on)}
.s-art h2{font:600 1.75rem/2.25rem var(--d-sans);margin:64px 0 14px;letter-spacing:-.01em}
.s-art h3{font:600 1.25rem/1.75rem var(--d-sans);margin:32px 0 8px}
.s-art p{max-width:66ch;margin:0 0 14px;font:400 1.0625rem/1.65 var(--d-sans)}
.s-art ul,.s-art ol{max-width:66ch;padding-inline-start:22px;margin:0 0 16px}.s-art li{margin:0 0 10px;font:400 1.0625rem/1.6 var(--d-sans)}
.s-art li::marker{color:var(--d-dato)}
.s-note{font:400 .8125rem/1.25rem var(--d-mono);color:var(--d-on-var);margin:0 0 8px}
.s-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px 28px;margin:28px 0 36px}
.s-meta .k{font:500 .6875rem/1rem var(--d-mono);color:var(--d-dato);letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px}
.s-meta .v{font:400 .9375rem/1.5rem var(--d-sans)}
.s-meta .d-row{gap:6px}
.s-fig{margin:28px 0}
.s-fig img{display:block;width:100%;height:auto;border:1px solid var(--d-outline-var);background:var(--d-lowest)}
.s-fig figcaption{font:400 .75rem/1rem var(--d-mono);color:var(--d-on-var);margin-top:8px;max-width:80ch}
.s-two{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:760px){.s-two{grid-template-columns:2fr 1fr;align-items:start}.s-two--even{grid-template-columns:1fr 1fr}}
.s-phones{display:flex;gap:16px;flex-wrap:wrap}.s-phones .s-fig{margin:0;flex:0 1 260px}
.s-tablewrap{overflow-x:auto;margin:20px 0}
.s-tablewrap .d-table{min-width:560px}
.s-tablewrap .d-table td{vertical-align:top}
.s-tiles-row{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}
.s-tiles-row .d-tile{flex:1 1 150px}
.s-cta-row{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;margin-top:64px;padding-top:28px;border-top:1px solid var(--d-outline-var)}
.s-diagram{margin:24px 0;border:1px solid var(--d-outline-var);background:var(--d-lowest);padding:16px;overflow-x:auto}
.s-diagram svg{display:block;min-width:760px;width:100%;height:auto}
.s-note-card{margin:20px 0}
.s-crumbs{margin-top:28px}
.s-crumbs .d-crumbs a{display:inline-block;padding:12px 0;margin:-12px 0}   /* 44 px de alto para tocar sin cambiar el aspecto */
/* ---- sobre mí ---- */
.s-about{max-width:780px}
.s-about h2{font:600 1.5rem/2rem var(--d-sans);margin:56px 0 14px}
.s-about p{max-width:66ch;font:400 1.0625rem/1.65 var(--d-sans);margin:0 0 14px}
.s-about .d-table{min-width:560px}

/* listas de casos */
.d-list.s-list{max-width:none}
a.d-item{text-decoration:none}
.s-list .d-item.d-st:hover{background:var(--d-low)}

.s-phones+p{margin-top:24px}

.s-hero .s-role{font:600 clamp(1.125rem,2.6vw,1.5rem)/1.3 var(--d-sans);color:var(--d-on);margin:0 0 20px;max-width:34em}

/* ---- idioma ---- */
.s-lang{display:flex;gap:2px;margin-inline-start:auto}
.s-lang a{position:relative;display:grid;place-items:center;min-width:44px;height:40px;padding:0 6px;border-radius:var(--d-r-full);color:var(--d-on-var);text-decoration:none;font:600 .75rem/1 var(--d-mono)}
.s-lang a::before{content:"";position:absolute;inset:-4px 0}
.s-lang a:hover{background:color-mix(in srgb,var(--d-on) 8%,transparent);color:var(--d-on)}
.s-lang a[aria-current]{background:var(--d-nav-cont);color:var(--d-on-nav-cont)}
.s-lang a:focus-visible{outline:none;box-shadow:var(--d-focus)}
:lang(he){--d-sans:"DiDi Sans","Heebo","Assistant","Arial Hebrew","Segoe UI",Arial,sans-serif;--d-mono:"DiDi Mono","Arial Hebrew","Segoe UI",Arial,monospace}
/* ---- RTL del sitio ---- */
[dir="rtl"] .s-menu .d-menu{right:auto;left:0}
[dir="rtl"] .s-rail .d-raili{padding:0 13px 0 var(--d-4)}
[dir="rtl"] .s-foot a[href^="mailto:"]{direction:ltr;unicode-bidi:isolate}
[dir="rtl"] .d-chip-data,[dir="rtl"] .s-meta .d-row,[dir="rtl"] .d-tile .d-v{direction:ltr;unicode-bidi:isolate}
[dir="rtl"] .d-tile .d-l{direction:rtl}
[dir="rtl"] .s-diagram svg{direction:ltr}
.s-fig--sq{max-width:520px}
a.d-raili{text-decoration:none}
[dir="rtl"] .d-item__t{text-align:left}

/* diagrama de trading en HTML */
.s-flow{display:grid;gap:12px;margin:24px 0}
.s-flow__row{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));list-style:none;margin:0;padding:0}
.s-art .s-flow__row{padding:0;max-width:none}
.s-flow__box{background:var(--d-container);border-left:3px solid var(--c,var(--d-dato));padding:14px 16px;margin:0}
[dir="rtl"] .s-flow__box{border-left:0;border-right:3px solid var(--c,var(--d-dato))}
.s-art .s-flow__box{margin:0}
.s-flow__box b{display:block;font:600 .9375rem/1.4 var(--d-sans);margin-bottom:6px}
.s-flow__box p{margin:0;font:400 .8125rem/1.5 var(--d-mono);color:var(--d-on-var);max-width:none}
.s-flow__box--human{background:var(--d-accion-cont,var(--d-container))}
.s-flow__box--human p{color:var(--d-on)}
.s-flow__note{font:400 .75rem/1.5 var(--d-mono);color:var(--d-on-var);margin:0;max-width:none}
/* fechas sin cortes, tarjetas parejas, chips largos */
td.d-n{white-space:nowrap}
.s-two--even{align-items:stretch}.s-two--even .d-card{margin-bottom:8px}
.d-chip-data{max-width:100%;height:auto;min-height:28px;padding-block:4px;line-height:1.4}
/* celular: la lista de casos y las tablas se apilan */
@media(max-width:600px){
 .s-list .d-item{grid-template-columns:auto 1fr}
 .s-list .d-item__t{grid-column:2;margin-top:2px}
 .s-tablewrap{overflow:visible}
 .s-tablewrap .d-table,.s-about .d-table{min-width:0}
 .s-tablewrap .d-table thead{display:none}
 .s-tablewrap .d-table tr{display:block;padding:12px 0;border-bottom:1px solid var(--d-outline-var)}
 .s-tablewrap .d-table td{display:block;border:0;padding:3px 0;white-space:normal}
 .s-tablewrap .d-table td[data-l]::before{content:attr(data-l);display:block;font:500 .6875rem/1rem var(--d-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--d-dato);margin-top:6px}
 [dir="rtl"] .s-tablewrap .d-table td{text-align:right}
}
@media(min-width:1000px){.s-flow__row:not(.s-flow__row--sup){grid-template-columns:repeat(5,minmax(0,1fr))}}

/* gráfico de campañas en la tarjeta destacada de la home */
.s-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:24px 28px 20px;background:var(--d-lowest);align-items:end}
.s-kpi__col{display:grid;gap:6px;align-content:end;min-width:0}
.s-kpi__bars{display:flex;align-items:flex-end;gap:8px;height:clamp(110px,16vw,150px)}
.s-kpi__bars i{flex:1;background:var(--d-dato-cont);min-width:0}
.s-kpi__bars i.is-now{background:var(--d-dato)}
.s-kpi b{font:600 clamp(1.25rem,3vw,1.75rem)/1 var(--d-sans);color:var(--d-on);margin-top:6px}
.s-kpi small{font:500 .6875rem/1rem var(--d-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--d-dato)}

.s-feature .d-media.s-suitepic{height:auto;background:var(--d-lowest)}
.s-suitepic img{display:block;width:100%;height:auto}

/* prototipo clicable */
.s-proto{margin:20px 0 28px;border:1px solid var(--d-outline-var);background:#000;max-width:100%}
.s-proto:focus-visible{outline:none;box-shadow:var(--d-focus)}
.s-proto__stage{position:relative;aspect-ratio:1280/767;background:#111}
.s-proto__frame{position:absolute;inset:0;display:none}
.s-proto__frame.is-on{display:block}
.s-proto__frame img{display:block;width:100%;height:100%;object-fit:contain}
.s-proto__hs{position:absolute;display:block;padding:0;margin:0;background:transparent;border:2px dashed var(--d-nav);border-radius:6px;cursor:pointer;animation:s-proto-pulse 1.8s ease-in-out infinite}
.s-proto__hs:hover,.s-proto__hs:focus-visible{background:color-mix(in srgb,var(--d-nav) 24%,transparent);outline:none;box-shadow:var(--d-focus)}
.s-proto__hs.is-on{border-style:solid;background:color-mix(in srgb,var(--d-nav) 32%,transparent);animation:none}
.s-proto__fill{position:absolute;left:20.2%;top:42.4%;width:59.1%;height:3.2%;background:#e6ecf5;display:block;border-radius:999px;mix-blend-mode:normal;opacity:0}
.s-proto__frame[data-auto] .s-proto__fill{opacity:1;background:linear-gradient(90deg,#2ed17d 0 var(--pw,0%),#242424 var(--pw,0%))}
@keyframes s-proto-fill{from{--pw:0%;width:59.1%}to{--pw:100%;width:59.1%}}
@property --pw{syntax:"<percentage>";inherits:false;initial-value:0%}
@keyframes s-proto-pulse{0%,100%{opacity:1}50%{opacity:.45}}
@media(prefers-reduced-motion:reduce){.s-proto__hs{animation:none}}
.s-proto__cap{display:none;margin:0;padding:10px 14px 0;font:400 .75rem/1rem var(--d-mono);color:var(--d-on-var);max-width:none!important}
.s-proto__cap.is-on{display:block}
.s-proto__bar{display:flex;align-items:center;gap:var(--d-3);padding:8px 10px 10px}
.s-proto__dots{display:flex;gap:4px;flex:1;max-width:320px}
.s-proto__dots i{flex:1;height:4px;background:var(--d-highest)}.s-proto__dots i.is-on{background:var(--d-nav)}
.s-proto__count{font:500 .75rem/1rem var(--d-mono);color:var(--d-on-var);min-width:48px}
.s-proto__bar .d-iconbtn[disabled]{opacity:var(--d-dis-content);pointer-events:none}
.s-proto .d-hint{padding:0 14px 12px;margin:0}
[dir="rtl"] .s-proto__cap,[dir="rtl"] .s-proto .d-hint{direction:rtl}
.s-proto__bar,.s-proto__stage{direction:ltr}
/* componentes incrustados */
.s-embed{display:block;width:100%;height:var(--h,1500px);border:1px solid var(--d-outline-var);background:#121212;margin:12px 0 24px}
@media(max-width:600px){.s-embed{height:var(--hm,2300px)}}
.s-embed--proto{background:transparent;border:0;margin:8px 0 28px}
.s-embed--proto{color-scheme:dark}

/* Hoja de reconocimientos: baldosa que abre una hoja modal (sheet) con la lista */
button.d-tile{font:inherit;color:inherit;text-align:start;border:0;border-top:2px solid var(--d-dato);cursor:pointer;position:relative;width:100%}
.s-rtile__go{position:absolute;top:var(--d-3);right:var(--d-3);width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--d-high);color:var(--d-on-var);font-size:.875rem;line-height:1}

.s-sheet{border:0;padding:0;background:var(--d-high);color:var(--d-on);border-radius:28px;width:min(560px,calc(100vw - 32px));max-height:min(82vh,700px);box-shadow:var(--d-e3);overflow:hidden;margin:auto}
.s-sheet[open]{display:flex;flex-direction:column;animation:s-sheet-in .24s cubic-bezier(.2,0,0,1)}
.s-sheet::backdrop{background:rgba(5,10,20,.55)}
.s-sheet__grab{display:none;width:32px;height:4px;border-radius:2px;background:var(--d-outline);margin:10px auto 0;flex:none;touch-action:none}
.s-sheet__bar{display:flex;align-items:center;gap:var(--d-3);padding:var(--d-4) var(--d-4) var(--d-3) var(--d-5);flex:none}
.s-sheet__bar h2{margin:0;font:600 1.5rem/2rem var(--d-sans);flex:1}
.s-sheet__done{font:500 .875rem/1.25rem var(--d-sans);color:var(--d-accion);background:transparent;border:0;border-radius:var(--d-r-full);padding:10px 16px;min-height:48px;cursor:pointer}
.s-sheet__done:hover{background:color-mix(in srgb,var(--d-accion) 10%,transparent)}
.s-sheet__sub{margin:0;padding:0 var(--d-5) var(--d-3);color:var(--d-on-var);font:400 .875rem/1.25rem var(--d-sans);flex:none}
.s-sheet__list{list-style:none;margin:0;padding:0 var(--d-5) var(--d-5);overflow:auto;overscroll-behavior:contain}
.s-sheet__list li{display:flex;justify-content:space-between;gap:var(--d-4);padding:var(--d-3) 0;border-top:1px solid var(--d-outline-var)}
.s-sheet__list b{display:block;font:500 1rem/1.5rem var(--d-sans)}
.s-sheet__list small{display:block;color:var(--d-on-var);font:400 .875rem/1.25rem var(--d-sans)}
.s-sheet__list .y{font:500 .8125rem/1.5rem var(--d-mono);color:var(--d-on-var);flex:none}
.s-sheet__list h3{margin:var(--d-4) 0 0;padding:var(--d-2) 0;font:500 .75rem/1rem var(--d-mono);letter-spacing:.06em;color:var(--d-dato)}
.s-sheet__chips{display:flex;flex-wrap:wrap;gap:8px;padding:var(--d-2) 0 var(--d-3)}
.s-sheet__chips span{background:var(--d-low);border-radius:8px;padding:6px 12px;font:400 .875rem/1.25rem var(--d-sans)}
@keyframes s-sheet-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:640px){
  .s-sheet{width:100%;max-width:none;margin:auto 0 0;border-radius:28px 28px 0 0;max-height:86vh}
  .s-sheet__grab{display:block}
  .s-sheet[open]{animation-name:s-sheet-up}
}
@keyframes s-sheet-up{from{transform:translateY(100%)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.s-sheet[open]{animation:none}}
body.s-lock{overflow:hidden}

/* ---- imágenes: nunca una caja más alta que la imagen (sin franjas oscuras) ---- */
.d-gal--fit .d-gal__item img{height:auto;object-fit:fill;background:transparent}
.d-gal__view{align-items:flex-start}
.d-gal__item img,.s-fig img{background:transparent}
.s-fig img{border:0}

/* ---- mosaico: todas las piezas juntas, enteras (sin recortes), con la misma calle entre ellas ---- */
.s-mosaic{columns:2;column-gap:12px;margin:24px 0 8px}
.s-mosaic--3{columns:3}
.s-mosaic__item{margin:0 0 12px;position:relative;break-inside:avoid;display:block}
.s-mosaic__item img{display:block;width:100%;height:auto}
.s-mosaic__item figcaption{position:absolute;inset:auto 0 0 0;padding:28px 12px 10px;font:400 .75rem/1rem var(--d-mono);color:#fff;background:linear-gradient(transparent,rgba(5,10,20,.72));opacity:0;transition:opacity var(--d-dur-s3) var(--d-ease)}
.s-mosaic__item:hover figcaption,.s-mosaic__item:focus-within figcaption{opacity:1}
.s-mosaic__item[data-zoom]{cursor:zoom-in}
.s-mosaic+.d-hint{margin-top:8px}
@media(max-width:600px){.s-mosaic,.s-mosaic--3{columns:1}.s-mosaic__item figcaption{position:static;opacity:1;background:none;color:var(--d-on-var);padding:8px 0 0}}
@media(min-width:601px) and (max-width:900px){.s-mosaic--3{columns:2}}

/* ---- monitor: una web dentro de una pantalla que se desplaza ---- */
.s-mon{margin:24px 0 28px;direction:ltr}
.s-mon__tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:12px}
.s-mon__tabs button{font:500 .8125rem/1rem var(--d-sans);color:var(--d-on-var);background:transparent;border:1px solid var(--d-outline-var);border-radius:var(--d-r-full);padding:9px 14px;min-height:36px;cursor:pointer}
.s-mon__tabs button:hover{background:var(--d-low);color:var(--d-on)}
.s-mon__tabs button[aria-selected="true"]{background:var(--d-nav-cont);color:var(--d-on-nav-cont);border-color:transparent}
.s-mon__tabs button:focus-visible{outline:none;box-shadow:var(--d-focus)}
.s-mon__frame{background:#1c1f26;border-radius:14px;padding:14px 14px 18px;box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 18px 40px -20px rgba(5,10,20,.6)}
.s-mon__screen{position:relative;aspect-ratio:16/10;background:#faf8f6;border-radius:4px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.s-mon__screen:focus-visible{outline:none;box-shadow:var(--d-focus)}
.s-mon__screen img{display:block;width:100%;height:auto}
.s-mon__screen img[hidden]{display:none}
.s-mon__cam{position:absolute;top:5px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#0b0d12;box-shadow:0 0 0 1.5px #2b2f3a}
.s-mon__frame{position:relative}
.s-mon__stand{width:120px;height:26px;margin:0 auto;background:linear-gradient(#2a2e38,#1c1f26);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}
.s-mon__base{width:220px;height:6px;margin:0 auto;border-radius:3px;background:#2a2e38}
.s-mon__cap{display:none;margin:12px 0 0;font:400 .75rem/1rem var(--d-mono);color:var(--d-on-var);max-width:80ch}
.s-mon__cap.is-on{display:block}
.s-mon .d-hint{margin-top:8px}
[dir="rtl"] .s-mon__cap,[dir="rtl"] .s-mon .d-hint,[dir="rtl"] .s-mon__tabs{direction:rtl}
@media(max-width:600px){.s-mon__frame{padding:8px 8px 10px;border-radius:10px}.s-mon__screen{aspect-ratio:4/5}.s-mon__stand{display:none}.s-mon__base{display:none}}

/* ---- demo incrustada (otro origen: el alto es fijo) ---- */
.s-embed--demo{background:#faf8f6;height:var(--h,860px);border:1px solid var(--d-outline-var);border-radius:8px;color-scheme:light}
@media(max-width:600px){.s-embed--demo{height:var(--hm,760px)}}

/* video externo: miniatura con botón de reproducción, enlaza a YouTube */
.s-yt{position:relative;display:block}.s-yt img{display:block;width:100%;height:auto;border:1px solid var(--d-outline-var)}.s-yt__btn{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;font-size:28px;display:flex;align-items:center;justify-content:center;pointer-events:none}.s-yt:focus-visible{outline:3px solid var(--d-accion);outline-offset:3px}

/* video incrustado (YouTube sin cookies) y recorrido de la persona */
.s-video{position:relative;width:100%;aspect-ratio:16/9;background:#000;border:1px solid var(--d-outline-var);overflow:hidden}.s-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.s-video--v{aspect-ratio:9/16;max-width:360px;margin:0 auto}
.s-video video{position:absolute;inset:0;width:100%;height:100%;display:block;background:#000}
.s-persona{align-items:start}.s-persona h3{margin:0 0 10px}
.s-journey{list-style:none;margin:0;padding:0;border-inline-start:2px solid var(--d-outline-var)}.s-journey li{display:grid;grid-template-columns:64px 1fr;gap:10px;padding:0 0 14px 14px;position:relative}.s-journey li::before{content:"";position:absolute;inset-inline-start:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--d-accion)}.s-journey b{font:600 .85rem/1.4 var(--d-mono);color:var(--d-on-var)}.s-journey span{font-size:.95rem;line-height:1.5}

/* reels en el caso (figura con caja de proporción fija, para que el alto no dependa de la carga del video) */
.s-phones{align-items:flex-start}
.s-phones .s-reel{flex:0 1 260px;margin:0}
.s-reel__box{position:relative;aspect-ratio:9/16;background:#000;border-radius:4px;overflow:hidden}
.s-reel__box video{position:absolute;inset:0;width:100%;height:100%;display:block}

/* Formulario de contacto */
.s-form{display:grid;gap:20px;max-width:560px;margin-top:24px;position:relative}
.s-form .d-field{max-width:none}
.s-form .d-field.is-error input,.s-form .d-field.is-error textarea{border-bottom-color:var(--d-atencion)}
.s-form__st[hidden]{display:none}
.s-form__ok{color:var(--d-dato)}
.s-form__err{color:var(--d-atencion)}
.s-form button[disabled]{opacity:.6;cursor:progress}
/* caso Clash: infografías en HTML (texto traducible; el SVG solo dibuja) */
.cl{--cl:#e8112d;--cl-soft:rgba(232,17,45,.14);--cl-line:rgba(232,17,45,.5);margin:20px 0 32px}
.cl-h{font:600 .6875rem/1rem var(--d-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--d-on-var);margin:0 0 10px;max-width:none}
.cl-note{font:400 .75rem/1.5 var(--d-mono);color:var(--d-on-var);margin:10px 0 0;max-width:none}
.cl-dd svg{display:block;width:100%;height:auto;margin:0 0 10px}
.cl-dd__dates{display:flex;justify-content:space-between;font:400 .75rem/1.4 var(--d-mono);color:var(--d-on-var);margin:0 0 6px}
.cl-dd__phases{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.cl-dd__phases>li{background:var(--d-container);border-top:3px solid var(--cl);padding:12px 14px}
.cl-dd__phases b{display:block;font:600 .9375rem/1.3 var(--d-sans)}
.cl-dd__phases small{display:block;font:400 .75rem/1.3 var(--d-mono);color:var(--d-on-var);margin:4px 0 8px}
.cl-dd__phases ul{margin:0;padding:0;list-style:none;font:400 .8125rem/1.5 var(--d-mono);color:var(--d-on-var)}
@media(max-width:700px){.cl-dd svg,.cl-dd__dates{display:none}.cl-dd__phases{grid-template-columns:1fr 1fr}}
@media(max-width:420px){.cl-dd__phases{grid-template-columns:1fr}}
.cl-bubs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;margin:0;padding:0;list-style:none}
.cl-bub{display:flex;align-items:center;justify-content:center;text-align:center;border-radius:50%;flex:none;width:var(--s,110px);height:var(--s,110px);background:var(--cl-soft);border:1px solid var(--cl-line);padding:10px;font:500 .8125rem/1.3 var(--d-sans);color:var(--d-on)}
.cl-bub--n{flex-direction:column;background:var(--d-container);border-color:var(--d-outline-var)}
.cl-bub--n b{font:600 1.0625rem/1.1 var(--d-sans);color:var(--cl)}
.cl-bub--n span{font:400 .6875rem/1.25 var(--d-mono);color:var(--d-on-var);margin-top:3px}
.cl-q{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--d-outline-var)}
.cl-q:last-of-type{border-bottom:0}
.cl-q>b{font:600 .9375rem/1.35 var(--d-sans)}
.cl-q .cl-bubs{justify-content:flex-start}
@media(max-width:600px){.cl-q{grid-template-columns:1fr}.cl-q .cl-bubs{justify-content:center}}
.cl-dims{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;list-style:none;margin:16px 0 0;padding:0}
.cl-dims>li{background:var(--d-container);padding:12px 14px;border-inline-start:3px solid var(--cl)}
.cl-dims b{display:block;font:600 .875rem/1.3 var(--d-sans);margin-bottom:4px}
.cl-dims span{font:400 .8125rem/1.5 var(--d-mono);color:var(--d-on-var)}
.cl-map{position:relative;aspect-ratio:16/9;max-width:760px;margin:0 0 4px}
.cl-map svg{position:absolute;inset:0;width:100%;height:100%;color:var(--d-on)}
.cl-node{position:absolute;transform:translate(-50%,-50%);background:var(--d-container);border:1px solid var(--d-outline-var);padding:8px 12px;text-align:center;font:600 .875rem/1.25 var(--d-sans);max-width:150px}
.cl-node small{display:block;font:400 .6875rem/1.25 var(--d-mono);color:var(--d-on-var);margin-top:2px}
.cl-node--c{background:var(--cl);color:#fff;border-color:var(--cl);border-radius:50%;width:104px;height:104px;display:flex;align-items:center;justify-content:center;padding:0}
.cl-edge{position:absolute;transform:translate(-50%,-50%);font:400 .6875rem/1.2 var(--d-mono);color:var(--d-on-var);background:var(--d-surface);padding:2px 6px;max-width:140px;text-align:center}
@media(max-width:640px){.cl-map{aspect-ratio:auto;max-width:none;display:flex;flex-wrap:wrap;gap:8px}.cl-map svg,.cl-edge{display:none}.cl-node{position:static;transform:none;max-width:none;flex:1 1 40%}.cl-node--c{border-radius:0;width:auto;height:auto;padding:8px 12px;flex-basis:100%}}
.cl-edges{margin-top:12px}
.cl-flow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;margin:0;padding:0}
.cl-flow li{display:flex;align-items:center;gap:8px}
.cl-flow li+li::before{content:"→";color:var(--d-on-var);font:400 1rem/1 var(--d-mono)}
[dir="rtl"] .cl-flow li+li::before{content:"←"}
.cl-step{display:inline-block;background:var(--d-container);border:1px solid var(--d-outline-var);padding:8px 12px;font:600 .8125rem/1.25 var(--d-sans)}
.cl-step--ask{background:rgba(245,160,90,.22);border-color:rgba(245,160,90,.65)}
.cl-step--wait{background:rgba(120,200,120,.22);border-color:rgba(120,200,120,.65)}
.cl-step--home{background:rgba(242,201,76,.25);border-color:rgba(242,201,76,.75)}
.cl-step--alt{border-style:dashed}
.cl-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 0 0;padding:0;list-style:none;font:400 .75rem/1.5 var(--d-mono);color:var(--d-on-var)}
.cl-legend i{display:inline-block;width:12px;height:12px;vertical-align:-1px;margin-inline-end:6px;border:1px solid var(--d-outline-var)}
.cl-val{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
@media(max-width:700px){.cl-val{grid-template-columns:1fr}}
.cl-val h3{margin:0 0 6px}
.cl-row{display:grid;grid-template-columns:74px 1fr;gap:12px;align-items:center;padding:8px 0}
.cl-row .cl-bub{--s:74px}
.cl-row .cl-bub--n b{font-size:.9375rem}
.cl-row q{display:block;font:400 .9375rem/1.45 var(--d-sans);font-style:italic}
.cl-row q::before,.cl-row q::after{content:none}
.cl-row small{display:block;font:400 .75rem/1.3 var(--d-mono);color:var(--d-on-var);margin-top:2px}
.cl-wish{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.cl-wish li{background:var(--d-container);padding:10px 12px}
.cl-wish b{display:block;font:600 .9375rem/1.3 var(--d-sans)}
.cl-wish span{font:400 .8125rem/1.4 var(--d-mono);color:var(--d-on-var)}
.cl-personas{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:700px){.cl-personas{grid-template-columns:1fr}}
.cl-persona{background:var(--d-container);padding:18px 18px 16px;border-top:3px solid var(--cl)}
.cl-persona q{display:block;font:600 1.125rem/1.35 var(--d-sans);margin:0 0 10px}
.cl-persona q::before,.cl-persona q::after{content:none}
.cl-persona p{margin:0 0 8px;font-size:.9375rem;max-width:none}
.cl-persona dl{margin:10px 0 0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:.875rem;line-height:1.5}
.cl-persona dt{font:600 .6875rem/1.7 var(--d-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--d-on-var)}
.cl-persona dd{margin:0}
.cl-bars{display:grid;grid-template-columns:auto 1fr 1fr;gap:6px 12px;align-items:center}
.cl-bars>b{font:400 .8125rem/1.3 var(--d-mono);color:var(--d-on-var)}
.cl-bars .h{font:600 .6875rem/1.3 var(--d-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--d-on-var)}
.cl-bar{position:relative;height:22px;background:var(--d-container)}
.cl-bar i{position:absolute;top:0;bottom:0;inset-inline-start:0;width:calc(var(--p)*1%);background:var(--cl);opacity:.85}
.cl-bar--a i{background:var(--d-on-var);opacity:.35}
.cl-bar span{position:relative;z-index:1;display:block;padding:0 8px;font:600 .75rem/22px var(--d-mono)}
@media(max-width:600px){.cl-bars{grid-template-columns:1fr 1fr}.cl-bars>b{grid-column:1/-1;margin-top:6px}}
.cl-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;list-style:none;margin:0;padding:0}
.cl-tools li{background:var(--d-container);padding:12px 14px}
.cl-tools b{display:block;font:600 .875rem/1.3 var(--d-sans);margin-bottom:6px}
.cl-tools span{display:block;font:400 .8125rem/1.5 var(--d-mono);color:var(--d-on-var)}
.cl-find{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;list-style:none;margin:16px 0 24px;padding:0}
.cl-find li{background:var(--d-container);padding:14px 16px;border-top:3px solid var(--cl)}
.cl-find b{display:block;font:600 .9375rem/1.35 var(--d-sans);margin-bottom:4px}
.cl-find span{font:400 .8125rem/1.5 var(--d-mono);color:var(--d-on-var)}
.cl-val>div,.cl-q>*,.cl{min-width:0}
.cl-dd__phases ul li{font:inherit;margin:0 0 4px;padding:0;border:0;background:none}
.cl-dims>li,.cl-find li,.cl-tools li,.cl-wish li{margin:0}

.s-form__ok{font:500 1.125rem/1.75rem var(--d-sans);padding:16px 20px;border-inline-start:4px solid var(--d-dato);background:var(--d-low);color:var(--d-on);outline:0}
.cl-bub--n b{color:#ff6b7a}

/* ---- cuaderno: un brandbook que se abre y pasa de hoja ---- */
.s-book{margin:24px 0 28px;direction:ltr}
.s-book__stage{perspective:2400px;max-width:760px;margin:0 auto;padding:16px 0}
.s-book__book{position:relative;width:100%;aspect-ratio:2.828;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,0,0,1)}
.s-book__book.is-closed{transform:translateX(-25%)}
.s-book__book.is-end{transform:translateX(25%)}
.s-book__board{position:absolute;top:0;bottom:0;width:50%;background:#1e3a4f;border-radius:4px;box-shadow:0 20px 40px -18px rgba(5,10,20,.7)}
.s-book__board--l{left:0;border-radius:6px 2px 2px 6px}.s-book__board--r{right:0;border-radius:2px 6px 6px 2px}
.s-book__book.is-closed .s-book__board--l,.s-book__book.is-end .s-book__board--r{visibility:hidden}
.s-book__leaf{position:absolute;top:0;bottom:0;left:50%;width:50%;transform-origin:left center;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.4,0,.2,1);cursor:pointer;background:transparent;border:0;padding:0;font:inherit;color:inherit}
.s-book__leaf:focus-visible{outline:none}
.s-book__face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;background:#fff;border-radius:2px}
.s-book__face--back{transform:rotateY(180deg)}
.s-book__face img{display:block;width:100%;height:100%;object-fit:cover}
.s-book__face--cover{background:#1e3a4f;border-radius:2px 6px 6px 2px}
.s-book__face--inside{background:#1e3a4f}
.s-book__face::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.14),transparent 12%)}
.s-book__face--back::after{background:linear-gradient(270deg,rgba(0,0,0,.14),transparent 12%)}
.s-book__face--cover::after{background:linear-gradient(90deg,rgba(0,0,0,.35),transparent 10%)}
.s-book__spine{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:rgba(5,10,20,.35);z-index:1}
.s-book__bar{display:flex;align-items:center;gap:var(--d-3);margin-top:12px;justify-content:center}
.s-book__dots{display:flex;gap:4px;flex:0 1 240px}
.s-book__dots i{flex:1;height:4px;background:var(--d-highest)}.s-book__dots i.is-on{background:var(--d-nav)}
.s-book__count{font:500 .75rem/1rem var(--d-mono);color:var(--d-on-var);min-width:48px;text-align:center}
.s-book__bar .d-iconbtn[disabled]{opacity:var(--d-dis-content);pointer-events:none}
.s-book .d-hint{text-align:center;margin-top:8px}
[dir="rtl"] .s-book .d-hint{direction:rtl}
@media(prefers-reduced-motion:reduce){.s-book__leaf,.s-book__book{transition:none}}
@media(max-width:600px){.s-book__book.is-closed{transform:translateX(-25%) scale(1.3)}.s-book__book.is-end{transform:translateX(25%) scale(1.3)}.s-book__stage{padding:28px 0}}

/* Sobre mí · tarjeta "Just for fun, brands" (elevación 3, el rosa de acción para la palabra) */
.s-fun{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px 32px;margin:32px 0 8px;padding:30px 34px;border-radius:var(--d-r-d-lg);background:var(--d-container);box-shadow:var(--d-e3),0 18px 40px -18px rgba(0,0,0,.6);color:var(--d-on);text-decoration:none;transition:transform var(--d-dur-m2) var(--d-ease),box-shadow var(--d-dur-m2) var(--d-ease)}
.s-fun:hover{transform:translateY(-4px);box-shadow:var(--d-e3),0 26px 50px -18px rgba(0,0,0,.7)}
.s-fun:focus-visible{outline:none;box-shadow:var(--d-focus),var(--d-e3)}
.s-fun__txt{min-width:0}
.s-fun__k{display:block;font:500 .8125rem/1 var(--d-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--d-on-var)}
.s-fun__t{display:block;font:800 clamp(2.75rem,8vw,4.5rem)/.95 var(--d-sans);letter-spacing:-.035em;margin:12px 0 10px;color:var(--d-accion)}
.s-fun__s{display:block;color:var(--d-on-var);font:400 1rem/1.45 var(--d-sans)}
.s-fun__logos{display:flex;align-items:center;padding-inline-start:18px}
.s-fun__logos i{flex:none;width:84px;height:84px;margin-inline-start:-18px;border-radius:18px;background:var(--b);display:grid;place-items:center;box-shadow:var(--d-e2),0 0 0 1px rgba(255,255,255,.08);transform:rotate(var(--r));transition:transform var(--d-dur-m2) var(--d-ease)}
.s-fun__logos img{max-width:72%;max-height:72%;object-fit:contain}
.s-fun:hover .s-fun__logos i{transform:rotate(0) translateY(-6px)}
.s-fun:hover .s-fun__logos i:nth-child(2){transition-delay:30ms}.s-fun:hover .s-fun__logos i:nth-child(3){transition-delay:60ms}.s-fun:hover .s-fun__logos i:nth-child(4){transition-delay:90ms}.s-fun:hover .s-fun__logos i:nth-child(5){transition-delay:120ms}
@media(max-width:640px){.s-fun{grid-template-columns:minmax(0,1fr);padding:24px 22px}.s-fun__logos i{width:62px;height:62px;border-radius:14px;margin-inline-start:-12px}.s-fun__logos{padding-inline-start:12px}}
@media(prefers-reduced-motion:reduce){.s-fun,.s-fun__logos i{transition:none}.s-fun:hover{transform:none}}

/* ---- portada: la suite abierta (29/10/2026). Sin JS la tapa está abierta y se ve la captura; con JS se abre al cargar. ---- */
.s-hero--suite{text-align:center;padding-top:clamp(24px,3.5vw,40px);padding-bottom:clamp(20px,3vw,32px)}
@media(max-width:1199px){.s-hero--suite{overflow-x:clip}}   /* el brillo y la base de la laptop asoman unos píxeles; a partir de 1200 las cifras salen a los costados y hay lugar */
.s-hero--suite .s-hero__txt{max-width:720px;margin:0 auto}
.s-hero--suite h1{margin-bottom:8px;font-size:clamp(2.25rem,5.6vw,3.5rem)}
.s-hero--suite .s-role,.s-hero--suite .s-hero__txt>p{margin-left:auto;margin-right:auto}
.s-hero--suite .s-hero__txt>p:not(.s-role){font-size:clamp(1rem,1.8vw,1.125rem);color:var(--d-on-var);max-width:58ch;margin-bottom:18px}
.s-hero--suite .d-row{justify-content:center}
/* Botón flotante «Escribime» (29/10): fijo abajo a la derecha (a la izquierda en hebreo), en todas las páginas menos Contacto, solo en celular y tablet (<900 px):
   ahí «Escribime» queda dentro del menú; en escritorio la cabecera fija ya lo muestra. */
.s-fab{position:fixed;inset-inline-end:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:40;text-decoration:none;align-items:center;height:52px;padding:0 20px 0 22px;font:600 .9375rem/1 var(--d-sans);box-shadow:var(--d-e3);transition:opacity .3s var(--d-ease),transform .3s var(--d-ease)}
.s-fab svg{width:20px;height:20px}
.s-fab:hover{transform:translateY(-1px)}.s-fab:focus-visible{outline:none;box-shadow:var(--d-focus)}
@media(min-width:900px){.s-fab{display:none}}   /* en escritorio la cabecera fija ya tiene «Escribime» */
@media(max-width:600px){.s-fab{height:48px;padding:0 16px 0 18px;font-size:.875rem}}
@media(prefers-reduced-motion:reduce){.s-fab{transition:none}}
@media print{.s-fab{display:none}}
/* Jerarquía del héroe (29/10, pedido de Débora): primero la presentación, larga y liviana; debajo, en negrita, la frase corta que presenta lo que se ve en la laptop, con «Probalo» como enlace a la demo. */
.s-hero--suite .s-hero__lead{font:400 1rem/1.55 var(--d-sans)!important;color:var(--d-on-var);max-width:62ch;margin:0 auto;text-align:center}
.s-hero--suite .s-hero__intro{font:600 1.125rem/1.45 var(--d-sans)!important;color:var(--d-on);max-width:56ch;margin:14px auto 0;text-align:center}
.s-hero--suite .s-hero__intro .d-link{font-weight:700}
.s-lap{position:relative;width:min(100%,960px);margin:clamp(22px,3.5vw,36px) auto 0;perspective:1800px;--tx:0deg;--ty:0deg;--scale:1}
/* Tamaño de la laptop: entra entera en el primer pantallazo, con aire abajo. site.js mide dónde empieza y fija --lapw; sin JS vale el cálculo por alto. */
@media(min-width:900px){.s-lap{width:clamp(440px,var(--lapw,calc((100vh - 372px) * 1.54)),960px)}}
.s-lap__glow{position:absolute;inset:-14% -10% -12%;pointer-events:none;z-index:0;filter:blur(34px);opacity:.9;transition:opacity 1s var(--d-ease);
  background:radial-gradient(55% 50% at 28% 42%,rgba(232,144,204,.26),transparent 62%),radial-gradient(50% 50% at 76% 58%,rgba(128,236,236,.2),transparent 62%),radial-gradient(38% 40% at 56% 18%,rgba(220,208,96,.14),transparent 62%)}
.s-lap__body{position:relative;z-index:1;transform:rotateX(var(--tx)) rotateY(var(--ty));transform-style:preserve-3d;transition:transform .5s var(--d-ease)}
.s-lap__lid{position:relative;transform-origin:50% 100%;transform:rotateX(0);transition:transform 1s var(--d-ease-emph-out);background:linear-gradient(180deg,#3B3F47,#23262C 70%,#1C1E23);border:1px solid #6A6F79;border-bottom-color:#3A3D44;border-radius:18px 18px 6px 6px;padding:13px 13px 22px;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 -1px 0 rgba(0,0,0,.5) inset,0 44px 80px -36px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.35)}   /* la tapa: aluminio gris (no azul como el fondo), mentón bajo la pantalla (29/10) */
.s-lap__cam{position:absolute;top:4px;left:50%;width:6px;height:6px;border-radius:50%;background:#0B0D11;box-shadow:0 0 0 1.5px #4F545E,0 0 3px 1px rgba(120,200,255,.25) inset;transform:translateX(-50%)}
.s-lap__scr{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:6px;background:#161418;direction:ltr;box-shadow:0 0 0 1px #0A0C10,0 0 0 2px #2E3139}
.s-lap__scr>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transition:opacity .6s var(--d-ease);border:0;margin:0}
.s-lap__scr>img.is-on{opacity:1}
.s-lap__scr::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 32%,rgba(255,255,255,.34) 50%,transparent 68%);transform:translateX(-130%)}
.s-lap.is-sweep .s-lap__scr::after{transition:transform .8s var(--d-ease);transform:translateX(130%)}
.s-lap__deck{position:relative;height:clamp(22px,4.2vw,40px);margin:0 -7%;background:linear-gradient(180deg,#A3A8B2 0,#787D87 14%,#5C616A 48%,#43474F 86%,#2E3137);clip-path:polygon(3.5% 0,96.5% 0,100% 100%,0 100%);
  border-radius:0 0 14px 14px;box-shadow:0 28px 44px -20px rgba(0,0,0,.95),0 2px 0 -1px rgba(255,255,255,.14) inset}   /* la base, vista de frente y un poco desde arriba (29/10) */
.s-lap__deck::before{content:"";position:absolute;left:3.5%;right:3.5%;top:0;height:22%;background:linear-gradient(180deg,#15171B,#2A2D33);border-radius:0 0 3px 3px}   /* la bisagra */
.s-lap__deck::after{content:"";position:absolute;left:50%;top:22%;width:17%;height:26%;background:linear-gradient(180deg,#3A3E46,#50545D);border-radius:0 0 10px 10px;transform:translateX(-50%);box-shadow:0 1px 0 rgba(255,255,255,.12)}   /* la muesca del trackpad */
.s-lap__foot{position:absolute;left:4%;right:4%;bottom:-14px;height:14px;background:radial-gradient(50% 100% at 50% 0,rgba(0,0,0,.55),transparent 70%);pointer-events:none}   /* sombra sobre la mesa */
.s-lap__chips{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;position:relative;z-index:2}
.s-lap__chips li{display:flex;align-items:baseline;gap:8px;background:var(--d-container);border:1px solid var(--d-outline-var);padding:10px 14px;border-radius:var(--d-r-full);box-shadow:var(--d-e2);transition:opacity .45s var(--d-ease),transform .45s var(--d-ease-emph-out);transition-delay:calc(var(--d)*.12s)}
.s-lap__chips b{font:700 1.125rem/1 var(--d-sans);color:var(--d-dato);letter-spacing:-.01em}
.s-lap__chips span{font:400 .75rem/1.2 var(--d-mono);color:var(--d-on-var)}
@media(min-width:1200px){   /* las cifras flotan fuera de la laptop solo cuando hay lugar a los costados */
  .s-lap{width:clamp(440px,var(--lapw,calc((100vh - 372px) * 1.54)),900px)}
  .s-lap__chips{position:absolute;inset:0;margin:0;display:block;pointer-events:none}
  .s-lap__chips li{position:absolute;pointer-events:auto;flex-direction:column;align-items:flex-start;gap:4px;max-width:200px;padding:12px 16px;border-radius:var(--d-r-lg);animation:s-lap-float 6s ease-in-out infinite;animation-delay:calc(var(--d)*-2s)}
  .s-lap__chips b{white-space:nowrap;font-size:1.375rem}
  [dir="rtl"] .s-lap__chips li{align-items:flex-end}
  .s-lap__chips li:nth-child(1){right:calc(100% + 36px);top:26%}
  .s-lap__chips li:nth-child(2){left:calc(100% + 36px);top:12%}
  .s-lap__chips li:nth-child(3){left:calc(100% + 36px);bottom:16%}
}
@media(pointer:coarse){.s-lap.is-open .s-lap__body{transition:transform .25s linear}}
.s-lap.is-drive .s-lap__body{transition:none}   /* en escritorio el movimiento lo calcula site.js cuadro a cuadro */
@media(min-width:900px) and (pointer:fine){   /* profundidad: el resplandor, la sombra y las cifras se corren un poco al revés de la inclinación */
  .s-lap__glow{transform:translate3d(calc(var(--nx,0) * -22px),calc(var(--ny,0) * -14px),0)}
  .s-lap__foot{transform:translateX(calc(var(--nx,0) * 12px))}
  .s-lap__chips{transform:translate3d(calc(var(--nx,0) * -14px),calc(var(--ny,0) * -8px),0)}
}
@keyframes s-lap-float{0%,100%{translate:0 0}50%{translate:0 -5px}}
/* estado inicial que pone el JS antes de animar */
.s-lap.is-pre .s-lap__lid{transform:rotateX(-86deg);transition:none}
.s-lap.is-pre .s-lap__glow{opacity:0;transition:none}
.s-lap.is-pre .s-lap__chips li{opacity:0;transform:translateY(12px) scale(.96);transition:none;animation:none}
.s-lap.is-open .s-lap__lid{transform:rotateX(0)}
.s-lap.is-open .s-lap__glow{opacity:.9}
.s-lap.is-chips .s-lap__chips li{opacity:1;transform:none}
.s-lap.is-chips.is-open .s-lap__chips li{animation-play-state:running}
@media(prefers-reduced-motion:reduce){
  .s-lap.is-pre .s-lap__lid,.s-lap .s-lap__lid{transform:none;transition:none}
  .s-lap.is-pre .s-lap__glow{opacity:.9}.s-lap.is-pre .s-lap__chips li{opacity:1;transform:none}
  .s-lap__chips li{animation:none!important}.s-lap__body{transition:none}.s-lap.is-sweep .s-lap__scr::after{transition:none;transform:translateX(-130%)}
}
/* tarjetas de casos con portada */
.s-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.s-card{display:flex;flex-direction:column;background:var(--d-low);border:1px solid var(--d-outline-var);border-radius:var(--d-r-md);overflow:hidden;color:inherit;text-decoration:none;min-width:0;transition:transform .3s var(--d-ease),border-color .3s}
.s-card:hover{transform:translateY(-3px);border-color:var(--d-outline)}
.s-card:focus-visible{outline:none;box-shadow:var(--d-focus)}
.s-card__pic{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--d-lowest);border-bottom:1px solid var(--d-outline-var)}
.s-card__pic img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .6s var(--d-ease)}
.s-card:hover .s-card__pic img{transform:scale(1.03)}
.s-card__pic--chart{display:flex;align-items:flex-end;justify-content:center;gap:6%;padding:14% 12% 0;background:linear-gradient(180deg,var(--d-lowest),var(--d-container))}
.s-card__pic--chart i{display:block;width:9%;height:var(--h);background:var(--d-dato);opacity:.9;border-radius:2px 2px 0 0}
.s-card__pic--chart i:nth-child(odd){background:var(--d-dato-cont);opacity:1}
.s-card__t{display:block;padding:12px 14px 4px}
.s-card__t b{display:block;font:700 1rem/1.3 var(--d-sans)}
.s-card__t small{display:block;font:400 .875rem/1.4 var(--d-sans);color:var(--d-on-var);margin-top:3px}
.s-card__m{display:block;padding:0 14px 12px;margin-top:auto;font:400 .6875rem/1.4 var(--d-mono);color:var(--d-on-var);letter-spacing:.04em}
@media(prefers-reduced-motion:reduce){.s-card,.s-card__pic img{transition:none}.s-card:hover{transform:none}.s-card:hover .s-card__pic img{transform:none}}
/* Celular (29/10): los casos en dos columnas compactas, con portada, título y año; la bajada se ve al abrir el caso. */
@media(max-width:600px){
  .s-cards{grid-template-columns:1fr 1fr;gap:14px;padding:0 6px}
  .s-card__t{padding:8px 10px 2px}.s-card__t b{font-size:.8125rem;line-height:1.25}.s-card__t small{display:none}
  .s-card__m{padding:0 10px 9px;font-size:.625rem;letter-spacing:.02em}
}

/* Sobre mí (29/10): los grupos y empresas destacados, como fichas con enlace, antes del párrafo que los explica. */
.s-brands__t{margin:22px 0 8px}
.s-brands__chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.s-brands__chips a{display:inline-block;background:var(--d-low);border:1px solid var(--d-outline-var);border-radius:999px;padding:8px 14px;font:600 .875rem/1.25rem var(--d-sans);color:var(--d-on);text-decoration:none;transition:border-color .2s,transform .2s}
.s-brands__chips a:hover{border-color:var(--d-outline);transform:translateY(-1px)}.s-brands__chips a:focus-visible{outline:none;box-shadow:var(--d-focus)}

/* Caso Riley (29/10): el personaje junto al texto, un día en la vida como línea de tiempo y el recorrido en siete etapas. */
.rl-hero{display:grid;grid-template-columns:minmax(160px,220px) 1fr;gap:24px;align-items:center;margin:8px 0 28px}
.rl-hero img{width:100%;height:auto;display:block;filter:drop-shadow(0 18px 30px rgba(0,0,0,.45))}
.rl-hero__t{font:700 1.375rem/1.25 var(--d-sans);margin:0 0 8px}
@media(max-width:600px){.rl-hero{grid-template-columns:120px 1fr;gap:14px}}
.rl-day{list-style:none;margin:20px 0 32px;padding:0;display:grid;gap:10px}
.s-art .rl-day,.s-art .rl-stages{padding:0;max-width:none}
.rl-day li{display:grid;grid-template-columns:64px 1fr;gap:12px;background:var(--d-container);border-radius:var(--d-r-md);padding:14px 16px}
.rl-day time{font:600 .8125rem/1.2 var(--d-mono);color:var(--d-dato);padding-top:3px}
.rl-day__body b{display:block;font:700 1rem/1.3 var(--d-sans)}
.rl-day__body p{margin:4px 0 10px;font-size:.9375rem;color:var(--d-on-var)}
.rl-day__tags{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.rl-tag{display:block;font:400 .8125rem/1.4 var(--d-sans);padding:8px 10px;border-radius:8px;background:var(--d-low);border-left:3px solid var(--d-dato)}
.rl-tag i{display:block;font:600 .6875rem/1.2 var(--d-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--d-dato);margin-bottom:2px}
.rl-tag--a{border-left-color:var(--d-dato-cont)}.rl-tag--a i{color:var(--d-dato-cont)}
[dir="rtl"] .rl-tag{border-left:0;border-right:3px solid var(--d-dato)}[dir="rtl"] .rl-tag--a{border-right-color:var(--d-dato-cont)}
@media(max-width:600px){.rl-day li{grid-template-columns:1fr;gap:4px}}
.rl-stages{list-style:none;margin:20px 0 32px;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.rl-stage{background:var(--d-container);border-top:3px solid var(--d-dato);border-radius:0 0 var(--d-r-md) var(--d-r-md);padding:14px 16px;margin:0}
.rl-stage b{display:block;font:700 1rem/1.3 var(--d-sans)}
.rl-stage p{margin:4px 0 10px;font-size:.9375rem;color:var(--d-on-var)}
.rl-stage__ch{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.rl-stage__ch span{font:400 .6875rem/1 var(--d-mono);letter-spacing:.04em;background:var(--d-low);border-radius:999px;padding:6px 9px}
.rl-stage__q{margin:0;padding-inline-start:18px;font-size:.875rem;color:var(--d-on)}
.rl-stage__q li{margin:4px 0}