/* Tolosa — sistema visual compartido (home + páginas por rubro) */
:root{
  --ink:#0c0c0c;
  --paper:#f5f2ea;
  --white:#ffffff;
  --accent:#ff4a1c;
  --mute:#5d594f;
  --rule:rgba(12,12,12,.16);
  --rule-dark:rgba(245,242,234,.18);
  --display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --gutter:clamp(1.25rem,5vw,4rem);
  --max:1240px;
  --r:22px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
body{background:var(--paper);color:var(--ink);font-family:var(--display);font-weight:400;font-size:1.125rem;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}

/* Header */
header.top{position:sticky;top:0;z-index:50;background:rgba(245,242,234,.88);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--rule)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding-top:.9rem;padding-bottom:.9rem}
header.top img{height:48px;width:auto;display:block}
header.top nav{display:flex;gap:1.75rem;font-weight:500;font-size:.98rem;margin-left:auto}
header.top nav a{text-decoration:none;padding:.3rem 0;border-bottom:2px solid transparent}
header.top nav a:hover{border-color:var(--accent)}

/* Botones */
.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--display);font-weight:600;font-size:1rem;line-height:1;text-decoration:none;padding:1rem 1.5rem;border-radius:999px;border:2px solid var(--ink);background:var(--ink);color:var(--paper);transition:transform .2s,background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--ink);transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.btn.accent{background:var(--accent);border-color:var(--accent);color:var(--ink)}
.btn.accent:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.btn.sm{padding:.75rem 1.2rem;font-size:.95rem}
.btn .arr{display:inline-block;transition:transform .2s}
.btn:hover .arr{transform:translateX(4px)}

/* Tipografía */
h1,h2,h3{font-family:var(--display);font-weight:800;letter-spacing:-.035em;line-height:.98}
h1 em,h2 em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--accent);font-size:1.1em;line-height:.9}
h1{font-size:clamp(3rem,9.6vw,8.4rem);letter-spacing:-.05em;line-height:.9}
h1.page{font-size:clamp(2.4rem,6.6vw,5.4rem);max-width:17ch;line-height:.95}
h2{font-size:clamp(2rem,4.6vw,3.6rem)}
h3{font-size:1.35rem;letter-spacing:-.02em;line-height:1.1}
.kicker{display:inline-flex;align-items:center;gap:.6rem;font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.kicker::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:var(--accent)}
.sub{color:var(--mute);margin-top:1rem;max-width:24em;font-size:1.05rem}
.content p+p{margin-top:1rem}

/* Hero */
.hero{padding:clamp(3rem,7vw,6rem) 0 clamp(3rem,7vw,5rem)}
.hero .kicker{margin-bottom:1.75rem}
.hero p.lead{font-size:clamp(1.15rem,1.9vw,1.45rem);max-width:33em;margin-top:2rem;color:var(--mute);line-height:1.5}
.hero p.lead+p.lead{margin-top:1rem}
.hero .actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.5rem}
.crumb{font-weight:500;font-size:.95rem;color:var(--mute);margin-bottom:1.5rem}
.crumb a{text-underline-offset:4px}

.week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:clamp(3rem,6vw,5rem)}
.day{font-weight:600;font-size:.95rem;padding:1.1rem .8rem;border:1.5px solid var(--rule);border-radius:16px;color:var(--mute);min-height:8rem;display:flex;flex-direction:column;justify-content:space-between;background:transparent}
.day .who{font-family:var(--display);font-weight:800;font-size:1.35rem;letter-spacing:-.03em;line-height:1;color:var(--ink)}
.day.on{background:var(--accent);border-color:var(--accent);color:var(--ink);transform:translateY(-10px);box-shadow:0 18px 40px -18px rgba(255,74,28,.7)}
.week-note{font-size:.98rem;color:var(--mute);margin-top:1.1rem}
@media (prefers-reduced-motion:no-preference){
  .day.on{animation:pop 1s .4s cubic-bezier(.2,.8,.2,1) both}
  @keyframes pop{from{background:transparent;border-color:var(--rule);transform:none;box-shadow:none}to{background:var(--accent);border-color:var(--accent);transform:translateY(-10px)}}
}

/* Marquee */
.marquee{background:var(--ink);color:var(--paper);overflow:hidden;white-space:nowrap;padding:1.1rem 0;border-block:1px solid var(--ink)}
.marquee-track{display:inline-flex;gap:2.5rem;padding-right:2.5rem;font-weight:800;font-size:clamp(1.3rem,2.6vw,2rem);letter-spacing:-.02em;text-transform:uppercase}
.marquee-track span{display:inline-flex;align-items:center;gap:2.5rem}
.marquee-track span::after{content:"✦";color:var(--accent);font-size:.8em}
.marquee-inner{display:inline-flex}
@media (prefers-reduced-motion:no-preference){
  .marquee-inner{animation:slide 32s linear infinite}
  @keyframes slide{to{transform:translateX(-50%)}}
}

/* Secciones */
section{padding:clamp(3.5rem,8vw,7rem) 0;border-top:1px solid var(--rule)}
.hero+section,.marquee+section{border-top:0}
.grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(1.5rem,5vw,4.5rem)}
.head{margin-bottom:clamp(2rem,5vw,3.5rem);max-width:48rem}
.head .sub{max-width:34em}

/* Sección oscura (rigor) */
section.dark{background:var(--ink);color:var(--paper);border-top:0}
section.dark .kicker{color:rgba(245,242,234,.65)}
section.dark h2{font-size:clamp(2.2rem,5.6vw,4.8rem);max-width:17ch;letter-spacing:-.045em;line-height:.95}
section.dark .cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);margin-top:clamp(2rem,4vw,3.5rem);color:rgba(245,242,234,.78);font-size:1.15rem}

/* Lista de hallazgos / filas */
.rows{list-style:none}
.rows li{padding:1.25rem 0;border-bottom:1px solid var(--rule)}
.rows li:first-child{padding-top:0}
.rows b{font-weight:800;letter-spacing:-.01em}
.faq b{display:block;margin-bottom:.35rem;font-size:1.2rem}

/* Pasos */
.steps{list-style:none;counter-reset:s}
.steps li{display:grid;grid-template-columns:4.4rem 1fr;gap:1rem;padding:1.75rem 0;border-bottom:1px solid var(--rule);counter-increment:s}
.steps li:first-child{padding-top:0}
.steps li::before{content:counter(s,decimal-leading-zero);font-weight:800;font-size:2.6rem;line-height:.9;letter-spacing:-.05em;color:var(--accent)}
.steps p{margin-top:.4rem;color:var(--mute)}
.steps.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.steps.cols3 li{display:block;border:1.5px solid var(--rule);border-radius:var(--r);padding:1.75rem;background:var(--white)}
.steps.cols3 li:first-child{padding-top:1.75rem}
.steps.cols3 li::before{display:block;font-size:4rem;margin-bottom:1.5rem}
.steps.cols3 h3{font-size:1.5rem}

/* Caso / resultados */
.case{background:var(--ink);color:var(--paper);border-radius:var(--r);padding:clamp(1.75rem,4vw,3rem)}
.case h3{font-size:clamp(1.8rem,3.4vw,2.8rem);letter-spacing:-.04em}
.case .by{color:rgba(245,242,234,.65);margin-top:.5rem;font-size:1rem}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:2.25rem 2rem;margin-top:2.5rem}
.fact b{display:block;font-weight:800;font-size:clamp(2.6rem,6vw,4.8rem);line-height:.9;letter-spacing:-.05em;color:var(--accent)}
.fact span{display:block;margin-top:.7rem;color:rgba(245,242,234,.8);font-size:1rem;line-height:1.4;max-width:24em}
section.stats .closing{margin-top:1.5rem;color:var(--mute);max-width:36em}
.home-stats .facts{grid-template-columns:repeat(4,1fr);gap:2rem 1.5rem}
.home-stats .fact b{font-size:clamp(2rem,3.5vw,3.1rem);white-space:nowrap}

/* Áreas (cards) */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
.card{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:17rem;padding:1.75rem;border:1.5px solid var(--ink);border-radius:var(--r);background:var(--white);text-decoration:none;transition:background .25s,color .25s,transform .25s}
.card .n{font-weight:800;font-size:.95rem;letter-spacing:.08em;color:var(--mute)}
.card h3{font-size:clamp(1.7rem,3vw,2.4rem);letter-spacing:-.04em;line-height:1;margin-top:auto;padding-top:2rem;max-width:12ch}
.card p{margin-top:.8rem;color:var(--mute);max-width:26em;font-size:1rem}
.card .go{position:absolute;top:1.5rem;right:1.5rem;width:2.6rem;height:2.6rem;border-radius:50%;border:1.5px solid currentColor;display:grid;place-items:center;font-size:1.1rem;transition:transform .25s,background .25s,color .25s}
.card:hover{background:var(--ink);color:var(--paper);transform:translateY(-4px)}
.card:hover p,.card:hover .n{color:rgba(245,242,234,.7)}
.card:hover .go{background:var(--accent);border-color:var(--accent);color:var(--ink);transform:rotate(-45deg)}

/* Trayectoria */
.trayectoria{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.tr{padding:1.6rem;border-radius:var(--r);background:var(--white);border:1.5px solid var(--rule)}
.tr h3{font-size:1.25rem;margin-bottom:.6rem}
.tr p{color:var(--mute);font-size:1rem;line-height:1.5}

/* Feed */
.feed-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:clamp(2rem,4vw,3rem)}
.tile{aspect-ratio:4/5;border-radius:var(--r);padding:clamp(1.25rem,2.4vw,2rem);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transition:transform .3s}
.tile:hover{transform:translateY(-6px) rotate(-.6deg)}
.tile .tk{font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.tile .tt{font-weight:800;font-size:clamp(1.35rem,2.5vw,2.1rem);letter-spacing:-.04em;line-height:1}
.tile .tt em{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.12em;letter-spacing:-.01em}
.tile .tf{font-size:.9rem;opacity:.75;line-height:1.35}
.tile.t1{background:var(--white);border:1.5px solid var(--ink)}
.tile.t2{background:var(--ink);color:var(--paper)}
.tile.t2 .tt em{color:#d4b06a}
.tile.t3{background:var(--accent);color:var(--ink)}
.feed-cta{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin-top:2rem}
.feed-cta span{color:var(--mute)}

/* Contacto */
section.contact{background:var(--accent);color:var(--ink);border-top:0}
section.contact .kicker{color:rgba(12,12,12,.7)}
section.contact .kicker::before{background:var(--ink)}
section.contact h2{font-size:clamp(2.6rem,7.4vw,6.4rem);letter-spacing:-.05em;line-height:.9}
section.contact h2 em{color:var(--ink)}
section.contact .sub{color:rgba(12,12,12,.8)}
.contact dl{display:grid;grid-template-columns:8rem 1fr;gap:1rem 1.5rem;margin-top:2rem}
.contact dt{font-weight:600;color:rgba(12,12,12,.65)}
.contact dd a{text-underline-offset:4px}
.contact .actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.25rem}
.contact .btn:hover{background:var(--paper);border-color:var(--paper);color:var(--ink)}
.contact .btn.ghost{border-color:var(--ink)}
.contact .btn.ghost:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.contact .big{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.5rem,5vw,4rem);align-items:end}

/* Links entre áreas */
.links{list-style:none}
.links li{border-bottom:1.5px solid var(--rule)}
.links li:first-child{border-top:1.5px solid var(--rule)}
.links a{display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;padding:1.3rem 0;text-decoration:none;font-weight:800;font-size:1.3rem;letter-spacing:-.025em;transition:padding .2s,color .2s}
.links a span{font-weight:400;letter-spacing:0;color:var(--mute);text-align:right;font-size:1rem}
.links a:hover{padding-left:.75rem;color:var(--accent)}

/* Footer */
footer{background:var(--ink);color:rgba(245,242,234,.7);padding:3rem 0 2.5rem;font-size:.95rem}
footer .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem}
footer img{height:34px;width:auto;display:block;filter:invert(1)}
footer a{text-underline-offset:4px}
.foot-links{display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;width:100%;padding-bottom:1.75rem;border-bottom:1px solid var(--rule-dark)}
.foot-links a{text-decoration:none;color:var(--paper);font-weight:500}
.foot-links a:hover{color:var(--accent)}

/* Reveal */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

/* Responsive */
@media (max-width:980px){
  .home-stats .facts{grid-template-columns:repeat(2,1fr)}
  .trayectoria{grid-template-columns:repeat(2,1fr)}
  .steps.cols3{grid-template-columns:1fr}
  .contact .big{grid-template-columns:1fr}
}
@media (max-width:820px){
  header.top nav{display:none}
  header.top .wrap{justify-content:space-between}
  .grid{grid-template-columns:1fr}
  .sub{max-width:none}
  .cards{grid-template-columns:1fr}
  .card{min-height:13rem}
  .feed-grid{grid-template-columns:1fr;max-width:26rem}
  section.dark .cols{grid-template-columns:1fr}
  .week{gap:5px}
  .day{padding:.7rem .4rem;font-size:.75rem;min-height:5.6rem;border-radius:12px}
  .day .who{font-size:.8rem;line-height:1.1}
  .contact dl{grid-template-columns:1fr;gap:.2rem}
  .contact dd{margin-bottom:1rem}
}
@media (max-width:560px){
  header.top img{height:38px}
  .btn.sm{padding:.65rem 1rem;font-size:.9rem}
  .facts,.home-stats .facts{grid-template-columns:1fr}
  .home-stats .fact b{font-size:clamp(2.6rem,12vw,3.4rem)}
  .trayectoria{grid-template-columns:1fr}
  .links a{flex-direction:column;gap:.2rem}
  .links a span{text-align:left}
  .steps li{grid-template-columns:3.2rem 1fr}
  .steps li::before{font-size:2rem}
}

/* Hero con retrato */
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero-grid h1{font-size:clamp(2.8rem,6.4vw,6rem)}
.portrait{position:relative;margin:0}
.portrait img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);filter:contrast(1.04)}
.portrait figcaption{position:absolute;left:1rem;right:1rem;bottom:1rem;background:var(--paper);border-radius:14px;padding:.8rem 1.1rem;display:flex;flex-direction:column;font-size:.9rem;color:var(--mute);line-height:1.3}
.portrait figcaption b{color:var(--ink);font-weight:800;font-size:1.05rem;letter-spacing:-.02em}
.badge{position:absolute;top:-1.1rem;right:-1rem;width:6.6rem;height:6.6rem;border-radius:50%;background:var(--accent);color:var(--ink);display:grid;place-items:center;text-align:center;font-weight:800;font-size:.95rem;line-height:1.05;letter-spacing:-.02em;padding:.8rem;transform:rotate(9deg);box-shadow:0 14px 30px -12px rgba(255,74,28,.7)}
@media (prefers-reduced-motion:no-preference){.badge{animation:wob 6s ease-in-out infinite}@keyframes wob{50%{transform:rotate(-5deg)}}}

/* Trayectoria con foto */
.about{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.about-photo{position:sticky;top:6rem;margin:0}
.about-photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r)}
.about .trayectoria{grid-template-columns:repeat(2,1fr)}
.about .head{margin-bottom:2rem}

@media (max-width:820px){
  .hero-grid{grid-template-columns:1fr}
  .portrait{max-width:26rem;margin-top:.5rem}
  .badge{right:.6rem;top:.6rem;width:5.4rem;height:5.4rem;font-size:.8rem}
  .about{grid-template-columns:1fr}
  .about-photo{position:static;max-width:24rem}
}
@media (max-width:560px){.about .trayectoria{grid-template-columns:1fr}}
