/*
Theme Name: Seba Sereno — Azurio
Theme URI: https://sebasereno.com.ar/
Author: Seba Sereno
Author URI: https://sebasereno.com.ar/
Description: Portfolio WordPress dinámico para Seba Sereno, basado visualmente en la plantilla Azurio provista por el propietario. Incluye proyectos, categorías con layouts seleccionables, blog y animaciones.
Version: 1.4.0
Text Domain: seba-sereno
*/

/* Ajustes propios del theme. El sistema visual base vive en assets/css/main.css */
.admin-bar .mxd-menu__contain { top: 32px; }
@media (max-width: 782px) { .admin-bar .mxd-menu__contain { top: 46px; } }

.ss-brand-wordmark {
  font-weight: 800;
  letter-spacing: -0.04em;
  font-size: clamp(1.1rem, 1.4vw, 1.6rem);
  color: currentColor;
  text-decoration: none;
}
.ss-hero-role { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.ss-no-image {
  width:100%; aspect-ratio: 16 / 10; display:grid; place-items:center;
  background: linear-gradient(135deg,#171717,#303030); color:#fff;
  font: 600 1rem/1.3 "JetBrains Mono", monospace; text-transform:uppercase;
}
.ss-project-meta { display:flex; flex-wrap:wrap; gap:.5rem; }
.ss-project-single__hero { padding-top: 12rem; }
.ss-project-single__meta { display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:1rem; margin:2rem 0 4rem; }
.ss-project-single__meta > div { border-top:1px solid currentColor; padding-top:1rem; }
.ss-project-single__gallery {
  display:block;
  column-count:3;
  column-gap:1rem;
  margin-top:2.5rem;
}
.ss-project-single__gallery img {
  width:100%;
  height:auto;
  display:block;
  margin:0 0 1rem;
  break-inside:avoid;
  -webkit-column-break-inside:avoid;
}
.ss-project-single__content { max-width:900px; margin:0 0 2.5rem; }
.ss-blog-grid { display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap:2rem; }
.ss-blog-card img { width:100%; aspect-ratio: 16 / 10; object-fit:cover; }
.ss-blog-card h2 { margin-top:1rem; }
.ss-contact-strip { padding: 9rem 0; }
.ss-contact-strip a { text-decoration:none; }
@media (max-width: 991px) {
  .ss-project-single__meta { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ss-blog-grid { grid-template-columns:1fr; }
  .ss-project-single__gallery { column-count:2; column-gap:.65rem; }
  .ss-project-single__gallery img { margin-bottom:.65rem; }
}


/* v0.2 — Logo configurable */
.ss-brand-logo {
  display: inline-flex;
  align-items: center;
  width: min(var(--ss-logo-width, 180px), 70vw);
  line-height: 0;
}
.ss-brand-logo__img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 84px;
  object-fit: contain;
  object-position: left center;
}
.ss-brand-logo__img--dark { display: none; }
[color-scheme="dark"] .ss-brand-logo__img--light:has(+ .ss-brand-logo__img--dark) { display: none; }
[color-scheme="dark"] .ss-brand-logo__img--dark { display: block; }
.ss-brand-text { display:flex; flex-direction:column; line-height:1.05; }
.ss-brand-text > span:last-child { font-size:.55em; font-weight:500; letter-spacing:0; margin-top:.25rem; }

/* v0.2 — Portfolio: proporción controlada para que screenshots verticales no creen cards gigantes */
.mxd-project-item__media {
  aspect-ratio: var(--ss-project-ratio, 16 / 10);
  width: 100%;
  background: var(--base-tint);
}
.mxd-project-item__media img,
.mxd-project-item__media .mxd-img-anim__main,
.mxd-project-item__media .mxd-img-anim__absolute {
  width: 100%;
  height: 100% !important;
  object-fit: var(--ss-project-fit, cover) !important;
  object-position: var(--ss-project-position, top) center !important;
}
.mxd-project-item__media .mxd-img-anim__main {
  position: absolute;
  inset: 0;
}
.mxd-project-item__media .ss-no-image {
  position:absolute;
  inset:0;
  aspect-ratio:auto;
  height:100%;
}

@media (max-width: 767px) {
  .ss-brand-logo { width: min(var(--ss-logo-width, 180px), 52vw); }
  .mxd-project-item { padding-left: 1.5rem; padding-right: 1.5rem; }
}

/* v0.3 — identidad, media editable y correcciones */
.ss-brand-logo { width:min(var(--ss-logo-width,180px),70vw); }
.ss-brand-logo__img { max-height:64px; object-fit:contain; object-position:left center; }
.ss-brand-logo__img--dark { display:none; }
html[color-scheme="dark"] .ss-brand-logo__img--light { display:none; }
html[color-scheme="dark"] .ss-brand-logo__img--dark { display:block; }
.mxd-menu__logo .ss-brand-logo__img { max-height:86px; }

.ss-menu-image {
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  padding:8%;
  background:#0f0f0f;
}
.ss-hero-image {
  display:block;
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center;
  border-radius:1.2rem;
}
.mxd-loader__images img { object-fit:contain; }

@media(max-width:767px){
  .ss-brand-logo__img{max-height:52px}
}

/* v0.4 — editable services */
.ss-service-card .card-description{z-index:2;color:#fff;}
.ss-service-card .card-description p{color:#fff;}
.ss-service-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:linear-gradient(135deg,#171717,#343434);color:#fff;}
.ss-service-placeholder span{font:600 1.2rem/1 var(--_font-accent);opacity:.55;}
.ss-service-placeholder strong{font:700 clamp(2rem,5vw,5rem)/1 var(--_font-default);text-align:center;max-width:80%;}


/* v0.5 — proyecto individual más editorial + footer social */
.single-project .ss-project-single__hero { padding-bottom: 1rem; }
.single-project .ss-project-single__hero .mxd-block { max-width: 100%; }
.single-project .ss-project-single__meta { margin-bottom: 1.5rem; }
.single-project .entry-content:empty { display:none; }

.ss-footer-socials {
  display:flex;
  flex-wrap:wrap;
  gap:.7rem;
  margin-top:1.4rem;
}
.ss-footer-socials a {
  width:44px;
  height:44px;
  border:1px solid currentColor;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:inherit;
  text-decoration:none;
  transition:transform .25s ease, background-color .25s ease, color .25s ease;
}
.ss-footer-socials a:hover { transform:translateY(-3px); background:var(--base-opp); color:var(--base); }
.ss-footer-socials i { font-size:1.25rem; line-height:1; }
.ss-footer-meta { display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; height:100%; }

@media (max-width: 767px) {
  .ss-project-single__hero { padding-top: 8.5rem; }
  .ss-project-single__hero h1 { font-size: clamp(2.6rem, 11vw, 4.8rem); line-height:.94; }
  .ss-project-single__meta { gap:.55rem; margin:1.4rem 0 1rem; }
  .ss-project-single__meta > div { font-size:.72rem; line-height:1.35; }
  .ss-project-single__gallery { column-count:2; column-gap:.4rem; margin-top:1rem; }
  .ss-project-single__gallery img { margin-bottom:.4rem; }
  .ss-contact-strip { padding:5rem 0 3.5rem; }
  .ss-contact-strip h2 { font-size:clamp(3rem,13vw,5.4rem); line-height:.94; }
  .ss-footer-meta { margin-top:2rem; }
  .ss-footer-socials { gap:.55rem; }
  .ss-footer-socials a { width:40px; height:40px; }
}

/* v0.6 — arquitectura final Seba Sereno */
.ss-menu-direct { display:flex; align-items:center; gap:1.2rem; text-decoration:none; }
.ss-simple-menu .main-menu__item { position:relative; }
.ss-menu-image,
.ss-menu-image video,
.menu-media__wrapper video { width:100%; height:100%; object-fit:cover; }
.mxd-loader__images video,
.ss-loader-media { display:block; position:absolute; width:100%; height:100%; object-fit:cover; opacity:0; }
.mxd-loader__images video:first-child,
.mxd-loader__images .ss-loader-media:first-child { opacity:1; }

.ss-hero-media video.ss-hero-image { width:100%; height:100%; object-fit:cover; border-radius:1.2rem; }

.ss-page-head { padding-top:7rem; padding-bottom:4rem; max-width:980px; }
.ss-page-head > p:last-child { max-width:760px; margin-top:1.5rem; }
.ss-section-action { display:flex; justify-content:flex-end; margin-top:2rem; }

/* Home portfolio: compacto, visual, 3 columnas desktop / 2 mobile */
.ss-home-portfolio-grid,
.ss-portfolio-filter-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2rem 1.2rem;
}
.ss-home-project-card,
.ss-portfolio-filter-item { min-width:0; transition:opacity .25s ease, transform .25s ease; }
.ss-portfolio-filter-item.is-hidden { display:none; }
.ss-home-project-media,
.ss-portfolio-card-media {
  position:relative;
  display:block;
  overflow:hidden;
  width:100%;
  aspect-ratio:4/3;
  background:var(--base-tint);
  border-radius:.4rem;
}
.ss-home-project-media img,
.ss-portfolio-card-media img,
.ss-home-project-media .mxd-img-anim__main,
.ss-home-project-media .mxd-img-anim__absolute,
.ss-portfolio-card-media .mxd-img-anim__main,
.ss-portfolio-card-media .mxd-img-anim__absolute {
  position:absolute;
  inset:0;
  width:100%;
  height:100% !important;
  object-fit:cover !important;
  object-position:top center !important;
}
.ss-home-project-caption,
.ss-portfolio-card-caption { padding-top:1rem; }
.ss-home-project-caption h3,
.ss-portfolio-card-caption h2 { font-size:clamp(1.5rem,2vw,2.4rem); line-height:1.05; margin:0 0 .8rem; }
.ss-home-project-caption a,
.ss-portfolio-card-caption a { color:inherit; text-decoration:none; }

.ss-portfolio-filters {
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
  margin-bottom:2.5rem;
  position:sticky;
  top:1rem;
  z-index:30;
  padding:.7rem 0;
  backdrop-filter:blur(12px);
}
.admin-bar .ss-portfolio-filters { top:3.5rem; }
.ss-filter {
  appearance:none;
  border:1px solid rgba(var(--base-opp-rgb),.22);
  background:rgba(var(--base-rgb),.78);
  color:var(--base-opp);
  border-radius:999px;
  padding:.7rem 1rem;
  font:500 .8rem/1 var(--_font-accent);
  cursor:pointer;
  transition:.25s ease;
}
.ss-filter:hover,.ss-filter.active { background:var(--base-opp); color:var(--base); }

/* Services */
.ss-service-card .card__media,
.ss-service-card video.card__media { width:100%; height:100%; object-fit:cover; }
.ss-service-detail-section { padding:2rem 0; }
.ss-service-detail-row { min-height:70vh; align-items:stretch; }
.ss-service-copy { display:flex; flex-direction:column; justify-content:center; padding:4rem 3rem 4rem 0; }
.ss-service-copy h2 { font-size:clamp(3.5rem,7vw,8rem); line-height:.92; margin:1rem 0 2rem; }
.ss-service-copy > p:last-child { max-width:560px; font-size:1.1rem; line-height:1.55; margin-top:2rem; }
.ss-service-tags { display:flex; flex-wrap:wrap; gap:.5rem; }
.ss-service-media { min-height:520px; overflow:hidden; border-radius:.6rem; position:relative; }
.ss-service-page-media { width:100%; height:100%; object-fit:cover; display:block; }

/* Home/contact social banner */
.ss-social-contact-banner { background:var(--base-opp); color:var(--base); }
.ss-social-contact-banner h2 { font-size:clamp(4.5rem,10vw,10rem); line-height:.88; margin:1rem 0 2rem; }
.ss-social-contact-banner p { color:inherit; }
.ss-contact-social-list { display:flex; flex-direction:column; margin-left:auto; max-width:520px; }
.ss-contact-social-list a {
  display:flex; justify-content:space-between; gap:1rem;
  padding:1.2rem 0; border-bottom:1px solid currentColor;
  color:inherit; text-decoration:none; font:500 1rem/1.2 var(--_font-accent);
}
.ss-contact-social-list a:first-child { border-top:1px solid currentColor; }
.ss-contact-social-list a:hover span:first-child { transform:translateX(.35rem); }
.ss-contact-social-list span { transition:transform .2s ease; }
.ss-contact-social-list--large { max-width:none; }
.ss-contact-social-list--large a { font-size:1.1rem; }

/* Footer + ecosystem */
.ss-footer-main { padding:8rem 0 4rem; }
.ss-footer-main h2 { font-size:clamp(3rem,6vw,7rem); line-height:.92; margin:1rem 0; }
.ss-footer-col { padding-top:1rem; }
.ss-footer-links { display:flex; flex-direction:column; gap:.55rem; margin-top:1.4rem; }
.ss-footer-links a { color:inherit; text-decoration:none; }
.ss-ecosystem-list { margin-top:1.4rem; }
.ss-ecosystem-list li { list-style:none; }
.ss-ecosystem-list a { display:grid; grid-template-columns:50px 1fr auto; gap:1rem; padding:.9rem 0; border-top:1px solid rgba(var(--base-opp-rgb),.18); color:inherit; text-decoration:none; }
.ss-ecosystem-list li:last-child a { border-bottom:1px solid rgba(var(--base-opp-rgb),.18); }
.ss-footer-social-row { display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; padding:2rem 0 4rem; }
.ss-footer-socials { display:flex; flex-wrap:wrap; gap:.6rem; margin:0; }
.ss-footer-socials a { width:auto; height:auto; border:1px solid currentColor; border-radius:999px; padding:.7rem 1rem; gap:.55rem; }
.ss-footer-socials a span { font-size:.75rem; }
.ss-footer-copy { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding-bottom:2rem; }
.ss-footer-copy a { color:inherit; }

/* Contact page */
.ss-contact-page-head { padding-top:8rem; padding-bottom:7rem; }
.ss-contact-page-head h1 { font-size:clamp(5rem,12vw,12rem); line-height:.86; margin:1rem 0 2rem; }
.ss-contact-page-head .t-medium { max-width:680px; }
.ss-contact-connect { padding:5rem 0 2rem; }
.ss-contact-connect h2 { margin:1rem 0 2rem; font-size:clamp(3rem,6vw,6rem); }
.ss-ecosystem-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 2rem; }
.ss-ecosystem-grid a { display:grid; grid-template-columns:55px 1fr auto; align-items:center; gap:1rem; padding:1.2rem 0; border-top:1px solid rgba(var(--base-opp-rgb),.25); color:inherit; text-decoration:none; }
.ss-ecosystem-grid a:nth-last-child(-n+2) { border-bottom:1px solid rgba(var(--base-opp-rgb),.25); }

/* Blog standard */
.ss-blog-featured { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr); gap:3rem; align-items:end; padding-bottom:5rem; }
.ss-blog-featured-media { display:block; aspect-ratio:16/10; overflow:hidden; border-radius:.5rem; }
.ss-blog-featured-media img { width:100%; height:100%; object-fit:cover; }
.ss-blog-featured-copy h2 { font-size:clamp(2.8rem,5vw,5.8rem); line-height:.94; margin:1rem 0 1.4rem; }
.ss-blog-featured-copy h2 a,.ss-blog-row-copy h2 a { color:inherit; text-decoration:none; }
.ss-blog-meta { display:flex; flex-wrap:wrap; gap:.7rem 1rem; font:500 .72rem/1.3 var(--_font-accent); text-transform:uppercase; }
.ss-blog-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(260px,.7fr); gap:4rem; align-items:start; }
.ss-blog-list { min-width:0; }
.ss-blog-row { display:grid; grid-template-columns:220px 1fr; gap:1.5rem; padding:1.6rem 0; border-top:1px solid rgba(var(--base-opp-rgb),.2); }
.ss-blog-row:last-child { border-bottom:1px solid rgba(var(--base-opp-rgb),.2); }
.ss-blog-row-media { aspect-ratio:4/3; overflow:hidden; border-radius:.35rem; }
.ss-blog-row-media img { width:100%; height:100%; object-fit:cover; }
.ss-blog-row-copy h2 { font-size:clamp(1.7rem,2.5vw,2.8rem); line-height:1; margin:.65rem 0; }
.ss-blog-sidebar { position:sticky; top:2rem; }
.admin-bar .ss-blog-sidebar { top:4.5rem; }
.ss-sidebar-block { padding:0 0 2rem; margin-bottom:2rem; border-bottom:1px solid rgba(var(--base-opp-rgb),.2); }
.ss-sidebar-block ul { display:flex; flex-direction:column; gap:.65rem; margin-top:1rem; }
.ss-sidebar-block a { color:inherit; text-decoration:none; }
.ss-sidebar-block .search-form { margin-top:1rem; }
.ss-sidebar-block input[type=search] { width:100%; padding:1rem; border:1px solid rgba(var(--base-opp-rgb),.25); background:transparent; color:inherit; }

/* Single article */
.ss-single-post-head { max-width:1100px; margin:0 auto; }
.ss-single-post-head h1 { font-size:clamp(4rem,8vw,9rem); line-height:.9; margin:1rem 0 2rem; }
.ss-single-post-lead { max-width:850px; font-size:1.2rem; line-height:1.5; }
.ss-single-post-cover { margin-top:3rem; aspect-ratio:16/9; overflow:hidden; border-radius:.5rem; }
.ss-single-post-cover img { width:100%; height:100%; object-fit:cover; }
.ss-single-post-layout { display:grid; grid-template-columns:minmax(0,800px) minmax(220px,1fr); gap:5rem; max-width:1150px; margin:4rem auto 0; align-items:start; }
.ss-single-post-content { font-size:1.08rem; line-height:1.75; }
.ss-single-post-content h2 { font-size:clamp(2.2rem,4vw,4rem); line-height:1; margin:3.5rem 0 1.2rem; }
.ss-single-post-content h3 { font-size:clamp(1.6rem,2.5vw,2.5rem); margin:2.5rem 0 1rem; }
.ss-single-post-content p,.ss-single-post-content ul,.ss-single-post-content ol { margin-bottom:1.4rem; }
.ss-single-post-aside { position:sticky; top:2rem; }

/* Project detail */
.ss-project-lead { max-width:900px; margin-top:1.5rem; }
.ss-project-single__tags { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.ss-project-single__gallery { column-count:3; column-gap:.8rem; }
.ss-project-gallery-item { margin:0 0 .8rem; break-inside:avoid; -webkit-column-break-inside:avoid; }
.ss-project-gallery-media { width:100%; height:auto; display:block; }
video.ss-project-gallery-media { aspect-ratio:9/16; object-fit:cover; background:#000; }
.ss-next-project { padding:7rem 0 2rem; }
.ss-next-project a { color:inherit; text-decoration:none; }
.ss-next-project h2 { font-size:clamp(3rem,7vw,8rem); line-height:.9; margin:1rem 0; }

@media (max-width: 991px) {
  .ss-home-portfolio-grid,.ss-portfolio-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem .7rem; }
  .ss-service-detail-row { min-height:0; }
  .ss-service-copy { padding:2.5rem 0; }
  .ss-service-media { min-height:420px; }
  .ss-blog-featured { grid-template-columns:1fr; gap:1.5rem; }
  .ss-blog-layout { grid-template-columns:1fr; gap:3rem; }
  .ss-blog-sidebar { position:static; }
  .ss-single-post-layout { grid-template-columns:1fr; gap:3rem; }
  .ss-single-post-aside { position:static; }
  .ss-footer-main { padding-top:5rem; }
  .ss-footer-col { margin-top:2.5rem; }
  .ss-footer-social-row { align-items:flex-start; flex-direction:column; }
}

@media (max-width: 767px) {
  .ss-page-head { padding-top:5.5rem; padding-bottom:2.5rem; }
  .ss-home-portfolio-grid,.ss-portfolio-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem .45rem; }
  .ss-home-project-media,.ss-portfolio-card-media { aspect-ratio:1/1; }
  .ss-home-project-caption h3,.ss-portfolio-card-caption h2 { font-size:1.05rem; }
  .ss-project-meta .tag { font-size:.55rem; padding:.35rem .45rem; }
  .ss-section-action { justify-content:flex-start; }
  .ss-portfolio-filters { top:0; gap:.35rem; overflow:auto; flex-wrap:nowrap; margin-left:-1rem; margin-right:-1rem; padding:.7rem 1rem; }
  .admin-bar .ss-portfolio-filters { top:0; }
  .ss-filter { white-space:nowrap; flex:0 0 auto; font-size:.68rem; padding:.55rem .75rem; }
  .ss-service-media { min-height:300px; }
  .ss-service-copy h2 { font-size:clamp(3rem,14vw,5rem); }
  .ss-social-contact-banner h2 { font-size:clamp(4rem,18vw,7rem); }
  .ss-contact-social-list { margin-top:2.5rem; }
  .ss-footer-main h2 { font-size:clamp(3rem,13vw,5rem); }
  .ss-footer-copy { align-items:flex-start; flex-direction:column; }
  .ss-footer-socials a span { display:none; }
  .ss-footer-socials a { width:42px; height:42px; padding:0; justify-content:center; }
  .ss-ecosystem-grid { grid-template-columns:1fr; }
  .ss-ecosystem-grid a:nth-last-child(-n+2) { border-bottom:0; }
  .ss-ecosystem-grid a:last-child { border-bottom:1px solid rgba(var(--base-opp-rgb),.25); }
  .ss-blog-row { grid-template-columns:105px 1fr; gap:.9rem; }
  .ss-blog-row-copy p { display:none; }
  .ss-blog-featured-copy h2 { font-size:clamp(2.4rem,11vw,4rem); }
  .ss-single-post-head h1 { font-size:clamp(3.2rem,13vw,5.2rem); }
  .ss-project-single__gallery { column-count:2; column-gap:.4rem; }
  .ss-project-gallery-item { margin-bottom:.4rem; }
}


/* v0.7 — mobile polish, menu layering, project readability and compact footer */
html, body { max-width:100%; overflow-x:clip; }
.ss-theme, .mxd-page-content { max-width:100%; overflow-x:clip; }
.ss-home-hero { max-width:100vw; overflow:hidden; }

/* The Azurio overlay uses the opposite page color. Menu logo must therefore use the opposite logo variant too. */
html[color-scheme="light"] .mxd-menu__logo .ss-brand-logo__img--light { display:none !important; }
html[color-scheme="light"] .mxd-menu__logo .ss-brand-logo__img--dark { display:block !important; }
html[color-scheme="dark"] .mxd-menu__logo .ss-brand-logo__img--light { display:block !important; }
html[color-scheme="dark"] .mxd-menu__logo .ss-brand-logo__img--dark { display:none !important; }

/* Menu must always sit above sticky filters and project content. */
.mxd-menu { z-index:10000; }
.mxd-menu__contain { z-index:10002; }
.ss-portfolio-filters { z-index:5; }

/* Project detail: clearer information hierarchy. */
.ss-project-single__meta strong {
  display:block;
  margin-bottom:.35rem;
  font:600 .72rem/1.2 var(--_font-accent);
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--t-medium);
}
.ss-project-single__meta > div { font-size:1rem; line-height:1.45; }
.ss-project-single__tags .tag { font-size:.72rem; }

/* Footer: compact and useful. Contact CTA already lives above it. */
.ss-footer-main { padding:5rem 0 2.5rem; }
.ss-footer-name { font-size:clamp(2rem,3vw,3.6rem); line-height:1; margin:1rem 0 .8rem; }
.ss-footer-social-row { padding:1.5rem 0 2.5rem; align-items:flex-start; }
.ss-footer-socials { flex:1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 1.25rem; }
.ss-footer-socials a {
  width:100%; height:auto; border:0; border-radius:0;
  border-top:1px solid rgba(var(--base-opp-rgb),.22);
  padding:.9rem 0; display:flex; justify-content:space-between; align-items:center;
  background:transparent; color:inherit;
}
.ss-footer-socials a:last-child { border-bottom:1px solid rgba(var(--base-opp-rgb),.22); }
.ss-footer-socials a::after { content:'↗'; font-family:var(--_font-accent); }
.ss-footer-socials a:hover { transform:none; background:transparent; color:inherit; }
.ss-footer-socials a span { display:block; font:.75rem/1.2 var(--_font-accent); }
.ss-footer-copy { font-size:.8rem; }

@media (max-width: 767px) {
  /* Home hero: keep the oversized character without causing horizontal displacement. */
  .mxd-hero-10__headline { overflow:hidden; padding-top:11rem; padding-bottom:4.5rem; }
  .hero-10-headline__wrap { width:100%; overflow:hidden; padding:0 1.5rem; box-sizing:border-box; }
  .hero-10-headline__wrap h1 { width:100%; font-size:15.2vw; line-height:.82; letter-spacing:-.35vw; text-align:left; }
  .hero-10-headline__wrap h1 a { display:block; width:100%; overflow:hidden; }
  .hero-10-headline__wrap h1 a span { display:block; max-width:100%; white-space:nowrap; }
  .mxd-hero-10__center { padding-left:3rem; padding-right:3rem; }
  .mxd-hero-10__divider { left:3rem; width:calc(100% - 6rem); }
  .mxd-hero-10__descr p { font-size:2.2rem; line-height:1.15; letter-spacing:-.06rem; }

  /* Menu: no page element may bleed over the overlay. */
  .mxd-menu__logo { max-width:45vw; }
  .mxd-menu__logo .ss-brand-logo { width:min(var(--ss-logo-width,180px),45vw); }
  .mxd-menu__navigation { isolation:isolate; }

  /* Portfolio detail readability. */
  .ss-project-single__hero { padding-top:8rem; }
  .ss-project-single__hero h1 { font-size:clamp(3.2rem,12vw,5.2rem); line-height:.93; }
  .ss-project-single__meta { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
  .ss-project-single__meta > div { font-size:.9rem; line-height:1.45; min-height:4.6rem; }
  .ss-project-single__meta strong { font-size:.66rem; margin-bottom:.45rem; }
  .ss-project-single__tags { gap:.4rem; margin-top:1.25rem; }
  .ss-project-single__tags .tag { font-size:.68rem; padding:.5rem .65rem; }

  /* Home services: static, compact cards on phones instead of multiple 100svh pinned panels. */
  .ss-home-services .mxd-stack-cards.ss-mobile-static-stack {
    gap:.8rem; padding:.8rem; overflow:visible; background:var(--base-opp);
  }
  .ss-home-services .ss-mobile-static-stack .mxd-stack-cards__card,
  .ss-home-services .ss-mobile-static-stack .mxd-stack-cards__card:nth-child(2) {
    height:auto; min-height:0; margin-top:0;
  }
  .ss-home-services .ss-mobile-static-stack .card__wrapper {
    height:auto; aspect-ratio:4/3; overflow:hidden; border-radius:.5rem;
  }
  .ss-home-services .ss-mobile-static-stack .card__image { inset:0; position:absolute; }
  .ss-home-services .ss-mobile-static-stack .card__content { position:absolute; inset:0; height:100%; display:block; }
  .ss-home-services .ss-mobile-static-stack .card__descr {
    opacity:1 !important; height:auto; padding:1rem; align-items:flex-start; justify-content:flex-start;
  }
  .ss-home-services .ss-mobile-static-stack .card-description { display:none; }
  .ss-home-services .ss-mobile-static-stack .card__title {
    width:calc(100% - 2rem); max-width:none; left:1rem; right:1rem; top:auto; bottom:1rem;
    transform:none; text-align:left;
  }
  .ss-home-services .ss-mobile-static-stack .card__title p { font-size:2.4rem; line-height:1; }
  .ss-home-services .ss-mobile-static-stack .card__tags { gap:.35rem; flex-wrap:wrap; }

  /* Footer: ecosystem + social names, no broken icon circles or oversized ticker. */
  .ss-footer-main { padding:3.8rem 0 1.5rem; }
  .ss-footer-name { font-size:2.4rem; }
  .ss-footer-col { margin-top:2rem; }
  .ss-ecosystem-list a { grid-template-columns:42px 1fr auto; gap:.7rem; padding:.85rem 0; font-size:.92rem; }
  .ss-footer-social-row { padding:1.25rem 0 2rem; flex-direction:column; gap:1rem; }
  .ss-footer-socials { width:100%; grid-template-columns:1fr; gap:0; }
  .ss-footer-socials a { padding:.85rem 0; }
  .ss-footer-socials a span { display:block !important; font-size:.8rem; }
  .mxd-footer__fullwidth { display:none !important; }
  .ss-footer-copy { gap:.7rem; font-size:.72rem; padding:0 0 2rem; }
  .ss-footer-copy p, .ss-footer-copy a { font-size:.72rem; line-height:1.35; }
}

/* v0.8 — limpieza visual general, portfolio legible y footer simplificado */

/* Generic English demo labels removed from presentation; keep professional role names only. */
.mxd-footer__fullwidth { display:none !important; }

/* Home contact banner: one clear contact block, not a second footer. */
.ss-social-contact-banner {
  background:#0f0f0f !important;
  color:#EEEAE8 !important;
  padding-top:7rem !important;
  padding-bottom:7rem !important;
}
.ss-social-contact-banner .footer-data,
.ss-social-contact-banner .footer-data span,
.ss-social-contact-banner h2,
.ss-social-contact-banner p { color:#EEEAE8 !important; }
.ss-social-contact-banner h2 {
  font-size:clamp(4rem,8vw,8rem) !important;
  line-height:.9 !important;
  letter-spacing:-.055em;
  margin:1.1rem 0 1.6rem !important;
}
.ss-social-contact-banner .t-medium,
.ss-social-contact-banner p:not(.footer-data) { max-width:620px; color:#b9bac2 !important; }
.ss-social-contact-banner .ss-contact-social-list { max-width:620px; }
.ss-social-contact-banner .ss-contact-social-list a {
  border-color:rgba(238,234,232,.35) !important;
  color:#EEEAE8 !important;
  font-size:.95rem;
  padding:1rem 0;
}

/* Portfolio archive */
.ss-portfolio-page .ss-page-head { max-width:1080px; padding-top:8rem; padding-bottom:2.5rem; }
.ss-portfolio-page .ss-page-head h1 {
  font-size:clamp(4rem,7vw,7.2rem);
  line-height:.88;
  letter-spacing:-.06em;
  margin:.8rem 0 1.2rem;
}
.ss-portfolio-page .ss-page-head > p:last-child {
  font-size:1.08rem;
  line-height:1.5;
  color:var(--t-medium);
  max-width:760px;
}
.ss-portfolio-filters {
  position:relative;
  top:auto !important;
  z-index:2;
  margin:0 0 3rem;
  padding:0;
  gap:.7rem;
  backdrop-filter:none;
}
.admin-bar .ss-portfolio-filters { top:auto !important; }
.ss-filter {
  min-height:44px;
  padding:.75rem 1.15rem;
  font-size:.82rem;
  line-height:1;
  border-color:rgba(var(--base-opp-rgb),.34);
}
.ss-portfolio-filter-grid,
.ss-home-portfolio-grid {
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:2.25rem 1.2rem;
}
.ss-portfolio-card-caption,
.ss-home-project-caption { padding-top:.9rem; }
.ss-portfolio-card-caption h2,
.ss-home-project-caption h3 {
  font-family:var(--_font-default);
  font-size:clamp(1.2rem,1.45vw,1.7rem) !important;
  font-weight:650;
  line-height:1.08 !important;
  letter-spacing:-.035em !important;
  word-spacing:.08em;
  text-wrap:balance;
  margin:0 0 .7rem !important;
}
.ss-portfolio-card-caption h2 a,
.ss-home-project-caption h3 a { display:block; }
.ss-project-meta { gap:.4rem .45rem; }
.ss-project-meta .tag {
  font-size:.62rem;
  line-height:1;
  padding:.42rem .58rem;
  border:1px solid rgba(var(--base-opp-rgb),.24);
  border-radius:999px;
}

/* Project detail: client data must be readable, categories become pills. */
.single-project .ss-project-single__hero { padding-top:10rem; padding-bottom:2rem; }
.single-project .ss-project-single__hero h1 {
  max-width:1200px;
  font-size:clamp(4rem,6.2vw,7.2rem);
  line-height:.91;
  letter-spacing:-.055em;
}
.ss-project-single__meta {
  gap:1rem;
  margin:2rem 0 1.6rem;
}
.ss-project-single__meta > div {
  padding-top:.85rem;
  font-size:1.05rem;
  line-height:1.45;
}
.ss-project-single__meta strong {
  font-size:.76rem;
  margin-bottom:.5rem;
}
.ss-project-single__tags {
  gap:.5rem;
  margin-top:1.25rem;
}
.ss-project-single__tags .tag {
  font-size:.72rem;
  padding:.55rem .75rem;
  border:1px solid rgba(var(--base-opp-rgb),.28);
  border-radius:999px;
}

/* Services */
.ss-services-page .ss-page-head h1 {
  font-size:clamp(4rem,7vw,7rem);
  line-height:.9;
  letter-spacing:-.055em;
}
.ss-service-copy .footer-data span { text-transform:none; }

/* Contact page */
.ss-contact-page-head h1 {
  font-size:clamp(4rem,7.5vw,8rem);
  line-height:.9;
  letter-spacing:-.055em;
  margin:1rem 0 1.8rem;
}
.ss-contact-page-head > .container-fluid > .row { align-items:end; }
.ss-contact-page-head .t-medium { max-width:650px; }
.ss-contact-page .ss-contact-social-list { margin-top:1.5rem; }

/* New footer: only identity + ecosystem + legal. */
.ss-footer-v08 {
  background:#0f0f0f;
  color:#EEEAE8;
  padding:5.5rem 0 2rem;
}
.ss-footer-v08 .footer-data,
.ss-footer-v08 .footer-data span,
.ss-footer-v08 p,
.ss-footer-v08 a,
.ss-footer-v08 h3,
.ss-footer-v08 strong { color:#EEEAE8; }
.ss-footer-v08__grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(520px,1.05fr);
  gap:6rem;
  align-items:start;
}
.ss-footer-v08__brand h3 {
  font-size:clamp(2.7rem,5vw,5.7rem);
  line-height:.92;
  letter-spacing:-.055em;
  margin:1.2rem 0 1rem;
  max-width:620px;
}
.ss-footer-v08__brand > p:last-child { color:#9a9ca6; }
.ss-footer-v08 .ss-ecosystem-list { margin-top:1.2rem; }
.ss-footer-v08 .ss-ecosystem-list a {
  grid-template-columns:54px 1fr auto;
  padding:1rem 0;
  border-color:rgba(238,234,232,.22);
  font-size:.9rem;
}
.ss-footer-v08 .ss-ecosystem-list strong { font-weight:500; }
.ss-footer-v08__bottom {
  margin-top:4.5rem;
  padding-top:1.2rem;
  border-top:1px solid rgba(238,234,232,.2);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
}
.ss-footer-v08__bottom p,
.ss-footer-v08__bottom a {
  margin:0;
  font-size:.75rem;
  line-height:1.3;
  color:#8e9099;
  text-decoration:none;
}

/* Blog language and hierarchy */
.ss-blog-page .ss-page-head h1 {
  font-size:clamp(4rem,7vw,7rem);
  line-height:.9;
  letter-spacing:-.055em;
}

@media (max-width: 991px) {
  .ss-footer-v08__grid { grid-template-columns:1fr; gap:3rem; }
  .ss-portfolio-filter-grid,
  .ss-home-portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

@media (max-width: 767px) {
  .ss-social-contact-banner { padding-top:4.5rem !important; padding-bottom:4.5rem !important; }
  .ss-social-contact-banner h2 { font-size:clamp(3.5rem,16vw,5.8rem) !important; }
  .ss-social-contact-banner .ss-contact-social-list { margin-top:2rem; }

  .ss-portfolio-page .ss-page-head { padding-top:6.5rem; padding-bottom:2rem; }
  .ss-portfolio-page .ss-page-head h1 { font-size:clamp(3.8rem,16vw,5.8rem); }
  .ss-portfolio-page .ss-page-head > p:last-child { font-size:.95rem; }
  .ss-portfolio-filters {
    display:flex;
    overflow-x:auto;
    flex-wrap:nowrap;
    gap:.45rem;
    margin:0 -1.2rem 2rem;
    padding:0 1.2rem .3rem;
    scrollbar-width:none;
  }
  .ss-portfolio-filters::-webkit-scrollbar { display:none; }
  .ss-filter { min-height:38px; font-size:.68rem; padding:.6rem .8rem; flex:0 0 auto; }
  .ss-portfolio-filter-grid,
  .ss-home-portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:1.2rem .55rem; }
  .ss-portfolio-card-caption h2,
  .ss-home-project-caption h3 { font-size:1rem !important; line-height:1.08 !important; letter-spacing:-.025em !important; word-spacing:.06em; }
  .ss-project-meta .tag { font-size:.55rem; padding:.36rem .48rem; }

  .single-project .ss-project-single__hero { padding-top:8rem; }
  .single-project .ss-project-single__hero h1 { font-size:clamp(3.35rem,12.8vw,5.3rem); }
  .ss-project-single__meta > div { font-size:.96rem; min-height:auto; }
  .ss-project-single__meta strong { font-size:.69rem; }
  .ss-project-single__tags .tag { font-size:.61rem; padding:.46rem .58rem; }

  .ss-contact-page-head h1 { font-size:clamp(3.6rem,15vw,5.5rem); }
  .ss-contact-page .ss-contact-social-list--large a { font-size:.9rem; }

  .ss-footer-v08 { padding:4rem 0 1.5rem; }
  .ss-footer-v08__grid { gap:2.8rem; }
  .ss-footer-v08__brand h3 { font-size:2.8rem; }
  .ss-footer-v08 .ss-ecosystem-list a { grid-template-columns:42px 1fr auto; gap:.7rem; padding:.85rem 0; font-size:.86rem; }
  .ss-footer-v08__bottom { margin-top:3rem; align-items:flex-start; flex-direction:column; gap:.65rem; }
}

/* ================================================================
   SEBA SERENO — v1.0
   Consolidación visual: jerarquía, legibilidad, portfolio, footer.
   Nota: Azurio usa html { font-size:62.5% }, por eso 1.6rem = 16px.
   ================================================================ */

html, body { max-width:100%; overflow-x:clip; }
body.ss-menu-open { overflow:hidden !important; }
.mxd-page-content { max-width:100%; overflow-x:clip; }

/* Menu always above the page. */
.mxd-menu { position:fixed; inset:0; z-index:99990 !important; pointer-events:none; }
.mxd-menu__backdrop,
.mxd-menu__overlay { z-index:99991 !important; }
.mxd-menu__overlay { pointer-events:auto; }
.mxd-menu__contain { z-index:99999 !important; }
.mxd-header { z-index:500 !important; }
.ss-portfolio-filters { z-index:4 !important; }

/* Branding / header */
.ss-brand-logo__img { max-height:5.6rem; }
.mxd-menu__logo .ss-brand-logo__img { max-height:7.2rem; }

/* HOME HERO — name has its own responsive system, never overflows. */
.ss-home-hero { overflow:hidden; }
.ss-home-hero .hero-10-headline__wrap { max-width:100%; overflow:hidden; }
.ss-home-hero .hero-10-headline__wrap h1 {
  width:100%;
  max-width:100%;
  margin:0;
  font-size:clamp(8rem, 13.2vw, 22rem) !important;
  line-height:.78 !important;
  letter-spacing:-.075em !important;
}
.ss-home-name {
  display:flex !important;
  align-items:baseline;
  flex-wrap:nowrap;
  gap:.16em;
  width:100%;
  text-transform:uppercase;
  white-space:nowrap;
}
.ss-home-name > span { display:block; }
.ss-home-hero .mxd-hero-10__descr p {
  font-size:clamp(2.8rem,3vw,5.2rem);
  line-height:1.04;
  letter-spacing:-.045em;
}
.ss-home-hero .ss-hero-role .tag { font-size:1.25rem; padding:.7rem 1rem; }

/* Section headings */
.ss-home-work .mxd-section-title__title h2,
.ss-home-services-v1 .mxd-section-title__title h2 {
  font-size:clamp(5.2rem,7vw,10rem);
  line-height:.9;
  letter-spacing:-.055em;
}
.ss-home-work .mxd-section-title__title p,
.ss-home-services-v1 .mxd-section-title__title p {
  max-width:72rem;
  font-size:1.8rem;
  line-height:1.5;
  color:var(--t-medium);
}

/* PORTFOLIO — stable single preview, no image slideshow. */
.ss-home-portfolio-grid,
.ss-portfolio-filter-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:4.8rem 2rem !important;
}
.ss-home-project-card,
.ss-portfolio-filter-item { min-width:0; }
.ss-project-card-media,
.ss-home-project-media,
.ss-portfolio-card-media {
  position:relative;
  display:block;
  overflow:hidden;
  width:100%;
  aspect-ratio:16 / 10 !important;
  background:var(--base-tint);
  border-radius:.8rem;
}
.ss-project-card-image {
  display:block;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:top center !important;
  transition:transform .55s cubic-bezier(.2,.65,.35,1);
}
.ss-project-card-media:hover .ss-project-card-image { transform:scale(1.025); }
.ss-project-card-arrow {
  position:absolute;
  right:1.4rem;
  top:1.4rem;
  width:4.4rem;
  height:4.4rem;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(15,15,15,.86);
  color:#fff;
  font:500 1.7rem/1 var(--_font-accent);
  opacity:0;
  transform:translateY(.5rem);
  transition:opacity .25s ease, transform .25s ease;
}
.ss-project-card-media:hover .ss-project-card-arrow { opacity:1; transform:none; }
.ss-home-project-caption,
.ss-portfolio-card-caption { padding-top:1.5rem !important; }
.ss-home-project-caption h3,
.ss-portfolio-card-caption h2 {
  margin:0 0 .75rem !important;
  font:650 clamp(2rem,1.55vw,2.7rem)/1.08 var(--_font-default) !important;
  letter-spacing:-.04em !important;
  text-wrap:balance;
}
.ss-home-project-caption a,
.ss-portfolio-card-caption a { color:inherit; text-decoration:none; }
.ss-project-meta { gap:.65rem 1rem !important; }
.ss-project-meta > span,
.ss-project-meta .tag {
  border:0 !important;
  padding:0 !important;
  border-radius:0 !important;
  background:none !important;
  color:var(--t-medium) !important;
  font:600 1.15rem/1.25 var(--_font-accent) !important;
  letter-spacing:.035em;
  text-transform:uppercase;
}
.ss-project-meta > span + span::before,
.ss-project-meta .tag + .tag::before { content:'·'; margin-right:1rem; }

/* Portfolio archive */
.ss-portfolio-page .ss-page-head {
  max-width:118rem;
  padding-top:14rem;
  padding-bottom:4rem;
}
.ss-portfolio-page .ss-page-head h1 {
  font-size:clamp(6rem,8.4vw,12rem) !important;
  line-height:.86 !important;
  letter-spacing:-.065em !important;
  margin:1rem 0 2rem;
}
.ss-portfolio-page .ss-page-head > p:last-child {
  max-width:80rem;
  font-size:1.8rem !important;
  line-height:1.55;
}
.ss-portfolio-filters {
  position:relative !important;
  top:auto !important;
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  margin:0 0 4.5rem !important;
  padding:0 !important;
  backdrop-filter:none !important;
}
.ss-filter {
  min-height:4.6rem !important;
  padding:0 1.65rem !important;
  border:1px solid rgba(var(--base-opp-rgb),.28) !important;
  border-radius:999px;
  background:transparent !important;
  color:var(--base-opp) !important;
  font:600 1.35rem/1 var(--_font-accent) !important;
  letter-spacing:.01em;
  white-space:nowrap;
}
.ss-filter:hover,
.ss-filter.active { background:var(--base-opp) !important; color:var(--base) !important; }
.ss-portfolio-filter-item.is-hidden { display:none !important; }

/* HOME SERVICES — no pinned stack, clean 2x2 grid. */
.ss-home-services-v1 { overflow:hidden; }
.ss-home-services-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5rem 2rem;
  margin-top:5rem;
}
.ss-home-service-card { min-width:0; }
.ss-home-service-media {
  position:relative;
  display:block;
  overflow:hidden;
  width:100%;
  aspect-ratio:16/10;
  border-radius:.8rem;
  background:#161616;
}
.ss-home-service-image,
.ss-home-service-media video {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .6s cubic-bezier(.2,.65,.35,1);
}
.ss-home-service-media:hover .ss-home-service-image,
.ss-home-service-media:hover video { transform:scale(1.025); }
.ss-home-service-copy { padding-top:1.5rem; }
.ss-home-service-kicker {
  font:600 1.2rem/1 var(--_font-accent);
  color:var(--t-medium);
  margin-bottom:1rem;
}
.ss-home-service-copy h3 {
  margin:0 0 1rem;
  font:650 clamp(2.8rem,3vw,4.4rem)/1 var(--_font-default);
  letter-spacing:-.045em;
}
.ss-home-service-copy h3 a { color:inherit; text-decoration:none; }
.ss-home-service-copy > p { max-width:60rem; font-size:1.6rem; line-height:1.55; color:var(--t-medium); }
.ss-home-service-tags { display:flex; flex-wrap:wrap; gap:.6rem 1rem; margin-top:1.2rem; }
.ss-home-service-tags span { font:600 1.1rem/1.3 var(--_font-accent); color:var(--t-medium); text-transform:uppercase; }

/* Services page */
.ss-services-page .ss-page-head { padding-top:14rem; padding-bottom:7rem; }
.ss-services-page .ss-page-head h1 { font-size:clamp(6rem,8vw,11rem) !important; }
.ss-services-page .ss-page-head > p:last-child { font-size:1.9rem; line-height:1.5; }
.ss-service-detail-section { padding:3rem 0 8rem !important; }
.ss-service-detail-row { min-height:0 !important; align-items:center !important; }
.ss-service-copy { padding:5rem 5rem 5rem 0 !important; }
.ss-service-copy h2 { font-size:clamp(4.6rem,5.8vw,8rem) !important; margin:1.5rem 0 2rem !important; }
.ss-service-copy > p:last-child { font-size:1.7rem !important; line-height:1.6 !important; }
.ss-service-tags .tag { font-size:1.15rem; padding:.65rem .9rem; }
.ss-service-media { min-height:0 !important; aspect-ratio:16/10; border-radius:.8rem !important; }
.ss-service-media > img,
.ss-service-media > video,
.ss-service-page-media { width:100%; height:100% !important; object-fit:cover; }

/* Contact CTA shared by Home/Services */
.ss-social-contact-banner {
  background:#0f0f0f !important;
  color:#EEEAE8 !important;
  padding:10rem 0 !important;
}
.ss-social-contact-banner .footer-data span,
.ss-social-contact-banner h2 { color:#EEEAE8 !important; }
.ss-social-contact-banner h2 {
  margin:1.5rem 0 2rem !important;
  max-width:90rem;
  font-size:clamp(5.6rem,7.5vw,10rem) !important;
  line-height:.88 !important;
  letter-spacing:-.06em;
}
.ss-social-contact-banner p:not(.footer-data) {
  max-width:64rem;
  color:#b8bac4 !important;
  font-size:1.7rem !important;
  line-height:1.55;
}
.ss-contact-social-list { width:100%; max-width:64rem !important; margin-left:auto; }
.ss-contact-social-list a {
  min-height:6.4rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  padding:1.6rem 0 !important;
  border-bottom:1px solid rgba(238,234,232,.28) !important;
  color:inherit;
  text-decoration:none;
  font:600 1.55rem/1.2 var(--_font-accent) !important;
}
.ss-contact-social-list a:first-child { border-top:1px solid rgba(238,234,232,.28) !important; }

/* Contact page — social rows are deliberately large and readable. */
.ss-contact-page { min-height:auto; }
.ss-contact-page-head { padding-top:15rem !important; padding-bottom:11rem !important; }
.ss-contact-page-grid { align-items:end; }
.ss-contact-page-head h1 {
  max-width:94rem;
  margin:1.5rem 0 2rem !important;
  font-size:clamp(6rem,7.6vw,11rem) !important;
  line-height:.88 !important;
  letter-spacing:-.065em !important;
}
.ss-contact-page-head .t-medium { max-width:68rem; font-size:1.8rem; line-height:1.55; }
.ss-contact-links-col { padding-left:5rem; }
.ss-contact-links-col .footer-data { margin-bottom:1.5rem; }
.ss-contact-page .ss-contact-social-list--large { max-width:none !important; margin-top:0 !important; }
.ss-contact-page .ss-contact-social-list--large a {
  min-height:7rem;
  font-size:1.65rem !important;
  color:var(--base-opp) !important;
  border-color:rgba(var(--base-opp-rgb),.3) !important;
}

/* Project detail */
.single-project .ss-project-single__hero { padding-top:15rem !important; padding-bottom:3rem !important; }
.single-project .ss-project-single__hero h1 {
  max-width:125rem;
  font-size:clamp(6rem,7.2vw,10.5rem) !important;
  line-height:.9 !important;
  letter-spacing:-.058em !important;
}
.ss-project-lead { max-width:85rem; margin-top:2rem; font-size:1.8rem; line-height:1.55; }
.ss-project-single__meta {
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:1.2rem !important;
  margin:3rem 0 2rem !important;
}
.ss-project-single__meta > div {
  padding-top:1.1rem !important;
  font-size:1.55rem !important;
  line-height:1.45 !important;
}
.ss-project-single__meta strong {
  display:block;
  margin-bottom:.55rem;
  font:600 1.15rem/1.2 var(--_font-accent) !important;
  text-transform:uppercase;
  letter-spacing:.045em;
  color:var(--t-medium);
}
.ss-project-single__meta a { color:var(--accent); text-decoration:none; }
.ss-project-single__tags { gap:.7rem !important; margin-top:1.6rem !important; }
.ss-project-single__tags .tag {
  font-size:1.15rem !important;
  padding:.65rem .9rem !important;
  border:1px solid rgba(var(--base-opp-rgb),.28) !important;
  border-radius:999px !important;
}
.ss-project-single__content { max-width:90rem; font-size:1.7rem; line-height:1.7; }
.ss-project-single__gallery { column-count:3 !important; column-gap:1rem !important; margin-top:3rem !important; }
.ss-project-gallery-item { margin:0 0 1rem !important; }
.ss-project-gallery-media { border-radius:.5rem; }
.ss-next-project { padding:9rem 0 3rem !important; }
.ss-next-project h2 { font-size:clamp(5rem,7vw,10rem) !important; }
.ss-next-project > a > span { font-size:1.5rem; }

/* Blog */
.ss-blog-page .ss-page-head { padding-top:14rem; padding-bottom:5rem; }
.ss-blog-page .ss-page-head h1 { font-size:clamp(6rem,8vw,11rem) !important; }
.ss-blog-page .ss-page-head > p:last-child { font-size:1.8rem; line-height:1.55; }
.ss-blog-meta { font-size:1.2rem !important; }
.ss-single-post-head { max-width:110rem; }
.ss-single-post-head h1 { font-size:clamp(5.2rem,7vw,9.5rem) !important; line-height:.92 !important; }
.ss-single-post-lead { font-size:1.9rem; line-height:1.55; }
.ss-single-post-layout--simple { display:block !important; max-width:88rem !important; margin:5rem auto 0 !important; }
.ss-single-post-content { font-size:1.75rem !important; line-height:1.8 !important; }
.ss-share-inline {
  max-width:88rem;
  margin:5rem auto 0;
  padding-top:2rem;
  border-top:1px solid rgba(var(--base-opp-rgb),.25);
  display:flex;
  flex-wrap:wrap;
  gap:1.2rem 2rem;
  font:600 1.25rem/1.3 var(--_font-accent);
}
.ss-share-inline a { color:inherit; text-decoration:none; }

/* FOOTER v1 — one job: ecosystem + identity. */
.ss-footer-v1 {
  background:#0f0f0f;
  color:#EEEAE8;
  padding:9rem 0 3rem;
}
.ss-footer-v1 .footer-data,
.ss-footer-v1 .footer-data span,
.ss-footer-v1 a,
.ss-footer-v1 strong,
.ss-footer-v1 h2 { color:#EEEAE8 !important; }
.ss-footer-v1__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,2fr);
  gap:3rem;
  align-items:end;
  padding-bottom:3rem;
}
.ss-footer-v1__head h2 {
  margin:0;
  font:650 clamp(4.8rem,6vw,8rem)/.92 var(--_font-default);
  letter-spacing:-.055em;
}
.ss-footer-v1__ecosystem { margin:0; padding:0; list-style:none; }
.ss-footer-v1__ecosystem li { list-style:none; }
.ss-footer-v1__ecosystem a {
  display:grid;
  grid-template-columns:7rem minmax(0,1fr) 4rem;
  align-items:center;
  gap:1rem;
  min-height:7.2rem;
  padding:1.4rem 0;
  border-top:1px solid rgba(238,234,232,.23);
  text-decoration:none;
}
.ss-footer-v1__ecosystem li:last-child a { border-bottom:1px solid rgba(238,234,232,.23); }
.ss-footer-v1__num,
.ss-footer-v1__arrow { font:500 1.3rem/1 var(--_font-accent); color:#8f929e; }
.ss-footer-v1__ecosystem strong {
  font:500 clamp(1.8rem,1.45vw,2.3rem)/1.2 var(--_font-default);
}
.ss-footer-v1__arrow { text-align:right; font-size:1.8rem; color:#EEEAE8; }
.ss-footer-v1__bottom {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:3rem;
  padding-top:4rem;
}
.ss-footer-v1__identity { display:flex; flex-direction:column; gap:.65rem; }
.ss-footer-v1__identity strong { font:750 2.3rem/1 var(--_font-default); letter-spacing:-.04em; }
.ss-footer-v1__identity span,
.ss-footer-v1__legal { color:#92949e; font-size:1.3rem; line-height:1.4; }
.ss-footer-v1__legal { display:flex; gap:2rem; align-items:center; }
.ss-footer-v1__legal a { color:#b9bbc3 !important; text-decoration:none; font-size:1.3rem; }

@media (max-width:1199px) {
  .ss-home-portfolio-grid,
  .ss-portfolio-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .ss-contact-links-col { padding-left:0; margin-top:6rem; }
  .ss-contact-page-grid { align-items:start; }
  .ss-footer-v1__head { grid-template-columns:1fr; gap:1.5rem; }
}

@media (max-width:767px) {
  .ss-brand-logo__img { max-height:5rem; }

  .ss-home-hero .mxd-hero-10__headline { padding-top:11rem !important; padding-bottom:4rem !important; }
  .ss-home-hero .hero-10-headline__wrap { padding:0 2.2rem !important; }
  .ss-home-hero .hero-10-headline__wrap h1 {
    font-size:clamp(6.4rem,20vw,9.6rem) !important;
    line-height:.76 !important;
    letter-spacing:-.07em !important;
  }
  .ss-home-name { flex-direction:column; gap:0; white-space:normal; }
  .ss-home-hero .mxd-hero-10__center { padding-left:2.2rem !important; padding-right:2.2rem !important; }
  .ss-home-hero .mxd-hero-10__divider { left:2.2rem !important; width:calc(100% - 4.4rem) !important; }
  .ss-home-hero .mxd-hero-10__descr p { font-size:3.2rem !important; line-height:1.08 !important; }

  .ss-home-work .mxd-section-title__title h2,
  .ss-home-services-v1 .mxd-section-title__title h2 { font-size:5.4rem !important; }
  .ss-home-work .mxd-section-title__title p,
  .ss-home-services-v1 .mxd-section-title__title p { font-size:1.6rem; }

  .ss-home-portfolio-grid,
  .ss-portfolio-filter-grid { grid-template-columns:1fr !important; gap:3.5rem !important; }
  .ss-project-card-media,
  .ss-home-project-media,
  .ss-portfolio-card-media { aspect-ratio:16/10 !important; }
  .ss-project-card-arrow { opacity:1; transform:none; width:4rem; height:4rem; font-size:1.5rem; }
  .ss-home-project-caption h3,
  .ss-portfolio-card-caption h2 { font-size:2.3rem !important; }
  .ss-project-meta > span,
  .ss-project-meta .tag { font-size:1.1rem !important; }

  .ss-portfolio-page .ss-page-head { padding-top:10rem; padding-bottom:3rem; }
  .ss-portfolio-page .ss-page-head h1 { font-size:5.6rem !important; line-height:.9 !important; }
  .ss-portfolio-page .ss-page-head > p:last-child { font-size:1.6rem !important; }
  .ss-portfolio-filters {
    flex-wrap:nowrap !important;
    overflow-x:auto;
    margin:0 -2rem 3rem !important;
    padding:0 2rem .8rem !important;
    scrollbar-width:none;
  }
  .ss-portfolio-filters::-webkit-scrollbar { display:none; }
  .ss-filter { flex:0 0 auto; min-height:4.4rem !important; font-size:1.25rem !important; padding:0 1.4rem !important; }

  .ss-home-services-grid { grid-template-columns:1fr; gap:4rem; margin-top:3.5rem; }
  .ss-home-service-copy h3 { font-size:3.4rem; }
  .ss-home-service-copy > p { font-size:1.55rem; }

  .ss-services-page .ss-page-head { padding-top:10rem; padding-bottom:4rem; }
  .ss-services-page .ss-page-head h1 { font-size:5.5rem !important; }
  .ss-service-detail-section { padding:1rem 0 6rem !important; }
  .ss-service-copy { padding:2rem 0 2.5rem !important; }
  .ss-service-copy h2 { font-size:4.4rem !important; }
  .ss-service-copy > p:last-child { font-size:1.6rem !important; }
  .ss-service-media { aspect-ratio:4/3; }

  .ss-social-contact-banner { padding:7rem 0 !important; }
  .ss-social-contact-banner h2 { font-size:5.4rem !important; line-height:.9 !important; }
  .ss-social-contact-banner p:not(.footer-data) { font-size:1.6rem !important; }
  .ss-social-contact-banner .ss-contact-social-list { margin-top:4rem; }
  .ss-contact-social-list a { min-height:6rem; font-size:1.5rem !important; }

  .ss-contact-page-head { padding-top:10rem !important; padding-bottom:7rem !important; }
  .ss-contact-page-head h1 { font-size:5.4rem !important; line-height:.9 !important; }
  .ss-contact-page-head .t-medium { font-size:1.6rem; }
  .ss-contact-links-col { margin-top:5rem; }
  .ss-contact-page .ss-contact-social-list--large a { min-height:6.2rem; font-size:1.55rem !important; }

  .single-project .ss-project-single__hero { padding-top:10rem !important; }
  .single-project .ss-project-single__hero h1 { font-size:4.8rem !important; line-height:.92 !important; }
  .ss-project-lead { font-size:1.6rem; }
  .ss-project-single__meta { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:1rem !important; }
  .ss-project-single__meta > div { font-size:1.45rem !important; }
  .ss-project-single__meta strong { font-size:1.05rem !important; }
  .ss-project-single__tags .tag { font-size:1.05rem !important; }
  .ss-project-single__gallery { column-count:2 !important; column-gap:.55rem !important; }
  .ss-project-gallery-item { margin-bottom:.55rem !important; }
  .ss-next-project { padding:7rem 0 2rem !important; }
  .ss-next-project h2 { font-size:4.8rem !important; }

  .ss-blog-page .ss-page-head { padding-top:10rem; }
  .ss-blog-page .ss-page-head h1 { font-size:5.6rem !important; }
  .ss-single-post-head h1 { font-size:4.8rem !important; }
  .ss-single-post-content { font-size:1.65rem !important; }
  .ss-share-inline { font-size:1.2rem; }

  .ss-footer-v1 { padding:7rem 0 2.5rem; }
  .ss-footer-v1__head h2 { font-size:4.8rem; }
  .ss-footer-v1__ecosystem a {
    grid-template-columns:4.8rem minmax(0,1fr) 3rem;
    min-height:6.5rem;
    padding:1.2rem 0;
  }
  .ss-footer-v1__ecosystem strong { font-size:1.7rem; }
  .ss-footer-v1__num { font-size:1.15rem; }
  .ss-footer-v1__bottom { flex-direction:column; align-items:flex-start; gap:2.5rem; padding-top:3.5rem; }
  .ss-footer-v1__identity strong { font-size:2rem; }
  .ss-footer-v1__identity span,
  .ss-footer-v1__legal,
  .ss-footer-v1__legal a { font-size:1.2rem !important; }
  .ss-footer-v1__legal { width:100%; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
}

/* =========================================================
   v1.1 — home editorial, servicios story-scroll y footer útil
   ========================================================= */

/* Header mobile: separar de forma clara modo claro/oscuro y menú. */
@media (max-width: 767px) {
  .mxd-header {
    left: 2.4rem !important;
    width: calc(100% - 4.8rem) !important;
    padding-top: 2.4rem !important;
  }
  .mxd-header__controls {
    position: fixed !important;
    top: 2.4rem !important;
    right: 9.8rem !important;
    padding-right: 0 !important;
    gap: 0 !important;
    z-index: 100002 !important;
  }
  .mxd-header__link { display: none !important; }
  .mxd-menu__contain {
    top: 2.4rem !important;
    right: 2.4rem !important;
    z-index: 100003 !important;
  }
}

/* Hero: el nombre respeta la marca y el copy se lee como dos ideas. */
.ss-home-name {
  text-transform: none !important;
  letter-spacing: -0.065em;
}
.ss-home-hero .ss-hero-copy { max-width: 100%; }
.ss-home-hero .ss-hero-role-main,
.ss-home-hero .ss-hero-intro {
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.ss-home-hero .ss-hero-role-main {
  max-width: 16ch;
  margin: 0 0 1.2rem;
  font-weight: 750;
}
.ss-home-hero .ss-hero-intro {
  max-width: 29ch;
  margin: 0;
  color: var(--t-medium);
  font-size: clamp(2rem, 2.1vw, 3.2rem);
  line-height: 1.18;
  letter-spacing: -0.035em;
}
.ss-home-hero .ss-hero-role { margin-top: 2.2rem; }

@media (max-width: 767px) {
  .ss-home-hero .hero-10-headline__wrap {
    overflow: visible !important;
    padding-left: 2.4rem !important;
    padding-right: 2.9rem !important;
  }
  .ss-home-hero .hero-10-headline__wrap h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(5.5rem, 16.2vw, 8.2rem) !important;
    line-height: .82 !important;
    letter-spacing: -0.065em !important;
    overflow: visible !important;
  }
  .ss-home-name {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: fit-content !important;
    max-width: 100% !important;
    padding-right: .08em;
  }
  .ss-home-name > span {
    display: block !important;
    width: fit-content;
    max-width: 100%;
  }
  .ss-home-hero .mxd-hero-10__descr { padding-right: .5rem; }
  .ss-home-hero .ss-hero-role-main {
    max-width: 15ch;
    font-size: clamp(2.7rem, 8.5vw, 3.4rem) !important;
    line-height: 1.03 !important;
    margin-bottom: 1.4rem;
  }
  .ss-home-hero .ss-hero-intro {
    max-width: 25ch;
    font-size: clamp(1.8rem, 5.7vw, 2.35rem) !important;
    line-height: 1.19 !important;
  }
}

/* HOME SERVICES: vuelve el bloque protagonista con scroll/stack de Azurio. */
.ss-home-services-story { overflow: clip; }
.ss-home-services-story .mxd-section-title__title h2 {
  font-size: clamp(5.2rem, 7vw, 10rem);
  line-height: .9;
}
.ss-services-story-stack { margin-top: 5rem; }
.ss-services-story-stack .mxd-stack-cards__card { isolation: isolate; }
.ss-services-story-stack .card__image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.42));
  pointer-events: none;
  z-index: 1;
}
.ss-services-story-stack .card__content { z-index: 3; }
.ss-services-story-stack .card__title {
  width: min(78%, 850px);
  max-width: none;
  text-decoration: none;
}
.ss-services-story-stack .card__title p {
  font-size: clamp(4rem, 7vw, 9rem);
  line-height: .9;
  letter-spacing: -.065em;
}
.ss-services-story-stack .card-description {
  width: min(82%, 780px) !important;
  margin-bottom: 8rem !important;
}
.ss-services-story-stack .card-description p {
  font-size: clamp(1.7rem, 1.5vw, 2.2rem) !important;
  line-height: 1.35;
}
.ss-services-story-stack .card__tags .tag { color: #fff; }

@media (max-width: 767px) {
  .ss-home-services-story .mxd-section-title__title h2 { font-size: 5.2rem !important; }
  .ss-services-story-stack { margin-top: 3rem; }
  .ss-services-story-stack.mxd-stack-cards { gap: 16svh; }
  .ss-services-story-stack .mxd-stack-cards__card { height: 92svh; }
  .ss-services-story-stack .mxd-stack-cards__card:nth-child(2) { margin-top: 30vh; }
  .ss-services-story-stack .card__title { width: 88%; max-width: 88%; }
  .ss-services-story-stack .card__title p {
    font-size: clamp(3.8rem, 12vw, 5.5rem) !important;
    line-height: .92 !important;
  }
  .ss-services-story-stack .card-description {
    width: 82% !important;
    margin-bottom: 12rem !important;
  }
  .ss-services-story-stack .card-description p {
    font-size: 1.55rem !important;
    line-height: 1.35 !important;
  }
  .ss-services-story-stack .card__descr { padding: 2.4rem !important; }
  .ss-services-story-stack .card__tags { align-items: flex-start !important; }
}

/* Contacto dedicado: redes visibles y claramente clickeables. */
.ss-contact-page-v11 .ss-contact-page-grid { align-items: center; }
.ss-contact-page-v11 .ss-contact-copy-col { padding-right: clamp(2rem, 5vw, 8rem); }
.ss-contact-page-v11 .ss-contact-page-head h1 {
  font-size: clamp(6rem, 8vw, 12rem);
  line-height: .9;
  letter-spacing: -.065em;
  max-width: 9ch;
}
.ss-contact-page-v11 .ss-contact-copy-col > .t-medium {
  max-width: 620px;
  font-size: clamp(1.7rem, 1.5vw, 2.2rem);
  line-height: 1.45;
}
.ss-contact-social-list--v11 { margin-top: 2rem !important; }
.ss-contact-social-list--v11 a {
  min-height: 7rem !important;
  padding: 0 1.2rem !important;
  font-size: 1.55rem !important;
  border-top: 1px solid rgba(var(--base-opp-rgb), .35) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.ss-contact-social-list--v11 a:last-child { border-bottom: 1px solid rgba(var(--base-opp-rgb), .35) !important; }
.ss-contact-social-list--v11 a:hover span:first-child { transform: translateX(.7rem); }

@media (max-width: 767px) {
  .ss-contact-page-v11 .ss-contact-page-head h1 {
    font-size: clamp(4.9rem, 14vw, 6.7rem) !important;
    max-width: 10ch;
  }
  .ss-contact-page-v11 .ss-contact-links-col { margin-top: 5rem !important; }
  .ss-contact-social-list--v11 a { min-height: 6.2rem !important; font-size: 1.45rem !important; }
}

/* Footer final: 1/2 contacto + 1/4 blog + 1/4 ecosistema. */
.ss-footer-v11 {
  background: #0f0f0f;
  color: #EEEAE8;
  padding: clamp(6rem, 8vw, 11rem) 0 2.5rem;
}
.ss-footer-v11 .footer-data,
.ss-footer-v11 .footer-data span,
.ss-footer-v11 a,
.ss-footer-v11 strong,
.ss-footer-v11 h2 { color: #EEEAE8 !important; }
.ss-footer-v11__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: clamp(3rem, 5vw, 8rem);
  align-items: start;
}
.ss-footer-v11__contact h2 {
  max-width: 8.5ch;
  margin: 1.7rem 0 1.8rem;
  font-size: clamp(5rem, 5.7vw, 9rem);
  line-height: .9;
  letter-spacing: -.065em;
  text-wrap: balance;
}
.ss-footer-v11__intro {
  max-width: 470px;
  color: #a7a9b2 !important;
  font-size: 1.65rem;
  line-height: 1.45;
}
.ss-footer-v11__socials {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1.8rem;
  margin-top: 3rem;
}
.ss-footer-v11__socials a {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  padding: .8rem 0;
  text-decoration: none;
  font: 600 1.4rem/1.2 var(--_font-accent);
}
.ss-footer-v11__postlist,
.ss-footer-v11__ecolist {
  display: flex;
  flex-direction: column;
  margin-top: 1.8rem;
}
.ss-footer-v11__postlist a,
.ss-footer-v11__ecolist a,
.ss-footer-v11__single-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  min-height: 5.4rem;
  padding: 1rem 0;
  border-top: 1px solid rgba(238,234,232,.22);
  color: #EEEAE8;
  text-decoration: none;
  font-size: 1.45rem;
  line-height: 1.25;
}
.ss-footer-v11__postlist a:last-child,
.ss-footer-v11__ecolist a:last-child { border-bottom: 1px solid rgba(238,234,232,.22); }
.ss-footer-v11__postlist a span:first-child,
.ss-footer-v11__ecolist a span:first-child { min-width: 0; }
.ss-footer-v11__postlist a:hover span:first-child,
.ss-footer-v11__ecolist a:hover span:first-child,
.ss-footer-v11__socials a:hover span:first-child { opacity: .65; }
.ss-footer-v11__bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 3rem;
  margin-top: clamp(5rem, 7vw, 9rem);
  padding-top: 2.2rem;
  border-top: 1px solid rgba(238,234,232,.22);
}
.ss-footer-v11__bottom > div:first-child {
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.ss-footer-v11__bottom strong {
  font: 750 2rem/1 var(--_font-default);
  letter-spacing: -.04em;
  text-transform: none;
}
.ss-footer-v11__bottom span,
.ss-footer-v11__bottom a {
  color: #9a9ca5 !important;
  font-size: 1.25rem;
  line-height: 1.35;
  text-decoration: none;
}
.ss-footer-v11__bottom > div:last-child { display: flex; gap: 2rem; align-items: center; }

@media (max-width: 1199px) {
  .ss-footer-v11__grid { grid-template-columns: 1.45fr 1fr; }
  .ss-footer-v11__ecosystem { grid-column: 1 / -1; }
  .ss-footer-v11__ecolist { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 2rem; }
}

@media (max-width: 767px) {
  .ss-footer-v11 { padding: 6rem 0 2rem; }
  .ss-footer-v11__grid { grid-template-columns: 1fr; gap: 5rem; }
  .ss-footer-v11__contact h2 {
    max-width: 9ch;
    font-size: clamp(4.6rem, 13.8vw, 6.4rem);
  }
  .ss-footer-v11__intro { font-size: 1.55rem; }
  .ss-footer-v11__socials { margin-top: 2.2rem; gap: .4rem 1.6rem; }
  .ss-footer-v11__socials a { font-size: 1.3rem; }
  .ss-footer-v11__postlist a,
  .ss-footer-v11__ecolist a,
  .ss-footer-v11__single-link { min-height: 5.7rem; font-size: 1.4rem; }
  .ss-footer-v11__ecosystem { grid-column: auto; }
  .ss-footer-v11__ecolist { display: flex; }
  .ss-footer-v11__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
    margin-top: 5rem;
  }
  .ss-footer-v11__bottom > div:last-child {
    width: 100%;
    justify-content: space-between;
    gap: 1rem;
  }
}


/* =========================================================
   v1.2 — typography safety + hero balance
   Evita recortes de descendentes (g, p, y, q, j) y bordes
   en títulos animados, y recompone el hero en desktop/mobile.
   ========================================================= */

/* SplitText sin mordidas: aunque una librería vuelva a crear masks,
   dejamos aire tipográfico real alrededor de cada línea/carácter. */
.line-mask,
.char-mask,
.word-mask {
  box-sizing: content-box !important;
}
.line-mask {
  padding: .04em .08em .18em .04em !important;
  margin: -.04em -.08em -.18em -.04em !important;
}
.char-mask,
.word-mask {
  padding: .03em .045em .12em .03em !important;
  margin: -.03em -.045em -.12em -.03em !important;
}
.mxd-split-lines,
.mxd-split-lines-reverse,
.loading-split,
.loading-chars,
.mxd-split-lines .line,
.mxd-split-lines-reverse .line,
.loading-split .line {
  overflow: visible !important;
}

/* Títulos grandes: un poco más de altura de línea y aire inferior.
   El efecto sigue siendo editorial, pero ya no corta glifos. */
.ss-services-page .ss-page-head h1,
.ss-service-copy h2,
.ss-blog-page .ss-page-head h1,
.ss-single-post-head h1,
.ss-contact-page-head h1,
.ss-social-contact-banner h2,
.ss-home-work .mxd-section-title__title h2,
.ss-home-services-story .mxd-section-title__title h2,
.ss-services-story-stack .card__title p,
.ss-next-project h2 {
  line-height: .98 !important;
  padding-bottom: .12em;
  margin-bottom: -.02em;
  overflow: visible !important;
}
.ss-service-copy,
.ss-services-page .ss-page-head,
.ss-blog-page .ss-page-head,
.ss-contact-page-head,
.ss-social-contact-banner,
.mxd-section-title__title,
.ss-services-story-stack .card__content,
.ss-services-story-stack .card__title {
  overflow: visible !important;
}

/* HERO DESKTOP — menos cartel, más composición. */
@media (min-width: 1200px) {
  .ss-home-hero .mxd-hero-10__headline {
    padding-top: 8.5rem !important;
    padding-bottom: 3.8rem !important;
    overflow: visible !important;
  }
  .ss-home-hero .hero-10-headline__wrap {
    padding: 0 3rem !important;
    overflow: visible !important;
  }
  .ss-home-hero .hero-10-headline__wrap h1 {
    font-size: clamp(9rem, 10.5vw, 17rem) !important;
    line-height: .84 !important;
    letter-spacing: -.066em !important;
    overflow: visible !important;
  }
  .ss-home-name {
    justify-content: flex-start;
    width: auto !important;
    gap: .14em !important;
    padding-right: .08em;
  }
  .ss-home-hero .mxd-hero-10__center {
    padding-top: 3.8rem !important;
  }
  .ss-home-hero .mxd-hero-10__data-wrap {
    flex: 0 1 62%;
    max-width: 88rem;
    margin-bottom: 0 !important;
  }
  .ss-home-hero .ss-hero-role-main {
    max-width: 19ch !important;
    font-size: clamp(3.4rem, 3.2vw, 5.2rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -.045em;
    padding-bottom: .08em;
  }
  .ss-home-hero .ss-hero-intro {
    max-width: 37ch !important;
    font-size: clamp(2.4rem, 2.3vw, 3.4rem) !important;
    line-height: 1.18 !important;
    padding-bottom: .06em;
  }
  .ss-home-hero.ss-hero-no-media .mxd-hero-10__center {
    display: block !important;
  }
  .ss-home-hero.ss-hero-no-media .mxd-hero-10__data-wrap {
    width: min(100%, 96rem);
    max-width: 96rem;
  }
}

/* HERO MOBILE — marca compacta + copy con cortes naturales. */
@media (max-width: 767px) {
  .ss-home-hero .mxd-hero-10__headline {
    padding-top: 9rem !important;
    padding-bottom: 3.2rem !important;
    overflow: visible !important;
  }
  .ss-home-hero .hero-10-headline__wrap {
    padding-left: 2.4rem !important;
    padding-right: 3.2rem !important;
    overflow: visible !important;
  }
  .ss-home-hero .hero-10-headline__wrap h1 {
    font-size: clamp(5rem, 14.6vw, 6.6rem) !important;
    line-height: .86 !important;
    letter-spacing: -.06em !important;
    overflow: visible !important;
  }
  .ss-home-name {
    width: max-content !important;
    max-width: calc(100vw - 5.6rem) !important;
    padding-right: .12em !important;
  }
  .ss-home-name > span {
    width: max-content !important;
    max-width: 100% !important;
    padding-right: .04em;
  }
  .ss-home-hero .mxd-hero-10__center {
    padding: 3.2rem 2.4rem 4rem !important;
  }
  .ss-home-hero .mxd-hero-10__divider {
    left: 2.4rem !important;
    width: calc(100% - 4.8rem) !important;
  }
  .ss-home-hero .mxd-hero-10__data-wrap {
    width: 100% !important;
    max-width: none !important;
    margin-bottom: 0 !important;
  }
  .ss-home-hero .mxd-hero-10__descr {
    width: 100% !important;
    max-width: none !important;
    padding-right: 0 !important;
  }
  .ss-home-hero .ss-hero-role-main {
    width: min(100%, 29rem) !important;
    max-width: none !important;
    font-size: clamp(2.9rem, 8.2vw, 3.45rem) !important;
    line-height: 1.03 !important;
    letter-spacing: -.042em !important;
    padding-bottom: .09em;
    margin-bottom: 1.5rem !important;
    text-wrap: balance;
  }
  .ss-home-hero .ss-hero-intro {
    width: min(100%, 31.5rem) !important;
    max-width: none !important;
    font-size: clamp(1.95rem, 5.45vw, 2.25rem) !important;
    line-height: 1.2 !important;
    letter-spacing: -.025em !important;
    text-wrap: pretty;
    padding-bottom: .08em;
  }
  .ss-home-hero .ss-hero-role {
    margin-top: 2.5rem !important;
  }
  .ss-home-hero .ss-hero-role .tag {
    font-size: 1.15rem !important;
    letter-spacing: .08em;
  }
}

/* En pantallas muy angostas, evitamos cualquier roce con el borde derecho. */
@media (max-width: 380px) {
  .ss-home-hero .hero-10-headline__wrap h1 {
    font-size: 5rem !important;
  }
  .ss-home-hero .ss-hero-role-main {
    width: 27rem !important;
    font-size: 2.85rem !important;
  }
  .ss-home-hero .ss-hero-intro {
    width: 29rem !important;
    font-size: 1.9rem !important;
  }
}

/* BLOG / SERVICIOS / CONTACTO — títulos grandes que entran en viewport. */
@media (max-width: 767px) {
  .ss-blog-page .ss-page-head h1,
  .ss-services-page .ss-page-head h1,
  .ss-contact-page-v11 .ss-contact-page-head h1 {
    font-size: clamp(4.4rem, 12.8vw, 5.6rem) !important;
    line-height: 1 !important;
    letter-spacing: -.055em !important;
    max-width: 100% !important;
    overflow: visible !important;
  }
  .ss-service-copy h2 {
    font-size: clamp(3.9rem, 11.3vw, 5rem) !important;
    line-height: 1 !important;
    letter-spacing: -.055em !important;
    overflow: visible !important;
  }
  .ss-services-story-stack .card__title p {
    line-height: .98 !important;
  }
}

/* Último seguro de borde del hero: el enlace de marca no recorta el último glifo. */
.ss-home-hero .hero-10-headline__wrap h1 > a,
.ss-home-hero .hero-10-headline__content {
  overflow: visible !important;
  padding-right: .12em;
  box-sizing: border-box;
}


/* =========================================================
   v1.3 — mobile gutters / respiración
   Azurio usa grid-l-container edge-to-edge en mobile. Para el sitio
   de Seba Sereno, las secciones editoriales necesitan un gutter
   consistente para que texto, filtros, tarjetas y footer no queden
   pegados a los bordes del viewport.
   ========================================================= */

@media (max-width: 767px) {
  :root { --ss-mobile-gutter: 2.4rem; }

  html, body {
    max-width: 100%;
    overflow-x: clip;
  }

  /* La mayoría de nuestras páginas usan grid-l-container. En Azurio
     original este contenedor es full-bleed en mobile; acá lo hacemos
     editorial con 24px reales de aire a cada lado. */
  .mxd-container.grid-l-container,
  .mxd-container.grid-s-container {
    padding-left: var(--ss-mobile-gutter) !important;
    padding-right: var(--ss-mobile-gutter) !important;
  }

  /* El hero tiene estructura propia: mantenemos exactamente el mismo
     gutter visual que el resto del sitio. */
  .ss-home-hero .hero-10-headline__wrap {
    padding-left: var(--ss-mobile-gutter) !important;
    padding-right: var(--ss-mobile-gutter) !important;
  }
  .ss-home-hero .mxd-hero-10__center {
    padding-left: var(--ss-mobile-gutter) !important;
    padding-right: var(--ss-mobile-gutter) !important;
  }
  .ss-home-hero .mxd-hero-10__divider {
    left: var(--ss-mobile-gutter) !important;
    width: calc(100% - (var(--ss-mobile-gutter) * 2)) !important;
  }
  .ss-home-name {
    max-width: calc(100vw - (var(--ss-mobile-gutter) * 2)) !important;
  }

  /* Portfolio: los filtros ya no "sangran" fuera del gutter. Siguen
     teniendo scroll horizontal si hay muchas categorías. */
  .ss-portfolio-filters {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    scroll-padding-left: 0;
  }
  .ss-portfolio-filter-grid,
  .ss-home-portfolio-grid {
    width: 100%;
  }

  /* Páginas y fichas: asegurar que títulos, metadatos y copys nunca
     toquen el borde aunque alguna regla heredada use width:100vw. */
  .ss-page-head,
  .ss-service-copy,
  .ss-project-single__hero,
  .ss-project-single__meta,
  .ss-project-single__tags,
  .ss-single-post-head,
  .ss-single-post-content,
  .ss-contact-page-grid,
  .ss-footer-v11__grid,
  .ss-footer-v11__bottom {
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Servicios story-scroll siguen siendo protagonistas, pero con un
     pequeño marco lateral: no parecen pegados al vidrio del teléfono. */
  .ss-home-services-story .mxd-container.fullwidth-container {
    padding-left: 1.2rem !important;
    padding-right: 1.2rem !important;
  }
  .ss-services-story-stack .mxd-stack-cards__card,
  .ss-services-story-stack .card__wrapper {
    border-radius: 1.2rem;
  }

  /* Contacto/footer con lectura más cómoda. */
  .ss-contact-social-list--v11,
  .ss-footer-v11__postlist,
  .ss-footer-v11__ecolist {
    width: 100%;
    min-width: 0;
  }

  /* Un poco más de aire vertical en cabeceras internas. */
  .ss-portfolio-page .ss-page-head,
  .ss-services-page .ss-page-head,
  .ss-blog-page .ss-page-head,
  .ss-contact-page-head {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media (max-width: 380px) {
  :root { --ss-mobile-gutter: 2rem; }
}