/* Vicky Veltri · portfolio
   Cada página define --bg --ink --accent --soft en el <body>. */
:root{
  --magenta:#D1439D;
  --f-sans:"Archivo",system-ui,sans-serif;
  --f-serif:"Gloock",Georgia,serif;
  --f-hand:"Gochi Hand","Comic Sans MS",cursive;
  --gut:clamp(16px,4vw,56px);
  --r:18px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg,#FBF8F3);color:var(--ink,#161214);font-family:var(--f-sans);font-size:clamp(16px,1.05vw + 10px,18px);line-height:1.5;overflow-x:hidden;font-variation-settings:"wdth" 100}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:600;line-height:1;letter-spacing:-.02em}
p{margin:0}
::selection{background:var(--accent);color:#fff}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:99px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}

.lbl{font-family:var(--f-serif);font-size:1rem;color:var(--accent);margin-bottom:14px}
.num{font-variant-numeric:tabular-nums;font-size:.8rem;opacity:.6}
.tag{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;opacity:.7}
.meta{display:block;font-size:.78rem;opacity:.55;margin-top:4px}
.star{width:1em;height:1em;fill:currentColor}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--gut);background:color-mix(in srgb,var(--bg) 95%,transparent)}
.logo{display:flex;align-items:center;gap:2px;text-decoration:none;font-weight:700;font-size:1.25rem;letter-spacing:-.03em}
.logo em{font-family:var(--f-serif);font-weight:400;color:var(--accent);margin-left:4px}
.logo-star{width:14px;height:14px;fill:var(--accent);margin-left:4px;transition:transform .6s cubic-bezier(.3,1.6,.5,1)}
.logo:hover .logo-star{transform:rotate(180deg) scale(1.3)}
.nav{display:flex;gap:clamp(12px,2.4vw,28px);font-size:.95rem}
.nav a{text-decoration:none;position:relative;padding:4px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav a:hover::after{transform:scaleX(1)}
.nav .lang{border:1.5px solid currentColor;border-radius:99px;padding:3px 10px;font-size:.78rem;font-weight:600}
.nav .lang::after{display:none}
@media (max-width:560px){.nav a:not(.lang):first-child{display:none}.nav{font-size:.9rem}}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:99px;border:1.5px solid currentColor;text-decoration:none;font-weight:600;font-size:.95rem;transition:transform .25s,background .25s,color .25s;min-height:48px}
.btn span{transition:transform .25s}
.btn:hover{transform:translateY(-2px) rotate(-1deg)}
.btn:hover span{transform:translateX(4px)}
.btn-solid{background:var(--accent);border-color:var(--accent);color:#fff}
.cta-btns{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- placeholder de foto ---------- */
.ph{position:relative;aspect-ratio:var(--r,4/5);border-radius:calc(var(--r-ph,14px));background:
  radial-gradient(circle at 30% 25%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 55%),
  radial-gradient(circle at 75% 80%,var(--soft2,var(--soft)),transparent 60%),var(--soft);overflow:hidden;display:grid;place-items:center}
.ph.alt1{background:radial-gradient(circle at 70% 30%,#fff 0,transparent 50%),var(--soft2,var(--soft))}
.ph.alt2{background:radial-gradient(circle at 40% 60%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 60%),#f4f1ee}
.ph::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");mix-blend-mode:multiply;pointer-events:none}
.ph span{position:absolute;left:12px;bottom:10px;font-size:.72rem;opacity:.55;font-family:var(--f-serif)}
.ph-star{width:28%;max-width:60px;fill:var(--accent);opacity:.25;transition:transform .8s cubic-bezier(.3,1.6,.5,1)}
*:hover>.ph .ph-star,.ph:hover .ph-star{transform:rotate(90deg) scale(1.15)}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:calc(100svh - 70px);padding:clamp(40px,8vh,90px) var(--gut) 60px;display:flex;flex-direction:column;justify-content:center}
.hero-hi{font-family:var(--f-serif);font-size:clamp(1.3rem,2.4vw,2rem)}
.hero-name{font-size:clamp(4.6rem,17vw,15rem);line-height:.86;letter-spacing:-.05em;font-weight:700;margin:.08em 0 .14em;font-variation-settings:"wdth" 90;user-select:none}
.hero-name .row{display:block;white-space:nowrap}
.hero-name .it{font-family:var(--f-serif);font-weight:400;color:var(--accent);letter-spacing:-.03em;padding-left:.5em}
.fl{display:inline-block;will-change:transform;animation:bob 5s ease-in-out infinite}
.fl:nth-child(2n){animation-delay:-1.3s}.fl:nth-child(3n){animation-delay:-2.6s;animation-duration:6s}.fl:nth-child(5n){animation-delay:-.7s}
@keyframes bob{50%{translate:0 -.04em;rotate:1.5deg}}
.hero-soy{font-size:clamp(1.5rem,3.4vw,2.8rem);font-weight:500;display:flex;flex-wrap:wrap;align-items:baseline;gap:.3em .4em;letter-spacing:-.02em}
.soy-word{display:inline-block;color:var(--c);background:var(--cb);padding:.02em .35em .08em;border-radius:.4em;text-decoration:none;font-family:var(--f-serif);font-weight:500;transform:rotate(-2deg);transition:background .4s,color .4s}
.soy-word.swap{animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{0%{transform:rotate(-2deg) scale(.6);opacity:0}100%{transform:rotate(-2deg) scale(1);opacity:1}}
.soy-shuffle{font:inherit;font-size:.9rem;font-weight:600;background:none;border:1.5px solid currentColor;border-radius:99px;padding:6px 14px;cursor:pointer;color:inherit;align-self:center;transition:transform .3s}
.soy-shuffle:hover{transform:rotate(-8deg)}
.hero-tag{margin-top:22px;max-width:30ch;font-size:clamp(1rem,1.4vw,1.2rem)}
.hero-hint{margin-top:8px;font-size:.82rem;opacity:.5}
.stk{position:absolute;color:var(--accent);animation:spin 14s linear infinite}
.stk .star{width:100%;height:100%}
.stk-1{width:54px;height:54px;top:16%;right:9%}
.stk-2{width:26px;height:26px;top:56%;right:22%;color:#F7C948;animation-duration:9s;animation-direction:reverse}
.stk-3{width:38px;height:38px;bottom:12%;right:6%;color:#5B3DF5;animation-duration:18s}
@keyframes spin{to{rotate:360deg}}

/* ---------- marquee ---------- */
.marquee{overflow:hidden;background:var(--ink);color:var(--bg);padding:16px 0;transform:rotate(-1.5deg);margin:20px -10px}
.marquee-in{display:flex;align-items:center;gap:28px;width:max-content;animation:mq 26s linear infinite;font-size:clamp(1.6rem,4vw,3rem);font-weight:600;letter-spacing:-.02em}
.marquee-in span:nth-child(4n+1){font-family:var(--f-serif);font-weight:400}
.marquee-in .star{width:.6em;height:.6em;fill:var(--magenta)}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- quiz ---------- */
.quiz{padding:clamp(70px,12vh,140px) var(--gut);max-width:1100px}
.quiz h2,.desk h2,.cta h2,.about-teaser h2,.brides h2{font-size:clamp(2.2rem,5.6vw,4.6rem)}
.q-list{list-style:none;margin:36px 0 0;padding:0;display:grid;gap:10px}
.q-opt{display:flex;align-items:center;gap:16px;padding:18px 22px;border:1.5px solid color-mix(in srgb,var(--ink) 20%,transparent);border-radius:var(--r);text-decoration:none;font-size:clamp(1.05rem,1.6vw,1.35rem);transition:background .25s,transform .25s,border-color .25s}
.q-n{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;border:1.5px solid currentColor;font-size:.85rem;font-weight:600}
.q-arr{margin-left:auto;transition:transform .25s}
.q-opt:hover{background:var(--soft);border-color:var(--accent);transform:translateX(6px) rotate(-.4deg)}
.q-opt:hover .q-n{background:var(--accent);border-color:var(--accent);color:#fff}
.q-opt:hover .q-arr{transform:translateX(6px)}

/* ---------- mesa / collage ---------- */
.desk{padding:40px var(--gut) 80px}
.desk-head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 40px;margin-bottom:24px}
.desk-head .lbl{width:100%;margin:0}
.desk-head h2{max-width:14ch}
.desk-hint{font-size:.85rem;opacity:.55}
.desk-board{position:relative;height:min(92vh,860px);min-height:620px;border-radius:28px;background:
  radial-gradient(circle,color-mix(in srgb,var(--ink) 14%,transparent) 1px,transparent 1.5px) 0 0/22px 22px,#fff;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 10%,transparent);overflow:hidden;touch-action:pan-y}
.card{position:absolute;left:var(--x);top:var(--y);width:clamp(180px,20vw,250px);aspect-ratio:3/4;padding:18px;border-radius:20px;background:var(--cbg);color:var(--cink);text-decoration:none;display:flex;flex-direction:column;transform:rotate(var(--rot));box-shadow:0 1px 2px rgba(0,0,0,.06),0 10px 30px -10px rgba(0,0,0,.25);border:1.5px solid color-mix(in srgb,var(--cacc) 35%,transparent);transition:transform .45s cubic-bezier(.3,1.5,.5,1),box-shadow .3s;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none}
.card::before{content:"";position:absolute;inset:auto 14px 14px 14px;height:46%;border-radius:12px;background:radial-gradient(circle at 30% 30%,color-mix(in srgb,var(--cacc) 40%,transparent),transparent 60%),var(--csoft)}
.card:hover,.card.dragging{transform:rotate(0) scale(1.05);box-shadow:0 2px 4px rgba(0,0,0,.08),0 24px 50px -14px rgba(0,0,0,.35);z-index:20}
.card.dragging{cursor:grabbing;transition:box-shadow .3s}
.card-n{font-size:.78rem;font-weight:600;color:var(--cacc)}
.card-name{font-size:clamp(1.35rem,2vw,1.8rem);font-weight:650;line-height:1;margin-top:6px;letter-spacing:-.03em;position:relative}
.card-tags{font-size:.74rem;opacity:.7;margin-top:8px;position:relative}
.card-peek{position:absolute;left:50%;bottom:20%;width:0;height:0;pointer-events:none}
.card-peek i{position:absolute;width:110px;height:140px;left:-55px;top:-70px;border-radius:10px;background:var(--csoft);border:4px solid #fff;box-shadow:0 10px 24px -8px rgba(0,0,0,.35);opacity:0;transition:transform .5s cubic-bezier(.3,1.5,.5,1),opacity .3s}
.card-peek i:nth-child(1){background:radial-gradient(circle at 30% 30%,var(--cacc),transparent 70%),var(--csoft)}
.card-peek i:nth-child(2){background:radial-gradient(circle at 70% 60%,#fff,transparent 60%),var(--csoft)}
.card-peek i:nth-child(3){background:linear-gradient(160deg,var(--csoft),color-mix(in srgb,var(--cacc) 50%,#fff))}
.card:hover .card-peek i{opacity:1}
.card:hover .card-peek i:nth-child(1){transform:translate(-70px,-150px) rotate(-14deg)}
.card:hover .card-peek i:nth-child(2){transform:translate(0,-180px) rotate(3deg)}
.card:hover .card-peek i:nth-child(3){transform:translate(70px,-150px) rotate(15deg)}
.note{position:absolute;padding:16px 18px;max-width:220px;font-family:var(--f-serif);font-size:1.05rem;line-height:1.25;background:#FFF3A6;box-shadow:0 8px 20px -10px rgba(0,0,0,.3);cursor:grab;user-select:none;touch-action:none}
.note::before{content:"";position:absolute;top:-10px;left:50%;width:70px;height:20px;margin-left:-35px;background:rgba(209,67,157,.35);transform:rotate(-4deg)}
.note-play{right:4%;top:40%;transform:rotate(5deg)}
.note-mirror{left:56%;top:82%;transform:rotate(-3deg);background:#fff;display:flex;gap:12px;align-items:center;max-width:300px}
.mirror{flex:none;width:44px;height:58px;border-radius:50%;background:linear-gradient(135deg,#fff,#d9e6f2 40%,#b9c9d8 60%,#fff);border:3px solid #D1439D}
.desk-star{position:absolute;color:var(--magenta);animation:spin 20s linear infinite}
.ds-1{width:40px;left:28%;top:40%}.ds-2{width:24px;right:30%;top:6%;color:#F7C948}
.desk-star .star{width:100%;height:100%}
@media (max-width:820px){
  .desk-board{height:auto;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:16px;background-size:18px 18px}
  .card,.note{position:relative;left:auto;top:auto;width:auto;max-width:none;right:auto}
  .card{aspect-ratio:3/4;padding:14px;cursor:pointer}
  .card:nth-child(odd){transform:rotate(-2deg)}.card:nth-child(even){transform:rotate(2deg)}
  .card-peek{display:none}
  .note-play,.note-mirror{grid-column:span 2;transform:rotate(-1deg);margin-top:8px}
  .desk-star{display:none}
}

/* ---------- sobre mí teaser ---------- */
.about-teaser{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,6vw,90px);align-items:center;padding:clamp(60px,10vh,120px) var(--gut)}
.at-img .ph{transform:rotate(-3deg);border:10px solid #fff;box-shadow:0 20px 40px -20px rgba(0,0,0,.35)}
.at-txt h2{margin-bottom:22px}
.at-txt p{max-width:46ch;margin-bottom:28px}
@media (max-width:760px){.about-teaser{grid-template-columns:1fr}.at-img{max-width:320px}}

/* ---------- CTA ---------- */
.cta{padding:clamp(70px,12vh,140px) var(--gut);text-align:left;background:var(--soft);border-radius:32px;margin:0 var(--gut) 40px}
.cta h2{max-width:18ch;margin-bottom:32px}
.cta-world{margin-top:26px;font-size:.9rem;opacity:.7}

/* ---------- footer ---------- */
.foot{padding:40px var(--gut) 100px;border-top:1.5px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.foot-big a{display:inline-flex;align-items:center;gap:.15em;font-size:clamp(3.4rem,13vw,11rem);font-weight:700;letter-spacing:-.05em;line-height:.9;text-decoration:none;transition:color .3s}
.foot-big a:hover{color:var(--accent)}
.foot-star{width:.5em;height:.5em;fill:var(--accent);transition:transform .8s cubic-bezier(.3,1.6,.5,1)}
.foot-big a:hover .foot-star{transform:rotate(180deg)}
.foot-row{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:28px;font-size:.88rem}
.foot-row span{opacity:.6}

.wa-float{position:fixed;right:16px;bottom:16px;z-index:50;display:flex;align-items:center;gap:8px;padding:12px 18px 12px 14px;border-radius:99px;background:#1a1a1a;color:#fff;text-decoration:none;font-weight:600;font-size:.9rem;box-shadow:0 10px 30px -10px rgba(0,0,0,.5);transition:transform .3s,background .3s}
.wa-float svg{width:24px;height:24px;fill:#25D366}
.wa-float:hover{transform:translateY(-3px) rotate(-2deg);background:var(--magenta)}
.wa-float:hover svg{fill:#fff}

/* cursor de estrellitas */
.trail{position:fixed;inset:0;pointer-events:none;z-index:90}
.trail i{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;background:var(--c,#D1439D);clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);animation:twinkle .9s ease-out forwards}
@keyframes twinkle{0%{transform:scale(0) rotate(0)}30%{transform:scale(1) rotate(45deg)}100%{transform:translate(var(--dx),var(--dy)) scale(0) rotate(160deg);opacity:0}}

/* ================= CATEGORÍAS ================= */
.cat-hero{padding:clamp(40px,8vh,90px) var(--gut) clamp(40px,6vh,70px)}
.cat-title{font-size:clamp(3.6rem,13vw,12rem);line-height:.88;letter-spacing:-.05em;font-weight:700;margin-bottom:.2em;font-variation-settings:"wdth" 88;overflow-wrap:anywhere}
.cat-lead{font-family:var(--f-serif);font-size:clamp(1.5rem,3vw,2.6rem);color:var(--accent);line-height:1.1;max-width:22ch}
.cat-intro{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 60px;margin-top:40px;align-items:start}
.cat-intro p{max-width:52ch;font-size:1.08rem}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;max-width:420px;justify-content:flex-end}
.chips li{padding:6px 14px;border-radius:99px;background:var(--soft);font-size:.85rem;font-weight:500}
@media (max-width:760px){.cat-intro{grid-template-columns:1fr}.chips{justify-content:flex-start}}
.cat-work{padding:20px var(--gut) 80px}
.cat-work h3{font-size:1.25rem;letter-spacing:-.02em}
.cat-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;margin:0 var(--gut) 60px;padding:clamp(36px,6vw,64px);border-radius:28px;background:var(--accent);color:#fff}
.cat-cta h2{font-size:clamp(1.8rem,4vw,3.2rem);max-width:16ch}
.cat-cta .btn-solid{background:#fff;color:var(--ink);border-color:#fff}
.others{padding:0 var(--gut) 60px}
.others div{display:flex;flex-wrap:wrap;gap:10px}
.others a{padding:10px 18px;border-radius:99px;background:var(--csoft);color:#161214;text-decoration:none;font-weight:600;transition:transform .3s,background .3s}
.others a:hover{background:var(--cacc);color:#fff;transform:rotate(-3deg)}

/* editorial · dirección creativa: tamaños y posiciones distintas */
.lay-editorial{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(24px,4vw,56px) clamp(16px,2vw,28px)}
.ed-item{grid-column:span 6}
.ed-1{grid-column:1/span 5}.ed-2{grid-column:7/span 6;margin-top:18vh}
.ed-3{grid-column:2/span 4}.ed-4{grid-column:8/span 4;margin-top:-6vh}
.ed-5{grid-column:1/span 8}.ed-6{grid-column:10/span 3;align-self:end}
.ed-cap{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin-top:12px}
.ed-cap .num{grid-row:span 3;padding-top:3px}
@media (max-width:760px){.lay-editorial>*{grid-column:1/-1 !important;margin-top:0 !important}}

/* fotografía: muro tipo galería, blanco con rosa y amarillo */
.cat-photo .cat-hero{background:linear-gradient(180deg,var(--soft2) 0,var(--bg) 100%)}
.lay-photo{columns:3 260px;column-gap:18px}
.ph-item{break-inside:avoid;margin:0 0 18px}
.ph-item .ph{--r-ph:4px}
.ph-item figcaption{font-size:.82rem;padding:8px 2px}
.ph-item figcaption span{text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;font-weight:600;color:var(--accent);margin-right:6px}
.brides{margin:0 var(--gut) 70px;padding:clamp(36px,6vw,80px);border-radius:32px;background:var(--soft)}
.brides h2{max-width:20ch;margin-bottom:18px}
.brides-intro{max-width:56ch;margin-bottom:36px}
.brides-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,60px);margin-bottom:36px}
.brides-ideas{list-style:none;margin:0;padding:0;display:grid;gap:0;align-content:start}
.brides-ideas li{display:flex;gap:14px;padding:16px 0;border-bottom:1.5px solid color-mix(in srgb,var(--ink) 14%,transparent);font-family:var(--f-serif);font-size:1.2rem;line-height:1.25}
.brides-mood{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
.brides-mood .ph:nth-child(2){margin-top:30px}.brides-mood .ph:nth-child(5){margin-top:-30px}
@media (max-width:760px){.brides-grid{grid-template-columns:1fr}}

/* audiovisual: fotogramas */
.lay-film{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 24px}
.film-item:nth-child(3n+1){grid-column:1/-1}
.film-frame{position:relative;padding:10px;background:#111;border-radius:14px}
.film-frame .ph{--r-ph:6px}
.film-frame .rec,.film-frame .tc{position:absolute;top:20px;font-size:.72rem;font-weight:600;color:#fff;letter-spacing:.06em;mix-blend-mode:difference}
.rec{left:22px;animation:blink 1.2s steps(2) infinite}.tc{right:22px;font-variant-numeric:tabular-nums}
@keyframes blink{50%{opacity:.2}}
.film-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-top:12px}
.film-cap .meta{width:100%;margin:0}
@media (max-width:700px){.lay-film{grid-template-columns:1fr}}

/* artes visuales: galería de arte, marcos y cartelas */
.lay-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(30px,5vw,80px);align-items:end}
.gal-frame{padding:clamp(14px,2vw,26px);background:#fff;box-shadow:0 0 0 8px #2b1a10,0 26px 40px -24px rgba(0,0,0,.5);margin:8px}
.gal-item:nth-child(even) .gal-frame{box-shadow:0 0 0 3px #c9a46a,0 26px 40px -24px rgba(0,0,0,.45)}
.gal-frame .ph{--r-ph:0}
.gal-item figcaption{margin-top:22px;font-size:.82rem;line-height:1.4;padding-left:10px;border-left:2px solid var(--accent)}
.gal-item figcaption span{opacity:.6}
.gal-item:nth-child(2){transform:translateY(-40px)}.gal-item:nth-child(5){transform:translateY(-40px)}
@media (max-width:760px){.lay-gallery{grid-template-columns:1fr 1fr}.gal-item{transform:none !important}}

/* diseño: catálogo con preview al hover */
.lay-catalog{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.cat-row{position:relative;display:grid;grid-template-columns:60px minmax(0,1fr) 180px 60px;align-items:center;gap:16px;padding:22px 6px;border-bottom:1.5px solid color-mix(in srgb,var(--ink) 25%,transparent);transition:background .3s,padding .3s;cursor:default}
.cat-t{font-size:clamp(1.4rem,3.4vw,2.8rem);font-weight:600;letter-spacing:-.03em}
.cat-y{text-align:right;font-size:.85rem;opacity:.6}
.cat-prev{position:absolute;right:20%;top:50%;width:260px;pointer-events:none;opacity:0;transform:translateY(-50%) rotate(6deg) scale(.8);transition:opacity .3s,transform .4s cubic-bezier(.3,1.5,.5,1);z-index:5}
.cat-prev .ph{box-shadow:0 20px 40px -16px rgba(0,0,0,.4)}
.cat-row:hover,.cat-row:focus-visible{background:var(--soft);padding-left:20px}
.cat-row:hover .cat-prev,.cat-row:focus-visible .cat-prev{opacity:1;transform:translateY(-50%) rotate(-3deg) scale(1)}
@media (max-width:700px){.cat-row{grid-template-columns:40px 1fr}.cat-row .tag,.cat-y{display:none}.cat-prev{display:none}}

/* copywriting: tipográfico */
.lay-text{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.tx-item{margin:0;padding:clamp(28px,4vw,56px);border-radius:24px;background:#fff;display:flex;flex-direction:column;justify-content:space-between;gap:40px;min-height:300px}
.tx-item p{font-family:var(--f-serif);font-size:clamp(1.6rem,3vw,2.6rem);line-height:1.08;letter-spacing:-.02em}
.tx-1{grid-column:1/-1;background:var(--ink);color:var(--bg)}
.tx-1 p{font-size:clamp(2.2rem,5vw,4.4rem)}
.tx-2{background:var(--soft)}.tx-3{transform:rotate(-1deg)}.tx-4{background:#FFD3E8}
.tx-item footer .meta{display:inline;margin-left:6px}
@media (max-width:700px){.lay-text{grid-template-columns:1fr}}

/* educación: cartas */
.lay-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.ec-item{position:relative;padding:14px 14px 20px;border-radius:22px;background:#fff;box-shadow:0 12px 30px -18px rgba(0,0,0,.35);transition:transform .45s cubic-bezier(.3,1.5,.5,1)}
.ec-item:nth-child(odd){transform:rotate(-1.5deg)}.ec-item:nth-child(even){transform:rotate(1.5deg)}
.ec-item:hover{transform:rotate(0) translateY(-8px)}
.ec-item h3{margin:14px 4px 4px}.ec-item .tag{margin:0 4px}
.ec-n{position:absolute;top:22px;left:24px;z-index:2;font-weight:700;color:var(--accent)}
@media (max-width:800px){.lay-cards{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.lay-cards,.lay-gallery{grid-template-columns:1fr}}

/* ================= SOBRE MÍ ================= */
.about-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,6vw,90px);padding:clamp(40px,8vh,90px) var(--gut);align-items:start}
.about-photo{position:sticky;top:90px}
.about-photo .ph{transform:rotate(-2deg);border:12px solid #fff;box-shadow:0 24px 50px -24px rgba(0,0,0,.4)}
.tape{position:absolute;top:-12px;left:50%;width:110px;height:28px;margin-left:-55px;background:rgba(209,67,157,.4);transform:rotate(3deg)}
.about-text h1{font-size:clamp(2.4rem,5.4vw,4.8rem);margin-bottom:30px;max-width:16ch}
.about-text p{margin-bottom:18px;max-width:58ch;font-size:1.08rem}
.about-text h1+p::first-letter{font-family:var(--f-serif);font-size:3.4em;float:left;line-height:.85;margin:.06em .1em 0 0;color:var(--accent)}
.years{display:flex;flex-wrap:wrap;gap:16px;margin-top:30px}
.years div{flex:1 1 200px;padding:18px;border-radius:18px;background:#fff}
.years strong{display:block;font-size:2.2rem;letter-spacing:-.03em;color:var(--accent)}
.years span{font-size:.9rem}
@media (max-width:760px){.about-hero{grid-template-columns:1fr}.about-photo{position:relative;top:0;max-width:340px}}
.mirror-quote{display:flex;align-items:center;gap:clamp(20px,4vw,50px);padding:clamp(50px,10vh,110px) var(--gut);background:var(--ink);color:var(--bg)}
.mirror.big{width:clamp(70px,10vw,130px);height:clamp(92px,13vw,170px);border-width:5px}
.mirror-quote p{font-family:var(--f-serif);font-size:clamp(1.8rem,4.6vw,4rem);line-height:1.05;max-width:20ch}
.diff{padding:clamp(60px,10vh,120px) var(--gut)}
.diff ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.diff li{padding:28px;border-radius:22px;background:#fff}
.diff li:nth-child(2){background:var(--soft)}.diff li:nth-child(3){background:#DCD4FF}.diff li:nth-child(4){background:#C9EFD7}
.diff h3{font-size:1.6rem;margin-bottom:10px}
@media (max-width:700px){.diff ul{grid-template-columns:1fr}}
.about .cta{background:#fff}

/* ================= CONTACTO ================= */
.contact-hero{padding:clamp(40px,8vh,90px) var(--gut) 40px}
.contact-hero h1{font-size:clamp(3.2rem,11vw,10rem);line-height:.9;letter-spacing:-.05em;font-weight:700;max-width:10ch;margin-bottom:28px}
.contact-intro{max-width:56ch;font-size:1.1rem;margin-bottom:30px}
.services{padding:40px var(--gut) 60px}
.services ul{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.services a{display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:16px;padding:22px 8px;border-bottom:1.5px solid color-mix(in srgb,var(--ink) 20%,transparent);text-decoration:none;transition:background .3s,padding .3s,color .3s}
.sv-n{font-size:clamp(1.4rem,3.2vw,2.6rem);font-weight:600;letter-spacing:-.03em}
.sv-b{font-size:.85rem;font-weight:600;opacity:.6}
.services a:hover{background:var(--csoft);padding-left:22px}
.services a:hover .sv-n{color:var(--cacc)}
.services a:hover .sv-b{opacity:1}
@media (max-width:560px){.sv-b{display:none}}
.prints{position:relative;margin:0 var(--gut) 60px;padding:clamp(36px,6vw,70px);border-radius:28px;background:#FFF3A6;overflow:hidden}
.prints h2{font-size:clamp(2.4rem,6vw,5rem);font-family:var(--f-serif);font-weight:400;margin-bottom:12px}
.prints p{max-width:40ch}
.prints-star{position:absolute;right:-30px;top:-30px;width:200px;height:200px;fill:var(--magenta);opacity:.85;animation:spin 30s linear infinite}

/* aparición al hacer scroll */
.rv{opacity:0;transform:translateY(16px);transition:opacity .5s ease-out,transform .55s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
  .rv{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ================= con material real ================= */
img{height:auto}
.tag{margin:0}
.pd{max-width:52ch;margin-top:6px}
.pcap{margin-top:14px;display:grid;gap:4px}
.pcap h3{font-size:clamp(1.3rem,2vw,1.7rem);letter-spacing:-.02em}
.pcap .num{margin-bottom:2px}
img[data-lb]{cursor:zoom-in}

/* hero con fotos */
.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:20px;align-items:center}
.hero-pics{position:relative;height:min(70vh,620px)}
.hp{position:absolute;margin:0;padding:8px 8px 26px;background:#fff;box-shadow:0 18px 40px -18px rgba(0,0,0,.4);transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.hp img{width:100%;height:100%;object-fit:cover}
.hp-1{width:46%;aspect-ratio:3/4;left:2%;top:4%;transform:rotate(-7deg)}
.hp-2{width:44%;aspect-ratio:4/5;right:2%;top:16%;transform:rotate(5deg);z-index:2}
.hp-3{width:40%;aspect-ratio:9/16;left:26%;bottom:0;transform:rotate(-2deg);z-index:3}
.hp:hover{transform:rotate(0) scale(1.04);z-index:5}
.hero-pics .stk{z-index:6}
.stk-1{top:0;right:6%}.stk-2{top:52%;left:-2%;right:auto}.stk-3{bottom:6%;right:4%}
@media (max-width:900px){.hero{grid-template-columns:1fr;min-height:0}.hero-pics{height:auto;aspect-ratio:1/1;max-width:520px;width:100%}}

/* cartas con foto */
.card-img{position:absolute;left:14px;right:14px;bottom:14px;height:48%;border-radius:12px;background-size:cover;background-position:center}
.card::before{display:none}
.card-peek i{background-size:cover !important;background-position:center !important}

/* videos */
.vid{position:relative;border-radius:inherit;overflow:hidden;background:#000}
.vid video{display:block;width:100%;height:auto;max-height:80vh;object-fit:contain;background:#000;cursor:pointer}
.vid-sound{position:absolute;right:12px;bottom:12px;font:inherit;font-size:.8rem;font-weight:600;padding:8px 14px;border-radius:99px;border:0;background:rgba(255,255,255,.88);color:#111;cursor:pointer;transition:background .2s}
.vid-sound[aria-pressed="true"]{background:var(--accent);color:#fff}
.yt{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.yt img{width:100%;height:100%;object-fit:cover;opacity:.85}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-play{position:absolute;inset:0;margin:auto;width:78px;height:78px;border-radius:50%;border:0;background:var(--accent);color:#fff;font-size:1.6rem;cursor:pointer;transition:transform .3s}
.yt-play:hover{transform:scale(1.1) rotate(-8deg)}

/* editorial */
.ed-media{border-radius:16px;overflow:hidden}
.ed-media .vid video{max-height:78vh}
.ed-stack{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ed-stack img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.ed-stack .ed-s0{grid-row:span 2}
.ed-1{grid-column:1/span 7}.ed-2{grid-column:9/span 4;margin-top:22vh}
.ed-3{grid-column:2/span 4}.ed-4{grid-column:7/span 4;margin-top:8vh}

/* fotografía */
.series-nav{position:sticky;top:64px;z-index:10;display:flex;gap:8px;overflow-x:auto;padding:10px 0 14px;margin-bottom:20px;background:linear-gradient(var(--bg) 75%,transparent);scrollbar-width:none}
.series-nav a{flex:none;padding:8px 16px;border-radius:99px;border:1.5px solid var(--ink);text-decoration:none;font-weight:600;font-size:.88rem;transition:background .2s,color .2s}
.series-nav a:hover{background:var(--ink);color:var(--bg)}
.cat-photo .series-nav a:last-child{background:var(--accent);border-color:var(--accent);color:#fff}
.series{padding:30px 0 50px;scroll-margin-top:110px}
.series:nth-of-type(even){background:var(--soft2);margin:0 calc(var(--gut)*-1);padding:40px var(--gut) 50px}
.series-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-bottom:22px}
.series-h h2{font-size:clamp(2rem,5vw,4rem);letter-spacing:-.04em}
.series-h .pd{width:100%;margin:0;font-family:var(--f-serif);font-size:1.15rem}
.lay-photo{columns:3 240px;column-gap:14px}
.ph-item{break-inside:avoid;margin:0 0 14px}
.ph-item img{width:100%;border-radius:4px;transition:transform .4s,filter .4s}
.ph-item img:hover{transform:scale(1.015);filter:saturate(1.1)}
.brides{scroll-margin-top:70px}
.brides-grid{align-items:center}
.brides-cover img{width:100%;border-radius:18px;transform:rotate(2deg);border:10px solid #fff;box-shadow:0 24px 50px -24px rgba(0,0,0,.45)}
.brides .btn{margin-top:26px}
.bride-set{margin-top:60px}
.bride-set header{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-bottom:18px}
.bride-set h3{font-family:var(--f-serif);font-weight:400;font-size:clamp(2rem,4.4vw,3.6rem)}
@media (max-width:760px){.brides-cover{order:-1}}

/* audiovisual */
.lay-film{align-items:start}
.film-frame .vid,.film-frame .yt{border-radius:8px}
.film-frame .rec{z-index:2;pointer-events:none}
.film-item:nth-child(3n+1) .vid video{max-height:70vh}

/* artes visuales */
.gal-frame img{width:100%}
.gal-item figcaption small{opacity:.7;display:block;margin-top:4px;line-height:1.35}

/* diseño: lista desplegable */
.cat-row{display:block;padding:0}
.cat-row details{border:0}
.cat-row summary{list-style:none;display:grid;grid-template-columns:60px minmax(0,1fr) 220px 40px;align-items:center;gap:16px;padding:22px 6px;cursor:pointer;position:relative;transition:background .3s,padding .3s}
.cat-row summary::-webkit-details-marker{display:none}
.cat-plus{font-size:1.8rem;text-align:right;transition:transform .3s}
.cat-row details[open] .cat-plus{transform:rotate(45deg)}
.cat-row summary:hover{background:var(--soft);padding-left:20px}
.cat-row summary:hover .cat-prev{opacity:1;transform:translateY(-50%) rotate(-3deg) scale(1)}
.cat-row details[open] .cat-prev{display:none}
.cat-prev img{width:100%;border-radius:10px;box-shadow:0 20px 40px -16px rgba(0,0,0,.4)}
.cat-row:hover{background:none;padding-left:0}
.cat-body{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:30px;padding:10px 6px 40px}
.cat-desc p:first-child{font-size:1.05rem;max-width:44ch}
.cat-gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.cat-gal img{width:100%;border-radius:10px}
.cat-gal .vid{border-radius:10px}
@media (max-width:700px){.cat-row summary{grid-template-columns:36px 1fr 30px}.cat-row summary .tag{display:none}.cat-body{grid-template-columns:1fr}}

/* copywriting */
.tx-item cite{font-family:var(--f-serif)}
.tx-1 p{font-size:clamp(1.8rem,4vw,3.4rem)}
.carr{margin-top:70px}
.carr-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
.carr-row img{flex:none;width:clamp(220px,24vw,320px);scroll-snap-align:start;border-radius:10px}

/* educación */
.ec-item img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:14px}
.ec-item .tag{margin:14px 4px 0}.ec-item h3{margin:4px 4px}.ec-item .pd{margin:6px 4px 0;font-size:.95rem}

/* sobre mí */
.about-photo img,.at-img img{width:100%;transform:rotate(-2deg);border:12px solid #fff;box-shadow:0 24px 50px -24px rgba(0,0,0,.4)}
.at-img{position:relative}

/* lightbox */
.lb{position:fixed;inset:0;z-index:95;background:rgba(15,10,14,.94);display:grid;place-items:center}
.lb[hidden]{display:none}
.lb-img{max-width:min(92vw,1500px);max-height:86vh;width:auto;height:auto;object-fit:contain;border-radius:4px}
.lb button{position:absolute;border:0;background:rgba(255,255,255,.12);color:#fff;width:52px;height:52px;border-radius:50%;font-size:1.4rem;cursor:pointer;transition:background .2s}
.lb button:hover{background:var(--magenta)}
.lb-x{top:16px;right:16px}.lb-prev{left:16px;top:50%;margin-top:-26px}.lb-next{right:16px;top:50%;margin-top:-26px}
.lb-count{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#fff;font-size:.85rem;opacity:.7}
.ed-stack{grid-template-columns:repeat(3,minmax(0,1fr))}
.ed-stack .ed-s0{grid-column:1/-1;grid-row:auto;aspect-ratio:4/5}
.ed-stack img:not(.ed-s0){aspect-ratio:3/4}
html,body{overflow-x:clip}
.cat-gal .vid video{max-height:520px}
@media (max-width:820px){.card-tags{display:none}.card-img{height:56%}}
@media (max-width:760px){.about-photo{margin:0 auto 28px 6px}}

/* mesa: dos filas que siempre entran en el tablero */
@media (min-width:821px){
  .desk-board{--cw:clamp(160px,16.5vw,240px);--ch:calc(var(--cw)*4/3);--row1:34px;--row2:calc(var(--ch) + 84px);
    height:calc(var(--ch)*2 + 130px);min-height:0}
  .card{width:var(--cw);top:var(--y)}
  .note{max-width:min(230px,19%)}
  .note-play{left:auto;right:3%;top:calc(var(--row2) + 10px)}
  .note-mirror{left:auto;right:2.5%;top:calc(var(--row2) + var(--ch)*.52);max-width:min(270px,21%)}
  .note-mirror .mirror{width:36px;height:48px}
  .ds-1{left:auto;right:4%;top:calc(var(--row2) - 40px)}
  .ds-2{right:auto;left:45%;top:calc(var(--row2) - 44px)}
}

/* artes visuales por series */
.art-me{display:flex;align-items:center;gap:28px;margin:10px 0 30px}
.art-me-img{width:min(300px,45%);flex:none}
.art-me img{width:100%;border:10px solid #fff;transform:rotate(-3deg);box-shadow:0 20px 40px -20px rgba(0,0,0,.4)}
.art-me figcaption{font-family:var(--f-hand);font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.1;color:var(--accent);max-width:12ch;transform:rotate(-4deg)}
.art-series .lay-gallery{align-items:start}
.art-series .gal-item{transform:none}
.art-series .gal-item:nth-child(3n+2){margin-top:40px}
.lay-gallery.proc{grid-template-columns:repeat(3,minmax(0,1fr))}
.lay-gallery.proc .gal-item:first-child{grid-column:1/-1;max-width:820px;justify-self:center;margin-top:0}
.lay-gallery.proc .gal-item{margin-top:0 !important}
@media (max-width:760px){.art-series .gal-item:nth-child(3n+2){margin-top:0}.lay-gallery.proc{grid-template-columns:1fr 1fr 1fr}.art-me{gap:16px}}

/* ===== tipografías: Archivo + Gloock + Gochi Hand ===== */
h1,h2,h3{font-weight:800;font-variation-settings:"wdth" 88;letter-spacing:-.025em}
.hero-name,.cat-title,.contact-hero h1,.foot-big a{font-weight:900;font-variation-settings:"wdth" 74;letter-spacing:-.035em}
.hero-name .it{font-variation-settings:normal;letter-spacing:-.02em;font-size:.92em}
.soy-word,.logo em,.marquee-in span:nth-child(4n+1),.bride-set h3,.prints h2{font-weight:400;font-variation-settings:normal}
.logo{font-weight:800;font-variation-settings:"wdth" 80}
.lbl,.hero-hi,.note,.series-h .pd,.hero-hint,.desk-hint,.cta-world{font-family:var(--f-hand);letter-spacing:0}
.lbl{font-size:1.65rem;line-height:1;margin-bottom:10px}
.hero-hi{font-size:clamp(2rem,3.4vw,3rem);line-height:1}
.hero-hint,.desk-hint{font-size:1.35rem;opacity:.7}
.cta-world{font-size:1.5rem}
.note{font-size:1.65rem;line-height:1.05}
.series-h .pd{font-size:1.7rem;line-height:1.05}
.cat-lead{line-height:1.15}
.tx-item p{letter-spacing:-.01em;line-height:1.12}
.mirror-quote p{line-height:1.1}
.tag{font-variation-settings:"wdth" 90;font-weight:600;letter-spacing:.06em}
.card-name{font-weight:800;font-variation-settings:"wdth" 85}
.q-opt,.btn{font-variation-settings:"wdth" 95}
.lbl{font-size:1.35rem}
.hero-hi{font-size:clamp(1.7rem,2.8vw,2.5rem)}
.hero-hint,.desk-hint{font-size:1.1rem}
.cta-world{font-size:1.25rem}
.note{font-size:1.35rem;line-height:1.1}
.series-h .pd{font-size:1.4rem;line-height:1.1}
.art-me figcaption{font-size:clamp(1.4rem,2.6vw,2rem)}

/* ===== fondo blanco (el color de cada categoría queda en detalles) ===== */
body{background:#fff}
.top{background:rgba(255,255,255,.86)}
.desk-board{background:radial-gradient(circle,color-mix(in srgb,var(--ink) 13%,transparent) 1px,transparent 1.5px) 0 0/22px 22px,var(--tint,#FAF8F4);box-shadow:none}
.note-mirror{background:#fff}
.tx-item{background:var(--tint,#FAF8F4)}
.ec-item{background:#fff;box-shadow:0 0 0 1.5px color-mix(in srgb,var(--accent) 22%,transparent),0 14px 30px -20px rgba(0,0,0,.35)}
.years div,.diff li:first-child{background:var(--tint,#FAF8F4)}
.about .cta{background:var(--soft)}
.cat-hero{position:relative}
.cat-hero::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:var(--accent)}
.cat-photo .cat-hero{background:linear-gradient(180deg,var(--soft2) 0,#fff 100%)}
.cat-photo .cat-hero::before{display:none}
.cat-row summary:hover{background:var(--tint)}
.series:nth-of-type(even){background:transparent}
.cat-photo .series:nth-of-type(even){background:var(--soft2)}
.mirror-quote{background:var(--ink)}
.series-nav{background:linear-gradient(#fff 75%,transparent)}
.tx-item.tx-1{background:var(--ink);color:#fff}
.tx-item.tx-2{background:var(--soft)}.tx-item.tx-4{background:#FFD3E8}

/* series en celular: menú visible completo, sin duplicar chips, fotos de a dos */
.cat-photo .cat-intro .chips,.cat-gallery .cat-intro .chips{display:none}
.cat-photo .cat-intro,.cat-gallery .cat-intro{grid-template-columns:1fr}
@media (max-width:760px){
  .series-nav{position:static;flex-wrap:wrap;overflow:visible;gap:8px;padding:4px 0 8px;margin-bottom:6px;background:none}
  .series-nav a{padding:8px 14px;font-size:.85rem}
  .series{padding:22px 0 30px;scroll-margin-top:70px}
  .series:nth-of-type(even){padding:28px var(--gut) 30px}
  .series-h{margin-bottom:14px}
  .lay-photo{columns:2;column-gap:8px}
  .ph-item{margin-bottom:8px}
  .bride-set{margin-top:40px}
}
@media (max-width:760px){.brides{margin:0 10px 50px;padding:28px 14px;border-radius:24px}.brides h2,.brides-intro,.brides-ideas,.brides .btn{margin-left:6px;margin-right:6px}}

/* ===== marca de Vicky (Canva): Jost como Moonshine, celeste #91C4FF, amarillito #FFFAE4, magenta #D1439D ===== */
:root{--f-sans:"Jost",system-ui,sans-serif;--f-serif:"Jost",system-ui,sans-serif;--f-hand:"Jost",system-ui,sans-serif;
  --magenta:#D1439D;--celeste:#91C4FF;--crema:#FFFAE4}
body{font-weight:400;letter-spacing:.005em}
h1,h2,h3,.hero-name,.cat-title,.contact-hero h1,.foot-big a,.card-name,.logo,.soy-word,.cat-lead,.tx-item p,.mirror-quote p,.bride-set h3,.prints h2,.marquee-in,.series-h h2,.cat-t,.sv-n{
  font-variation-settings:normal;font-style:normal}
h1,h2{font-weight:500;text-transform:uppercase;letter-spacing:.04em;line-height:1.02}
h3{font-weight:500;letter-spacing:.01em}
.cat-title{font-size:clamp(2.6rem,9.5vw,8.5rem);font-weight:500;letter-spacing:.03em;line-height:.95}
.contact-hero h1{font-size:clamp(2.6rem,9vw,8rem);font-weight:500;letter-spacing:.03em}
.cat-lead{font-weight:400;font-size:clamp(1.3rem,2.4vw,2rem);letter-spacing:0}
.lbl,.series-h .pd,.hero-hint,.desk-hint,.cta-world,.note,.art-me figcaption{font-family:var(--f-sans)}
.lbl{font-size:.82rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em;color:var(--accent)}
.series-h .pd{font-size:1.1rem;line-height:1.35;font-weight:400}
.hero-hint,.desk-hint{font-size:.85rem;letter-spacing:.02em}
.cta-world{font-size:.95rem}
.note{font-size:1.05rem;line-height:1.25;font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.art-me figcaption{font-size:clamp(1.05rem,2vw,1.5rem);text-transform:uppercase;letter-spacing:.06em;font-weight:500}
.tag{letter-spacing:.14em;font-weight:500}
.card-name{font-weight:500;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(1.05rem,1.6vw,1.45rem)}
.series-h h2{letter-spacing:.04em}
.tx-item p{font-weight:400;text-transform:none;letter-spacing:0;line-height:1.2;font-size:clamp(1.3rem,2.4vw,2.1rem)}
.tx-1 p{font-size:clamp(1.5rem,3vw,2.6rem)}
.mirror-quote p{font-weight:400;text-transform:uppercase;letter-spacing:.04em;font-size:clamp(1.4rem,3.4vw,3rem);line-height:1.15}
.brides-ideas li{font-family:var(--f-sans);font-size:1.05rem}
.bride-set h3{font-weight:500;text-transform:uppercase;letter-spacing:.06em;font-size:clamp(1.6rem,3.4vw,2.8rem)}
.prints h2{font-weight:500;text-transform:uppercase;letter-spacing:.08em}
.about-text h1+p::first-letter{font-weight:500}
.soy-word{font-weight:500;text-transform:uppercase;letter-spacing:.05em;font-size:.82em}
.marquee-in{font-weight:500;text-transform:uppercase;letter-spacing:.08em;font-size:clamp(1.3rem,3.2vw,2.4rem)}
.cat-t,.sv-n{font-weight:500;letter-spacing:.02em;text-transform:uppercase}
.btn{text-transform:uppercase;letter-spacing:.08em;font-weight:500;font-size:.85rem}
.nav{text-transform:uppercase;letter-spacing:.1em;font-size:.8rem;font-weight:500}
/* colores de su marca en bloques */
.marquee{background:var(--celeste);color:var(--ink)}
.marquee-in .star{fill:var(--magenta)}
.cta{background:var(--celeste)}
.about .cta{background:var(--celeste)}
.foot{background:var(--celeste);border-top:0}
.foot-big a:hover{color:var(--magenta)}
.desk-board{background:radial-gradient(circle,rgba(23,18,26,.12) 1px,transparent 1.5px) 0 0/22px 22px,var(--crema)}
.years div,.diff li:first-child{background:var(--crema)}
.diff li:nth-child(2){background:#FFD6EE}.diff li:nth-child(3){background:var(--celeste)}
.mirror-quote{background:var(--celeste);color:var(--ink)}
.mirror{border-color:var(--magenta)}
.prints{background:var(--crema)}
.prints-star{fill:var(--magenta)}
/* logo Vicky (de su Canva) */
.logo{gap:8px;align-items:center}
.logo .logo-img{height:44px;width:auto;margin:-6px 0 -8px}
.logo span{font-size:.78rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--ink);margin-top:10px}
.hero-logo{margin:.1em 0 .3em;display:flex;flex-direction:column;align-items:flex-start;line-height:1;text-transform:none}
.hl-img{width:min(620px,88%);height:auto;transform-origin:30% 60%;animation:logo-sway 6s ease-in-out infinite}
.hl-last{font-size:clamp(1.1rem,2.2vw,1.8rem);font-weight:500;letter-spacing:.5em;text-transform:uppercase;margin:-.4em 0 0 .3em;color:var(--ink)}
@keyframes logo-sway{50%{transform:rotate(-1.5deg) translateY(-4px)}}
.foot-big{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 40px}
.foot-logo{width:min(360px,60vw);height:auto}
.foot-big a{font-size:clamp(2.4rem,8vw,6.5rem);font-weight:500;text-transform:uppercase;letter-spacing:.04em}
@media (max-width:760px){.hl-img{width:100%}.logo .logo-img{height:38px}}
@media (prefers-reduced-motion:reduce){.hl-img{animation:none}}
.cta,.about .cta{background:var(--crema)}
.nav a{white-space:nowrap}
@media (max-width:560px){.logo span{display:none}.nav{gap:14px;letter-spacing:.06em;font-size:.74rem}.nav .lang{padding:3px 9px;font-size:.7rem}}
.hl-last{margin-top:-1.4em}
.logo .logo-img{height:50px;margin:-4px 0 -12px}
/* logo de pincel (pie de su Canva) */
.hl-img{width:min(340px,52%);animation:none;transform:rotate(-3deg)}
.hl-last{margin:.5em 0 0 .2em}
.logo .logo-img{height:40px;margin:0}
.logo span{margin-top:6px}
.foot-logo{width:min(240px,45vw)}
@media (max-width:760px){.hl-img{width:min(240px,62%)}.logo .logo-img{height:34px}}

/* logo de pincel en letras sueltas + VELTRI como firma */
.hero-logo{display:block;margin:.15em 0 .5em}
.hl-word{position:relative;display:block;width:min(340px,52%);aspect-ratio:944/828}
.hl-word .fl{position:absolute;display:block;animation:bob 5s ease-in-out infinite}
.hl-word .fl:nth-child(2){animation-delay:-1.2s}.hl-word .fl:nth-child(3){animation-delay:-2.4s;animation-duration:6s}
.hl-word .fl:nth-child(4){animation-delay:-.6s}.hl-word .fl:nth-child(5){animation-delay:-3.1s;animation-duration:5.6s}
.hl-word .fl img{display:block;width:100%;height:100%}
.hl-word .hl-last{position:absolute;left:104%;top:50%;margin:0;white-space:nowrap;font-size:clamp(1rem,1.8vw,1.45rem);font-weight:500;letter-spacing:.42em;text-transform:uppercase;color:var(--ink)}
@media (max-width:760px){.hl-word{width:min(230px,58%)}.hl-word .hl-last{letter-spacing:.28em;font-size:1rem}}

/* fondo amarillito de nuevo (los bloques que eran amarillitos pasan a blanco) */
body{background:var(--bg,#FFFAE4)}
.top{background:rgba(255,250,228,.9)}
.series-nav{background:none}
.desk-board{background:radial-gradient(circle,rgba(23,18,26,.12) 1px,transparent 1.5px) 0 0/22px 22px,#fff}
.cta,.about .cta{background:#fff}
.years div,.diff li:first-child,.prints{background:#fff}
.tx-item{background:#fff}
.cat-photo .cat-hero{background:linear-gradient(180deg,#FBE3EC 0,var(--bg) 100%)}
.cat-photo .series:nth-of-type(even){background:#FBE3EC}
.cat-row summary:hover{background:#fff}

/* portada: su pintura (como en su Canva) + ella como protagonista */
.hero-pics{position:relative;height:min(76vh,640px)}
.hp-sky{position:absolute;left:12%;top:4%;width:70%;height:78%;background:var(--celeste);border-radius:4px}
.hp{padding:8px 8px 34px}
.hp-1{width:52%;aspect-ratio:auto;left:21%;top:9%;transform:rotate(-1.5deg);padding:0;background:none;box-shadow:0 26px 50px -24px rgba(23,18,26,.5);z-index:1}
.hp-1 img{height:auto;display:block}
.hp-2{width:38%;aspect-ratio:auto;left:auto;right:0;top:auto;bottom:2%;transform:rotate(5deg);z-index:3}
.hp-3{width:33%;aspect-ratio:auto;left:0;bottom:6%;top:auto;transform:rotate(-6deg);z-index:2}
.hp-2 img,.hp-3 img{aspect-ratio:4/5;height:auto}
.hp figcaption{position:absolute;left:0;right:0;bottom:8px;text-align:center;font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.hp-2 figcaption{color:var(--magenta)}
.hero-pics .stk-1{top:0;right:4%}.hero-pics .stk-2{top:46%;left:-2%}.hero-pics .stk-3{bottom:0;right:44%}
@media (max-width:900px){.hero-pics{height:auto;aspect-ratio:1/1.08;max-width:520px}}
.hp-2{width:44%;right:-2%;bottom:0}
.hp-3{width:38%;left:-2%;bottom:5%}
.hp{padding:8px 8px 38px}
.hp figcaption{bottom:12px;white-space:nowrap;letter-spacing:.1em;font-size:.68rem}
.hp-1{width:50%;left:22%;top:7%}
.hero-pics .stk-3{bottom:-2%;right:46%}

/* flores recortadas de su Canva alrededor de la portada */
.hero{overflow:hidden}
.hero-txt,.hero-pics{position:relative;z-index:2}
.hero-flowers{position:absolute;inset:0;pointer-events:none;z-index:1}
.hf{position:absolute;height:auto;filter:drop-shadow(0 14px 18px rgba(23,18,26,.18));animation:flor 7s ease-in-out infinite;transform-origin:50% 90%}
.hf-1{width:min(230px,17vw);right:-2%;top:-4%;transform:rotate(-24deg);--r:-24deg}
.hf-2{width:min(200px,15vw);left:-3%;bottom:-6%;transform:rotate(18deg);--r:18deg;animation-delay:-2s}
.hf-3{width:min(120px,9vw);left:44%;bottom:4%;transform:rotate(-10deg);--r:-10deg;animation-delay:-4s}
@keyframes flor{50%{transform:rotate(calc(var(--r) + 4deg)) translateY(-6px)}}
@media (max-width:900px){.hf-1{width:120px;right:-30px;top:-20px}.hf-2{width:110px;left:-28px;bottom:-30px}.hf-3{display:none}}
@media (prefers-reduced-motion:reduce){.hf{animation:none}}
@media (min-width:901px){
  .hf-1{top:3%;right:-3%}
  .hf-2{width:min(175px,13vw);left:-4%;bottom:-16%}
  .hf-3{left:40%;bottom:-2%}
}
/* portada: imágenes que cambian con "y soy…" */
.hp-1 img,.hp-3 img{transition:opacity .22s ease}
.hp.fading img{opacity:0}
.hp-1 img.hp-main{aspect-ratio:4/5;object-fit:cover;width:100%}
.hp-3 img.hp-side{object-fit:cover}

/* ===== portada con stickers: Vicky al centro y stickers según "y soy…" ===== */
.hero-stage{position:relative;z-index:2;height:min(78vh,660px);width:100%}
.hs-sky{position:absolute;left:50%;top:50%;width:min(78%,500px);aspect-ratio:1;transform:translate(-50%,-48%);border-radius:50%;background:var(--celeste)}
.vicky-stk{position:absolute;left:50%;bottom:4%;width:min(64%,420px);height:auto;transform:translateX(-50%) rotate(-3deg);
  filter:drop-shadow(0 18px 22px rgba(23,18,26,.28));z-index:2;animation:stk-breathe 6s ease-in-out infinite}
@keyframes stk-breathe{50%{transform:translateX(-50%) rotate(-1deg) translateY(-6px)}}
.me-tag{position:absolute;left:50%;bottom:2%;transform:translateX(-50%) rotate(3deg);z-index:3;background:var(--magenta);color:#fff;
  font-size:.8rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:9px 18px;border-radius:99px;border:4px solid #fff;
  box-shadow:0 10px 18px -8px rgba(23,18,26,.35);white-space:nowrap}
.stk-set{position:absolute;inset:0;z-index:4;pointer-events:none}
.stk-set .s{position:absolute;width:clamp(78px,11vw,150px);height:auto;filter:drop-shadow(0 10px 12px rgba(23,18,26,.22));
  opacity:0;transform:scale(.3) rotate(-40deg);transition:opacity .35s ease,transform .55s cubic-bezier(.3,1.6,.5,1)}
.stk-set .s1{left:2%;top:6%;--r:-12deg}
.stk-set .s2{right:0;top:34%;--r:10deg}
.stk-set .s3{left:6%;bottom:16%;--r:8deg}
.stk-set.on .s{opacity:1;transform:scale(1) rotate(var(--r))}
.stk-set.on .s2{transition-delay:.08s}.stk-set.on .s3{transition-delay:.16s}
@media (max-width:900px){.hero-stage{height:auto;aspect-ratio:1/1.05;max-width:520px;margin:0 auto}.stk-set .s{width:clamp(70px,22vw,110px)}}
@media (prefers-reduced-motion:reduce){.vicky-stk{animation:none}.stk-set .s{transition:none}}
.hs-sky{width:min(90%,560px)}
.vicky-stk{width:min(80%,520px);bottom:5%}
.stk-set .s1{left:0;top:2%}
.stk-set .s2{right:-2%;top:30%}
.stk-set .s3{left:0;bottom:22%}
@media (max-width:900px){.vicky-stk{width:76%}.hs-sky{width:86%}}

/* ===== collage: recortes rasgados de su arte, cintas y stickers por toda la página ===== */
.torn-1{clip-path:polygon(0.0% 0.7%,3.8% 0.3%,7.7% 1.4%,11.5% 0.2%,15.4% 1.2%,19.2% 0.8%,23.1% 0.1%,26.9% 1.1%,30.8% 0.1%,34.6% 1.0%,38.5% 0.2%,42.3% 0.2%,46.2% 0.9%,50.0% 1.8%,53.8% 0.3%,57.7% 0.5%,61.5% 1.4%,65.4% 2.1%,69.2% 1.3%,73.1% 0.9%,76.9% 2.1%,80.8% 0.1%,84.6% 1.9%,88.5% 0.6%,92.3% 0.3%,96.2% 0.3%,100.0% 0.7%,98.2% 3.8%,99.6% 7.7%,98.7% 11.5%,98.6% 15.4%,99.2% 19.2%,98.8% 23.1%,99.9% 26.9%,99.9% 30.8%,99.5% 34.6%,98.5% 38.5%,99.1% 42.3%,99.3% 46.2%,98.7% 50.0%,99.0% 53.8%,99.3% 57.7%,98.3% 61.5%,98.5% 65.4%,99.5% 69.2%,98.7% 73.1%,98.8% 76.9%,98.1% 80.8%,98.4% 84.6%,99.4% 88.5%,97.8% 92.3%,99.7% 96.2%,99.1% 100.0%,96.2% 98.3%,92.3% 99.7%,88.5% 98.9%,84.6% 99.9%,80.8% 98.5%,76.9% 98.3%,73.1% 98.7%,69.2% 98.1%,65.4% 99.3%,61.5% 98.5%,57.7% 98.7%,53.8% 98.7%,50.0% 99.0%,46.2% 98.2%,42.3% 97.9%,38.5% 99.0%,34.6% 98.5%,30.8% 99.9%,26.9% 98.5%,23.1% 98.6%,19.2% 97.8%,15.4% 98.2%,11.5% 99.4%,7.7% 99.2%,3.8% 98.5%,0.0% 100.0%,1.0% 96.2%,0.4% 92.3%,0.3% 88.5%,0.1% 84.6%,1.7% 80.8%,0.3% 76.9%,0.5% 73.1%,0.9% 69.2%,1.9% 65.4%,0.2% 61.5%,1.0% 57.7%,1.2% 53.8%,1.9% 50.0%,1.8% 46.2%,1.9% 42.3%,0.6% 38.5%,0.9% 34.6%,0.8% 30.8%,1.9% 26.9%,2.1% 23.1%,0.3% 19.2%,0.4% 15.4%,0.5% 11.5%,0.5% 7.7%,1.1% 3.8%)}
.torn-2{clip-path:polygon(0.0% 1.6%,3.8% 0.7%,7.7% 0.0%,11.5% 1.2%,15.4% 1.0%,19.2% 1.6%,23.1% 2.7%,26.9% 1.9%,30.8% 1.4%,34.6% 1.7%,38.5% 1.9%,42.3% 0.2%,46.2% 2.5%,50.0% 2.2%,53.8% 2.4%,57.7% 2.2%,61.5% 1.1%,65.4% 1.1%,69.2% 0.3%,73.1% 1.8%,76.9% 0.2%,80.8% 0.2%,84.6% 0.6%,88.5% 0.5%,92.3% 1.0%,96.2% 0.1%,100.0% 0.0%,99.6% 3.8%,99.7% 7.7%,99.0% 11.5%,99.9% 15.4%,97.6% 19.2%,98.3% 23.1%,99.6% 26.9%,99.3% 30.8%,99.0% 34.6%,99.0% 38.5%,99.7% 42.3%,97.6% 46.2%,97.2% 50.0%,98.7% 53.8%,98.6% 57.7%,99.8% 61.5%,99.7% 65.4%,99.0% 69.2%,99.3% 73.1%,97.7% 76.9%,99.5% 80.8%,99.9% 84.6%,97.3% 88.5%,98.5% 92.3%,99.6% 96.2%,98.5% 100.0%,96.2% 99.9%,92.3% 98.5%,88.5% 97.3%,84.6% 97.6%,80.8% 98.1%,76.9% 99.3%,73.1% 99.0%,69.2% 99.5%,65.4% 97.8%,61.5% 98.5%,57.7% 97.8%,53.8% 99.1%,50.0% 99.4%,46.2% 97.7%,42.3% 97.2%,38.5% 97.6%,34.6% 97.7%,30.8% 97.7%,26.9% 97.9%,23.1% 99.4%,19.2% 98.6%,15.4% 99.0%,11.5% 99.9%,7.7% 99.9%,3.8% 99.2%,0.0% 99.3%,1.9% 96.2%,2.7% 92.3%,1.3% 88.5%,2.6% 84.6%,2.8% 80.8%,2.7% 76.9%,1.0% 73.1%,0.6% 69.2%,0.6% 65.4%,0.6% 61.5%,0.6% 57.7%,1.7% 53.8%,2.5% 50.0%,2.4% 46.2%,1.3% 42.3%,1.8% 38.5%,2.2% 34.6%,0.2% 30.8%,1.8% 26.9%,2.5% 23.1%,2.2% 19.2%,2.1% 15.4%,1.3% 11.5%,0.5% 7.7%,2.2% 3.8%)}
.torn-3{clip-path:polygon(0.0% 1.1%,3.8% 2.7%,7.7% 3.3%,11.5% 1.3%,15.4% 1.4%,19.2% 3.2%,23.1% 2.5%,26.9% 0.6%,30.8% 0.4%,34.6% 0.5%,38.5% 3.1%,42.3% 2.7%,46.2% 0.5%,50.0% 2.8%,53.8% 3.3%,57.7% 2.2%,61.5% 1.2%,65.4% 1.9%,69.2% 0.4%,73.1% 0.0%,76.9% 3.3%,80.8% 2.2%,84.6% 1.8%,88.5% 3.2%,92.3% 1.5%,96.2% 3.0%,100.0% 2.8%,99.3% 3.8%,99.1% 7.7%,99.0% 11.5%,99.2% 15.4%,98.0% 19.2%,99.1% 23.1%,98.6% 26.9%,99.6% 30.8%,96.9% 34.6%,98.8% 38.5%,98.4% 42.3%,98.0% 46.2%,96.9% 50.0%,98.6% 53.8%,96.9% 57.7%,98.3% 61.5%,98.2% 65.4%,98.2% 69.2%,99.9% 73.1%,98.5% 76.9%,99.4% 80.8%,100.0% 84.6%,97.3% 88.5%,99.4% 92.3%,98.4% 96.2%,97.5% 100.0%,96.2% 98.1%,92.3% 98.9%,88.5% 98.2%,84.6% 98.1%,80.8% 97.3%,76.9% 99.6%,73.1% 98.1%,69.2% 99.2%,65.4% 99.1%,61.5% 97.4%,57.7% 98.3%,53.8% 98.1%,50.0% 97.4%,46.2% 96.9%,42.3% 98.5%,38.5% 97.9%,34.6% 98.3%,30.8% 98.3%,26.9% 97.6%,23.1% 98.5%,19.2% 98.2%,15.4% 98.4%,11.5% 96.8%,7.7% 97.6%,3.8% 97.0%,0.0% 96.8%,0.9% 96.2%,1.9% 92.3%,3.2% 88.5%,2.9% 84.6%,0.5% 80.8%,0.4% 76.9%,1.5% 73.1%,0.2% 69.2%,0.8% 65.4%,0.2% 61.5%,2.3% 57.7%,2.7% 53.8%,3.0% 50.0%,0.5% 46.2%,2.4% 42.3%,2.2% 38.5%,0.5% 34.6%,3.0% 30.8%,3.3% 26.9%,0.7% 23.1%,3.2% 19.2%,1.4% 15.4%,1.7% 11.5%,3.4% 7.7%,2.8% 3.8%)}
.marquee{clip-path:polygon(0.0% 1.6%,1.7% 4.3%,3.3% 5.2%,5.0% 3.4%,6.7% 2.0%,8.3% 3.2%,10.0% 7.2%,11.7% 0.2%,13.3% 5.5%,15.0% 4.4%,16.7% 0.2%,18.3% 3.3%,20.0% 6.2%,21.7% 5.1%,23.3% 0.6%,25.0% 9.9%,26.7% 7.9%,28.3% 9.7%,30.0% 1.0%,31.7% 2.7%,33.3% 0.4%,35.0% 7.8%,36.7% 2.7%,38.3% 1.3%,40.0% 4.2%,41.7% 9.1%,43.3% 8.2%,45.0% 2.6%,46.7% 1.5%,48.3% 9.2%,50.0% 5.7%,51.7% 7.0%,53.3% 0.9%,55.0% 0.6%,56.7% 6.9%,58.3% 4.3%,60.0% 0.7%,61.7% 9.4%,63.3% 6.3%,65.0% 8.0%,66.7% 0.8%,68.3% 8.6%,70.0% 0.7%,71.7% 8.6%,73.3% 4.5%,75.0% 3.4%,76.7% 5.5%,78.3% 9.3%,80.0% 2.7%,81.7% 1.3%,83.3% 5.3%,85.0% 2.4%,86.7% 1.1%,88.3% 1.6%,90.0% 0.5%,91.7% 2.0%,93.3% 3.1%,95.0% 3.1%,96.7% 7.6%,98.3% 2.9%,100.0% 5.0%,100.0% 98.2%,98.3% 96.5%,96.7% 99.8%,95.0% 97.5%,93.3% 99.8%,91.7% 92.7%,90.0% 94.5%,88.3% 98.1%,86.7% 95.3%,85.0% 90.7%,83.3% 98.9%,81.7% 91.8%,80.0% 95.7%,78.3% 95.0%,76.7% 91.7%,75.0% 96.1%,73.3% 94.9%,71.7% 93.1%,70.0% 90.2%,68.3% 96.6%,66.7% 91.7%,65.0% 92.9%,63.3% 93.6%,61.7% 96.0%,60.0% 96.5%,58.3% 99.5%,56.7% 98.7%,55.0% 99.3%,53.3% 92.6%,51.7% 97.4%,50.0% 98.4%,48.3% 99.2%,46.7% 91.6%,45.0% 91.3%,43.3% 93.3%,41.7% 97.2%,40.0% 97.6%,38.3% 97.1%,36.7% 95.4%,35.0% 98.4%,33.3% 95.5%,31.7% 97.4%,30.0% 90.4%,28.3% 90.3%,26.7% 94.5%,25.0% 97.6%,23.3% 90.3%,21.7% 96.9%,20.0% 96.4%,18.3% 100.0%,16.7% 96.2%,15.0% 95.3%,13.3% 95.0%,11.7% 98.0%,10.0% 95.0%,8.3% 100.0%,6.7% 97.4%,5.0% 99.1%,3.3% 96.0%,1.7% 99.6%,0.0% 99.8%);padding:22px 0}
.deco{position:absolute;inset:0;pointer-events:none;z-index:0}
.has-deco{position:relative}
.has-deco>*:not(.deco){position:relative;z-index:1}
.dk{position:absolute;transform:rotate(var(--r,0deg))}
.dk-stk{width:var(--w,110px);height:auto;filter:drop-shadow(0 8px 10px rgba(23,18,26,.2));z-index:2;animation:dk-float 7s ease-in-out infinite}
.dk-stk:nth-child(2n){animation-delay:-3s}
@keyframes dk-float{50%{transform:rotate(calc(var(--r,0deg) + 5deg)) translateY(-6px)}}
.dk-scrap{width:var(--w,220px);filter:drop-shadow(0 12px 16px rgba(23,18,26,.22))}
.dk-scrap .paper{display:block;background:#fff;padding:10px}
.dk-scrap img{display:block;width:100%;height:auto}
.dk-scrap::after{content:"";position:absolute;top:-12px;left:50%;width:46%;height:24px;margin-left:-23%;background:rgba(209,67,157,.42);transform:rotate(-4deg);z-index:2}
.dk-scrap.tape-c::after{background:rgba(145,196,255,.6);transform:rotate(5deg)}
.dk-scrap.tape-y::after{background:rgba(247,201,72,.55)}
@media (max-width:760px){.dk-scrap{display:none}.dk-scrap.keep-m{display:block;--w:150px}.dk-stk{width:calc(var(--w,110px)*.62)}}
@media (prefers-reduced-motion:reduce){.dk-stk{animation:none}}
.quiz{max-width:none}
.quiz .q-list,.quiz h2{max-width:min(760px,72%)}
@media (max-width:760px){.quiz .q-list,.quiz h2{max-width:none}.quiz .dk-stk{display:none}}
@media (max-width:760px){
  .cat-hero .dk-stk{top:10px !important;right:4% !important;--w:120px}
  .cat-hero .dk-stk + .dk-stk{display:none}
  .cat-hero .lbl{max-width:70%}
  .cta{margin-top:70px}
  .cta .dk-scrap{top:-84px !important;right:6% !important;--w:118px !important}
  .about-hero .dk-stk,.contact-hero .dk-stk + .dk-stk{display:none}
  .contact-hero .dk-stk{top:6px !important;right:4% !important}
}

/* portada collage: su arte detrás + fotos reales por rol */
.hs-art{position:absolute;inset:0;z-index:1;pointer-events:none}
.hs-art .dk-scrap,.ph-set .dk-scrap{width:var(--w)}
.hs-art .dk-scrap .paper{padding:7px}
.ph-set{position:absolute;inset:0;z-index:3;pointer-events:none}
.ph-set .dk-scrap{opacity:0;transform:rotate(var(--r)) translateY(18px) scale(.9);transition:opacity .35s ease,transform .5s cubic-bezier(.3,1.5,.5,1)}
.ph-set.on .dk-scrap{opacity:1;transform:rotate(var(--r))}
.ph-set.on .ph2{transition-delay:.1s}
.ph-set .dk-scrap .paper img{aspect-ratio:4/5;object-fit:cover}
.vicky-stk{z-index:2}
.stk-set{z-index:4}
.stk-set .s1{left:0;top:2%}
.stk-set .s2{right:-1%;top:44%}
.stk-set .s3{left:auto;right:16%;bottom:6%}
@media (max-width:760px){.hs-art .dk-scrap,.ph-set .dk-scrap{display:block}.ph-set .dk-scrap .paper,.hs-art .dk-scrap .paper{padding:5px}}
/* Vicky en el centro: cambia según el rol */
.vicky-stk{transition:opacity .2s ease}
.vicky-stk.swap-out{opacity:0}
.vicky-stk[data-k="camara"]{width:min(46%,300px)}
.vicky-stk[data-k="venecia"]{width:min(86%,560px)}
.at-img img{aspect-ratio:4/5;object-fit:cover;object-position:58% 40%}
.about-photo img{aspect-ratio:4/5;object-fit:cover;object-position:62% 40%}
@media (max-width:900px){.vicky-stk[data-k="camara"]{width:44%}.vicky-stk[data-k="venecia"]{width:84%}}
.vicky-stk[data-k="camara"]{width:min(54%,340px)}
@media (max-width:900px){.vicky-stk[data-k="camara"]{width:50%}}
.vicky-stk[data-k="venecia"]{width:min(84%,500px)}
@media (max-width:900px){.vicky-stk[data-k="venecia"]{width:82%}}
.vicky-stk[data-k="venecia"]{width:min(96%,580px)}
@media (max-width:900px){.vicky-stk[data-k="venecia"]{width:92%}}

/* stickers nuevos del centro */
.vicky-stk[data-k="cafe"]{width:min(60%,380px)}
.vicky-stk[data-k="paris"]{width:min(74%,470px)}
@media (max-width:900px){.vicky-stk[data-k="cafe"]{width:56%}.vicky-stk[data-k="paris"]{width:70%}}
/* foto de Vicky dentro de las categorías */
.cat-me{margin:0 0 40px}
.cat-me .art-me-img{position:relative;width:min(280px,46%)}
.cat-me img{aspect-ratio:4/5;object-fit:cover}
.cat-me .tape{position:absolute;top:-10px;left:50%;width:90px;height:24px;margin-left:-45px;background:rgba(209,67,157,.42);transform:rotate(4deg);z-index:2}
.cat-me figcaption{color:var(--accent)}
/* Sobre mí: Monet junto a la frase + tira de fotos */
.mirror-quote{align-items:center}
.mq-photo{position:relative;flex:none;width:min(260px,34%);margin:0;padding:10px 10px 30px;background:#fff;transform:rotate(-4deg);box-shadow:0 20px 40px -20px rgba(23,18,26,.45)}
.mq-photo img{width:100%;aspect-ratio:4/5;object-fit:cover}
.mq-photo .tape{position:absolute;top:-12px;left:50%;width:90px;height:24px;margin-left:-45px;background:rgba(247,201,72,.6);transform:rotate(-3deg)}
.me-strip{padding:clamp(50px,8vh,90px) var(--gut) 20px}
.ms-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2.4vw,30px)}
.ms-item{margin:0;padding:10px 10px 0;background:#fff;box-shadow:0 18px 34px -20px rgba(23,18,26,.45);transition:transform .4s cubic-bezier(.3,1.5,.5,1)}
.ms-item:nth-child(1){transform:rotate(-3deg)}.ms-item:nth-child(2){transform:rotate(2deg) translateY(16px)}
.ms-item:nth-child(3){transform:rotate(-1.5deg)}.ms-item:nth-child(4){transform:rotate(3deg) translateY(10px)}
.ms-item:hover{transform:rotate(0) translateY(-6px)}
.ms-item img{width:100%;aspect-ratio:4/5;object-fit:cover}
.ms-item figcaption{text-align:center;font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:10px 0 12px}
@media (max-width:760px){.ms-row{grid-template-columns:1fr 1fr}.mq-photo{width:46%}.mirror-quote{gap:18px}}
/* stickers de filmmaker y educadora */
.vicky-stk[data-k="bts"]{width:min(60%,390px)}
.vicky-stk[data-k="guia"]{width:min(50%,320px)}
@media (max-width:900px){.vicky-stk[data-k="bts"]{width:58%}.vicky-stk[data-k="guia"]{width:48%}}
/* detrás de escena dentro de un proyecto */
.ed-media{overflow:visible}
.ed-media .bts{position:relative;width:46%;margin:-60px 0 0 auto;padding:8px 8px 0;background:#fff;transform:rotate(4deg);box-shadow:0 18px 34px -18px rgba(23,18,26,.45);z-index:2}
.ed-media .bts img{width:100%;aspect-ratio:4/5;object-fit:cover}
.ed-media .bts figcaption{text-align:center;font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:9px 0 11px}
.ed-media .bts{width:60%}

/* ===== collages en blanco y negro (2026-10-29): sin stickers ilustrados ===== */
:root{--f-brush:"Caveat Brush","Jost",cursive}
/* portada: un collage por cada "y soy…" */
.stk-set .s.col{width:clamp(140px,18vw,260px);left:-3%;top:0;right:auto;bottom:auto;--r:-5deg;filter:drop-shadow(0 14px 16px rgba(23,18,26,.28))}
@media (max-width:900px){.stk-set .s.col{width:clamp(110px,32vw,180px);left:-2%}}
/* carrusel de categorías */
.car-sec .desk-head{align-items:flex-end}
.car-nav{margin-left:auto;display:flex;gap:10px}
.car-btn{width:54px;height:54px;border-radius:50%;border:2px solid var(--ink);background:transparent;color:var(--ink);font:inherit;font-size:1.3rem;cursor:pointer;transition:background .2s,color .2s}
.car-btn:hover{background:var(--ink);color:var(--bg)}
.car-btn:disabled{opacity:.25;cursor:default;background:transparent;color:var(--ink)}
.car{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1 * var(--gut));padding:20px var(--gut) 30px;scroll-padding:0 var(--gut);outline:none}
.car::-webkit-scrollbar{display:none}
.car-track{display:flex;gap:clamp(24px,4vw,56px);list-style:none;margin:0;padding:0}
.car-slide{flex:0 0 clamp(250px,27vw,370px);scroll-snap-align:start}
.car-slide a{display:block;text-decoration:none;color:var(--ink)}
.car-img{display:block;aspect-ratio:1;display:flex;align-items:center;justify-content:center}
.car-img img{max-width:100%;max-height:100%;width:auto;height:auto;display:block;filter:drop-shadow(0 14px 18px rgba(23,18,26,.22));transform:rotate(var(--rot,-1.5deg));transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.car-slide:nth-child(even) .car-img img{--rot:1.5deg}
.car-slide a:hover .car-img img,.car-slide a:focus-visible .car-img img{transform:rotate(0) scale(1.05)}
.car-n{display:inline-block;margin-top:18px;font-size:.78rem;font-weight:600;color:var(--cacc);letter-spacing:.14em;margin-right:10px}
.car-tags{font-size:.74rem;opacity:.65;text-transform:uppercase;letter-spacing:.08em}
@media (max-width:760px){.car-slide{flex-basis:76vw}.car-btn{width:44px;height:44px}.car-nav{margin-left:0}}
/* decoración: recortes de los collages */
.dk-col{width:var(--w,180px);height:auto;filter:drop-shadow(0 12px 14px rgba(23,18,26,.22));z-index:2}
@media (max-width:760px){.dk-col{display:none}.contact-hero .dk-col{display:block;top:0 !important;right:3% !important;--w:110px !important}}
/* portadas de categoría: collage + título con pincel */
.cat-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(20px,4vw,64px);align-items:center}
.cat-title{font-family:var(--f-brush);text-transform:none;letter-spacing:-.01em;font-weight:400;font-size:clamp(4.2rem,10vw,9.5rem);line-height:.92;font-variation-settings:normal;margin-bottom:.15em}
.cat-col{margin:0;justify-self:center;width:100%;max-width:520px}
.cat-col img{display:block;width:100%;height:auto;max-height:72vh;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(23,18,26,.24));animation:col-in .9s cubic-bezier(.3,1.4,.5,1) both}
@keyframes col-in{from{opacity:0;transform:translateY(26px) rotate(-6deg) scale(.94)}to{opacity:1;transform:rotate(2deg)}}
@media (max-width:760px){.cat-hero{grid-template-columns:1fr}.cat-col{order:-1;max-width:72vw}.cat-col img{max-height:52vh}}
@media (prefers-reduced-motion:reduce){.cat-col img{animation:none;transform:rotate(2deg)}}

/* portada solo con collages grandes (2026-10-29) */
.hero-cols{height:min(84vh,740px)}
.hero-cols .stk-set{display:flex;align-items:center;justify-content:center;z-index:2}
.hero-cols .stk-set .s.col{position:relative;left:auto;top:auto;right:auto;bottom:auto;width:auto;height:auto;max-width:100%;max-height:100%;--r:-2deg;
  filter:drop-shadow(0 22px 28px rgba(23,18,26,.28));transform:scale(.85) rotate(-8deg) translateY(20px);transition:opacity .4s ease,transform .7s cubic-bezier(.3,1.4,.5,1)}
.hero-cols .stk-set.on .s.col{transform:scale(1) rotate(var(--r))}
@media (max-width:900px){.hero-cols{aspect-ratio:auto;height:68vh;max-height:560px;max-width:none}}
/* carrusel: arrastrar */
.car{touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch;cursor:grab;overscroll-behavior-x:contain}
.car.dragging{cursor:grabbing;scroll-snap-type:none}
.car.dragging a{pointer-events:none}
.car img{-webkit-user-drag:none;user-select:none}
/* collage de portada: clic abre su categoría (solo el visible) */
.hero-cols .stk-set{pointer-events:none}
.hero-cols .stk-set.on .s.col{cursor:pointer}
.hero-cols .stk-set.on .s.col{pointer-events:auto}
.hero-cols .stk-set.on:hover .s.col{transform:scale(1.03) rotate(0deg)}
/* "Cuando era chiquita": pintando grande + su cara en Venecia más chica */
.at-img{position:relative;padding:0 12% 14% 0}
.at-img .at-small{position:absolute;right:0;bottom:0;width:44%;z-index:2}
.at-img .at-small img{aspect-ratio:1;object-fit:cover;object-position:50% 30%;border-width:8px;transform:rotate(5deg)}
@media (max-width:760px){.at-img{max-width:360px}}