@font-face {
  font-family:Manrope;
  src:url("manrope-latin.woff2") format("woff2");
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
}
dialog{width:min(560px,calc(100% - 28px));max-height:calc(100% - 30px);max-height:calc(100dvh - 30px);padding:0;border:1px solid var(--line);border-radius:.95rem;background:var(--paper);color:var(--ink);box-shadow:0 20px 90px #10271f55;overflow:hidden}
dialog::backdrop{background:#071a13b8}
.modal-layout{display:flex;flex-direction:column;max-height:inherit}
.modal-top,.modal-bottom{padding:1rem 1.4rem;flex:none}
.modal-top{border-bottom:1px solid var(--line)}
.modal-topline{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.modal-topline h2{font-size:1.45rem}
.icon-button{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);background:var(--white);border-radius:.45rem;color:var(--ink);font-size:1.5rem;line-height:1;flex:none}
.progress-label{margin:.44rem 0 .24rem;color:var(--muted);font-size:.8rem;font-weight:600}
progress{display:block;width:100%;height:.34rem;border:0;accent-color:var(--green)}
.modal-body{overflow:auto;overscroll-behavior:contain;padding:1.28rem 1.4rem;min-height:0}
.modal-body h3{margin-bottom:.65rem}
.modal-body h3:focus{outline:none}
.modal-body:focus-visible{outline-offset:-4px}
.modal-help{color:var(--muted);font-size:.9rem;margin-bottom:.85rem}
fieldset{padding:0;margin:0;border:0;min-width:0}
.choice-grid{display:grid;gap:.43rem}
.areas{grid-template-columns:repeat(2,minmax(0,1fr))}
.choice{display:flex;align-items:center;gap:.52rem;min-height:44px;padding:.52rem .65rem;border:1px solid var(--line);border-radius:.43rem;background:var(--white);cursor:pointer;line-height:1.2}
.choice:has(:checked){border-color:var(--green);background:#e8f1df}
.choice input{accent-color:var(--green);width:1rem;height:1rem;flex:none;margin:0}
.field-label{display:block;font-weight:600;margin-bottom:.36rem}
.field-label small{font-weight:500;color:var(--muted)}
.field + .field{margin-top:.85rem}
.field input,.field textarea{width:100%;padding:.63rem .7rem;background:var(--white);border:1px solid #819388;border-radius:.42rem;color:var(--ink)}
.field textarea{min-height:112px;resize:vertical}
.modal-bottom{display:flex;align-items:center;justify-content:space-between;gap:.7rem;border-top:1px solid var(--line)}
.modal-bottom .primary{margin-left:auto}
.inline-note,.toast{background:#e6efdd;color:#1b3828;border:1px solid #a6bda8;border-radius:.55rem;padding:.72rem .85rem;font-size:.87rem}
.inline-note{margin-top:.7rem}
.error{color:#932b29;padding:.55rem 1.4rem;font-size:.87rem;border-top:1px solid var(--line);flex:none}
.message-preview{padding:.88rem;background:var(--white);border:1px solid var(--line);border-radius:.55rem;white-space:pre-wrap;overflow-wrap:anywhere}
.toast{position:fixed;bottom:14px;right:14px;left:auto;width:min(420px,calc(100% - 28px));display:flex;align-items:center;justify-content:space-between;gap:.6rem;box-shadow:0 6px 26px #10271f25;z-index:1}
.toast .icon-button{background:transparent}

:root {
  --paper:#fff; --white:#fff; --surface:#f7f8f7; --warm:#eee8df; --ink:#181b18;
  --muted:#535950; --line:#dce1da; --brand-green:#2a8b00;
  --green:#245f19; --dark:#151c15; --lime:#b8eaa7;
  --width:1140px; --header-height:62px;
}
*,*::before,*::after {box-sizing:border-box}
html {scroll-padding-top:calc(var(--header-height) + 16px)}
body {margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 Manrope,system-ui,-apple-system,"Segoe UI",sans-serif}
body:has(dialog[open]) {overflow:hidden}
h1,h2,h3,p,figure {margin:0}
h1,h2,h3 {line-height:1.09}
h1 {font-size:clamp(2.12rem,10vw,5.75rem);font-weight:600;letter-spacing:-.028em}
h2 {font-size:clamp(1.85rem,5.35vw,3.25rem);font-weight:600;letter-spacing:-.02em}
h3 {font-size:clamp(1.22rem,3.6vw,1.78rem);font-weight:600;letter-spacing:-.013em}
strong {font-weight:600}
button,input,textarea {font:inherit}
button {cursor:pointer}
a {color:inherit}
img {display:block;max-width:100%;height:auto}
[hidden] {display:none!important}
:focus-visible {outline:3px solid var(--green);outline-offset:4px}
section[tabindex="-1"]:focus,main[tabindex="-1"]:focus {outline:none}
.wrap {width:min(var(--width),calc(100% - 36px));margin-inline:auto}
.skip {position:fixed;top:8px;left:8px;z-index:8;background:#fff;padding:12px;transform:translateY(-180%)}
.skip:focus {transform:none}
.eyebrow {color:var(--green);font-size:.73rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase}
.lede {color:var(--muted);font-size:clamp(1.04rem,2.4vw,1.24rem);max-width:47ch}
.button {display:inline-flex;justify-content:center;align-items:center;gap:.6rem;min-height:48px;padding:.72rem 1.16rem;border:1px solid transparent;border-radius:999px;text-decoration:none;font-size:.94rem;font-weight:600;line-height:1.2;text-align:center;transition:background-color .16s,color .16s,border-color .16s}
.primary {background:#1e241d;color:#fff}
.primary:hover {background:#315030}
.secondary {background:transparent;border-color:#a7b0a4;color:var(--ink)}
.secondary:hover {background:#eff3ed;border-color:#688065}
.actions {display:flex;flex-wrap:wrap;gap:.55rem}
.text-link {display:inline-flex;align-items:center;gap:.42rem;min-height:44px;color:var(--green);font-size:.93rem;font-weight:600;text-decoration:none}
.text-link:hover {text-decoration:underline}
.review-note {padding:.58rem 0;text-align:center;color:var(--muted);font-size:.73rem;background:var(--surface)}
header {
  position:sticky;
  top:0;
  z-index:3;
  background:#fff;
  border-bottom:1px solid rgb(24 27 24 / 8%);
  transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
header.is-scrolled {
  border-bottom-color:rgb(24 27 24 / 10%);
  box-shadow:0 6px 18px rgb(24 27 24 / 9%);
}
.header-inner {display:flex;min-height:var(--header-height);align-items:center;justify-content:space-between;gap:12px}
.brand {display:inline-flex;align-items:center;gap:.52rem;min-height:44px;text-decoration:none;font-size:.94rem;font-weight:600;letter-spacing:-.015em;line-height:1.15}
.brand img {width:clamp(124px,21vw,164px);height:auto;flex:none}
.desktop-nav {display:none}
.menu-toggle {width:44px;height:44px;display:grid;place-items:center;cursor:pointer;border:0;background:transparent;border-radius:50%;color:var(--ink)}
.menu-toggle:hover,.menu-toggle[aria-expanded="true"] {background:var(--surface)}
.mobile-nav svg {width:23px;height:23px}
.menu-toggle[aria-expanded="true"] .menu-lines,.menu-toggle[aria-expanded="false"] .menu-cross {display:none}
.mobile-panel {position:absolute;inset:100% 0 auto;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 20px #111a1312;display:grid;max-height:calc(100dvh - var(--header-height));overflow:auto;padding:8px max(18px,calc((100% - var(--width))/2)) 14px}
.mobile-panel a,.desktop-nav a {display:flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:none;font-weight:600}
.mobile-panel a {padding-inline:8px;border-bottom:1px solid var(--line)}
.mobile-panel a:last-child {border:0}
.mobile-panel a:hover,.desktop-nav a:hover {color:var(--green)}
.hero h1 {margin:.7rem 0 .9rem}
.hero h1 span {display:block}
.hero .lede {margin-inline:auto}
.hero .actions {margin:1.15rem auto 0;justify-content:center}
.hero .text-link {margin-top:.25rem}
.section {padding-block:50px}
.section-head {margin-bottom:1.35rem}
.section-head h2,.about h2 {margin:.5rem 0 .78rem}
.case-copy {min-width:0}
.method {border-bottom:1px solid var(--line)}
.method-steps {list-style:none;margin:0;padding:0}
.method-steps li {position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);gap:1rem;padding-bottom:1.3rem}
.method-steps li:last-child {padding-bottom:0}
.method-steps li:not(:last-child)::before {content:"";position:absolute;top:38px;bottom:0;left:18px;border-left:1px solid var(--line)}
.method-index {position:relative;display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--green);font-size:.76rem;font-weight:600;font-variant-numeric:tabular-nums}
.method-steps h3 {margin:.14rem 0 .3rem;font-size:1.13rem}
.method-steps p {color:var(--muted);font-size:.94rem}
.about-grid {display:grid;gap:1.5rem}
.about-copy {max-width:52ch}
.about p.profile-role {color:var(--ink);font-weight:600;margin-bottom:.7rem}
.about .profile-description + .profile-description {margin-top:.5rem}
.closing {background:var(--warm);color:var(--ink);text-align:center}
.closing h2 {max-width:17ch;margin:.65rem auto 1.2rem;font-size:clamp(2.1rem,7.15vw,4.15rem)}
.closing .actions {justify-content:center}
.closing .secondary {border-color:#6f756c}
@media (max-width:375px) {
  .hero .actions,.closing .actions {flex-direction:column;align-items:stretch}
  .modal-top,.modal-bottom,.modal-body,.error {padding-inline:1rem}
}
@media (min-width:850px) {
  :root {--header-height:68px}
  .wrap {width:min(var(--width),calc(100% - 80px))}
  .brand {font-size:1rem}
  .mobile-nav {display:none}
  .desktop-nav {display:flex;gap:clamp(14px,2.3vw,34px)}
  .desktop-nav a {font-size:.85rem}
  .hero .actions {margin-top:1.55rem}
  .section {padding-block:clamp(62px,7.3vw,101px)}
  .section-head {margin-bottom:1.95rem}
  .about-grid {align-items:center;gap:clamp(24px,6vw,90px)}
}
@media (min-width:850px) {
  .method-steps {position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
  .method-steps::before {content:"";position:absolute;top:18px;left:18px;right:calc(20% - 18px);border-top:1px solid var(--line)}
  .method-steps li {display:block;padding:0 1rem 0 0}
  .method-steps li:not(:last-child)::before {display:none}
  .method-steps h3 {margin-top:.9rem}
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* Shared styles for the institutional pages and service entries. */
.desktop-nav [aria-current="page"], .mobile-panel [aria-current="page"],
.desktop-nav .nav-parent, .mobile-panel .nav-parent {
  color:var(--green);
  text-decoration:underline;
  text-decoration-color:var(--brand-green);
  text-decoration-thickness:3px;
  text-underline-offset:.38em;
}
.mobile-panel a:last-of-type {border-bottom:1px solid var(--line)}
.mobile-idea {min-height:44px;text-align:left;border:0;background:none;padding:0 8px;color:var(--green);font-weight:600}
button.text-link {background:none;border:0;padding:0}
.footer-actions,.editorial-links {display:flex;align-items:baseline;flex-wrap:wrap;gap:0 1.25rem}
.editorial-links {margin-top:.55rem}
.page-intro {padding-block:clamp(2.1rem,6vw,5.5rem) clamp(2.5rem,6vw,5.75rem)}
.page-intro h1 {max-width:20ch;margin:.38rem 0 .68rem;font-size:clamp(2.05rem,5.45vw,3.72rem)}
.page-intro + .section {padding-top:clamp(2rem,4vw,4.1rem)}
.home-services .section-head {margin-bottom:1.2rem}
.service-icon {width:54px;height:54px;object-fit:contain;object-position:left center;margin-bottom:.65rem}
.service-hero-icon {width:76px;height:76px;margin-bottom:.85rem}
.service-details {display:grid;gap:1.7rem;padding-bottom:clamp(2.8rem,7vw,6rem)}
.service-details section {max-width:60ch;border-top:1px solid var(--line);padding-top:1.15rem}
.service-details h2,.contact-channels h3 {margin-bottom:.55rem;font-size:clamp(1.32rem,3vw,1.85rem);font-weight:600}
.service-details .editorial-links {margin-top:0}
.method-summary .text-link {margin-top:.9rem}
.about h2 {font-size:clamp(1.8rem,4.8vw,3.05rem)}
.contact-channels {display:grid;gap:1.3rem 2rem}
.contact-channels > div {padding-top:1.1rem;border-top:1px solid var(--line)}
.contact-channels p {margin-bottom:.8rem}
.contact-channels .editorial-links {margin:0;display:grid}
.closing h2 {margin-top:0}
@media (min-width:720px) {
  .contact-channels {grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* Aprobación visual V3. Los recortes y las líneas se sirven como archivos originales. */
.visual-art {display:block;min-width:0;overflow:hidden;border-radius:16px;background:var(--surface)}
.visual-art img {width:100%;height:auto}
.hero-copy {min-width:0}

.service-map {position:relative;--point-rise:clamp(28px,9vw,110px)}
.service-map-links {list-style:none;margin:0;padding:0}
.service-point {position:absolute;left:var(--point-x);top:calc(var(--point-y) - var(--point-rise));width:27%;transform:translateX(-50%);text-align:center}
.service-point a {display:inline-flex;align-items:flex-start;justify-content:center;width:100%;min-height:calc(44px + var(--point-rise));padding:calc(var(--point-rise) + .13rem) .24rem .3rem;border-radius:4px;color:var(--ink);font-size:clamp(.75rem,2.8vw,.94rem);font-weight:550;line-height:1.17;text-decoration:none}
.service-point a:hover {color:var(--green);text-decoration:underline;text-underline-offset:.18em}
.service-index-link,.project-index-link {margin-top:.6rem}
.service-definitions {display:grid;gap:0 1.5rem;margin:1.6rem 0 0}
.service-definitions > div {padding:.9rem 0;border-top:1px solid var(--line)}
.service-definitions dt {font-size:1.08rem;font-weight:550;line-height:1.25}
.service-definitions dd {margin:.35rem 0 0;color:var(--muted);font-size:.94rem}

.project-grid {display:grid;gap:1.5rem 1.65rem}
.project-grid .case {min-width:0}
.project-grid .case-copy {padding:.8rem 0 .15rem}
.project-grid .case-copy .eyebrow {font-size:.68rem;color:var(--green)}
.project-grid .case-copy p,.about p:not(.eyebrow) {color:var(--muted);font-size:.94rem}
.project-grid .case-copy h3 {margin:.34rem 0 .52rem;font-size:clamp(1.26rem,2.3vw,1.78rem)}
.feature-visual {width:min(980px,calc(100% - 36px))}
.feature-visual + .section {padding-top:clamp(2rem,5vw,4.6rem)}
.case-details {padding-top:clamp(2rem,5vw,4.6rem)}

.about-visual {width:100%}
.contact-signature {display:block;width:min(200px,100%);margin-top:.75rem}
.contact-signature img {width:100%;height:auto}
.contact-intro {padding-bottom:1.35rem}
.contact-intro h1 {max-width:19ch;margin:.45rem 0 .75rem;font-size:clamp(2.2rem,7.2vw,5rem)}
.contact-section h2 {font-size:clamp(2.18rem,7vw,4.3rem)}
@media (min-width:640px) {
  .service-point {width:17%}
  .service-point a {font-size:clamp(.83rem,1.65vw,1.04rem)}
  .service-definitions,.project-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-signature {width:300px}
}
@media (min-width:850px) {
  .hero .lede {margin-inline:0}
  .hero .actions {justify-content:flex-start;margin-inline:0}
  .visual-art {border-radius:22px}
  .project-grid {row-gap:1.9rem}
  .about-grid {grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
  .feature-visual {width:min(980px,calc(100% - 80px))}
  .contact-intro {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);align-items:center;column-gap:2rem}
  .contact-intro > :not(.contact-signature) {grid-column:1}
  .contact-signature {grid-column:2;grid-row:2/4;justify-self:end;margin-top:0;max-width:100%}
}
@media (min-width:1000px) {
  .service-definitions {grid-template-columns:repeat(3,minmax(0,1fr))}
  .contact-signature {width:400px}
}

.service-point--fotografia { --point-x:20.56%; --point-y:51.45%; }
.service-point--contenido { --point-x:46.94%; --point-y:81.85%; }
.service-point--marketing-digital { --point-x:77.78%; --point-y:51.77%; }
.service-point--desarrollo-web { --point-x:49.17%; --point-y:50.56%; }
.service-point--ia-aplicada { --point-x:76.53%; --point-y:85.32%; }

@media (min-width:640px) {
  .service-point--fotografia { --point-x:17.04%; --point-y:45.42%; }
  .service-point--contenido { --point-x:32.13%; --point-y:81.39%; }
  .service-point--marketing-digital { --point-x:67.5%; --point-y:45.35%; }
  .service-point--desarrollo-web { --point-x:50.0%; --point-y:75.35%; }
  .service-point--ia-aplicada { --point-x:81.94%; --point-y:79.65%; }
}

@media (min-width:1000px) {
  .service-point--fotografia { --point-x:19.31%; --point-y:48.06%; }
  .service-point--contenido { --point-x:32.5%; --point-y:82.25%; }
  .service-point--marketing-digital { --point-x:67.01%; --point-y:47.38%; }
  .service-point--desarrollo-web { --point-x:50.0%; --point-y:76.0%; }
  .service-point--ia-aplicada { --point-x:80.56%; --point-y:79.56%; }
}
/* Portadas a sangre con arte de fondo y contenido HTML en primer plano. */
.header-inner .brand {min-width:44px}
.header-inner .brand img {width:clamp(28px,3vw,35px)}
footer {padding-block:clamp(1.55rem,4vw,3rem);background:#101010;color:#fff}
footer .brand img {width:clamp(112px,12vw,144px);filter:brightness(0) invert(1)}
footer .text-link {color:#fff}
footer p {color:#c9c9c9}
footer :focus-visible {outline-color:#b8eaa7}

.backdrop-stage {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:var(--stage-color,#fff);
  padding-bottom:var(--stage-space);
}
.backdrop-stage--hero {--stage-color:#e9e2df;--stage-space:clamp(9rem,52vw,22rem)}
.backdrop-stage--method {--stage-color:#f8f5f3;--stage-space:clamp(9rem,65vw,21rem)}
.backdrop-stage--projects,.backdrop-stage--services {
  --stage-color:#e9e2dc;
  --stage-space:clamp(10rem,57vw,25rem);
}
.backdrop-stage--hero .hero-copy {padding-top:clamp(2.4rem,6vw,4.6rem);text-align:center}
.backdrop-stage .page-intro {padding-block:clamp(1.9rem,4.3vw,3.65rem) .95rem}
.backdrop-stage--hero h1 {font-size:clamp(2.2rem,9.8vw,4.35rem)}
.backdrop-art {
  position:absolute;
  z-index:-1;
  inset:auto 0 0;
  pointer-events:none;
}
.backdrop-art img {width:100%;height:auto}
.backdrop-art::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,var(--stage-color,#fff),transparent 30%);
}
.backdrop-stage--hero .secondary {background:#fff9;border-color:#687365}
.backdrop-stage--hero .secondary:hover {background:#fff}


@media (min-width:640px) {
  .backdrop-stage--method {--stage-space:clamp(14.5rem,45vw,21rem)}
  .backdrop-stage--projects,.backdrop-stage--services {--stage-space:clamp(19rem,59vw,34rem)}
}
@media (min-width:850px) {
  .hero .actions {justify-content:center;margin-inline:auto}
}
@media (min-width:1000px) {
  .backdrop-stage {
    display:grid;
    align-items:center;
    min-height:var(--stage-height);
    padding-block:2rem;
  }
  .backdrop-stage--hero {--stage-height:clamp(32rem,46vw,45rem);--stage-ratio:1.5}
  .backdrop-stage--method {--stage-height:clamp(23.5rem,32vw,32rem);--stage-ratio:1.8}
  .backdrop-stage--projects,.backdrop-stage--services {--stage-height:clamp(25rem,37vw,33.33rem);--stage-ratio:1.5}
  .backdrop-art {
    inset:0 0 0 auto;
    width:min(100%,calc(var(--stage-height) * var(--stage-ratio)));
  }
  .backdrop-art img {height:100%;object-fit:cover;object-position:right center}
  .backdrop-art::after {background:linear-gradient(90deg,var(--stage-color,#fff),transparent 43%)}
  .backdrop-stage--hero .hero-copy,.backdrop-stage .page-intro {padding-block:1rem;text-align:left}
  .backdrop-stage--hero h1 {font-size:clamp(2.7rem,4.35vw,4.4rem)}
  .backdrop-stage--hero .hero-copy .lede {max-width:34ch;margin-inline:0}
  .hero .actions {justify-content:flex-start;margin-inline:0}
  .backdrop-stage .page-intro .lede {max-width:34ch}
}
@supports ((backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px))) {
  header {
    background:rgb(255 255 255 / 93%);
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
  }
  header.is-scrolled {background:rgb(255 255 255 / 71%)}
}
.header-inner .brand img {width:clamp(30px,3.2vw,37px)}
.desktop-nav a,.mobile-panel a {transition:color .16s ease}
.mobile-panel {border-bottom-color:#e9ede7}
.footer-inner {display:grid;gap:1.05rem 2rem}
.footer-inner .brand {justify-self:start}
.footer-nav {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.25rem}
.footer-nav a {display:flex;align-items:center;min-height:44px;font-size:.89rem;text-decoration:none}
.footer-nav a:hover,.footer-actions .text-link:hover {color:#b8eaa7;text-decoration:underline}
.footer-copyright {font-size:.78rem}
.footer-actions {align-items:center;gap:0 1rem}
@media (min-width:760px) {
  .footer-inner {grid-template-columns:minmax(11rem,1fr) minmax(16rem,1fr) minmax(7rem,.6fr);align-items:start}
  .footer-inner .brand {grid-area:1 / 1}
  .footer-copyright {grid-area:2 / 1;align-self:end}
  .footer-nav {grid-area:1 / 2 / 3 / 3}
  .footer-actions {grid-area:1 / 3 / 3 / 4;display:grid;justify-items:start;justify-self:end}
}

.case-media {
  display:grid;
  place-items:center;
  aspect-ratio:16 / 10;
  padding:clamp(.48rem,1.1vw,.85rem);
  border:1px solid #e7ebe5;
  border-radius:clamp(12px,1.45vw,18px);
  background:#f7f9f6;
}
.case-media img {width:100%;height:100%;object-fit:contain;min-height:0}
.home-services + .projects,.backdrop-stage--services + .services-overview {padding-top:clamp(1.75rem,4vw,3.7rem)}

.services-overview .service-map {
  width:min(100%,850px);
  margin-inline:auto;
}
.backdrop-stage--about {--stage-space:clamp(10rem,70vw,23rem)}
.backdrop-stage--about .page-intro .lede {max-width:36ch}
.about-detail .about-copy {max-width:62ch}
.about-detail {padding-top:clamp(2.2rem,4.5vw,4.1rem)}
@media (min-width:640px) {
  .backdrop-stage--about {--stage-space:clamp(16rem,51vw,26rem)}
}
@media (min-width:1000px) {
  .backdrop-stage--about {--stage-height:clamp(25rem,34vw,32rem);--stage-ratio:1.8}
  .services-overview .service-map {--point-rise:clamp(42px,6vw,83px)}
}

/* Portadas editoriales: una sola superficie entre el texto y la imagen. */
.backdrop-stage--immersive {
  --stage-color:var(--warm);
  --stage-space:clamp(10.5rem,58vw,25rem);
}
.backdrop-stage--immersive .backdrop-art::after {
  background:linear-gradient(180deg,var(--stage-color),rgb(238 232 223 / 84%) 10%,transparent 34%);
}
.about-detail .about-grid {justify-items:start}
.about-portrait {width:min(100%,250px);background:#f7faf5}
@media (min-width:640px) {
  .backdrop-stage--immersive {--stage-space:clamp(20rem,59vw,34rem)}
}
@media (min-width:760px) {
  .about-detail .about-grid {
    grid-template-columns:minmax(0,62ch) minmax(190px,300px);
    align-items:center;
    gap:clamp(1.5rem,5.5vw,5rem);
  }
  .about-portrait {width:100%}
}
@media (min-width:1000px) {
  .backdrop-stage--immersive {
    --stage-height:clamp(27rem,40vw,42rem);
    --art-y:51%;
  }
  .backdrop-stage--hero.backdrop-stage--immersive {
    --stage-height:clamp(34rem,46vw,46rem);
    --art-y:57%;
  }
  .backdrop-stage--projects.backdrop-stage--immersive {
    --stage-height:clamp(27rem,42vw,44rem);
    --art-y:24%;
  }
  .backdrop-stage--about.backdrop-stage--immersive {--art-y:43%}
  .backdrop-stage--about.backdrop-stage--immersive h1 {max-width:13ch}
  .backdrop-stage--immersive .backdrop-art {inset:0;width:100%}
  .backdrop-stage--immersive .backdrop-art img {
    position:absolute;
    right:-9%;
    object-position:center var(--art-y);
  }
  .backdrop-stage--projects.backdrop-stage--immersive .backdrop-art img {
    right:0;
    width:86%;
  }
  .backdrop-stage--immersive .backdrop-art::after {
    background:linear-gradient(90deg,
      var(--stage-color) 15%,rgb(238 232 223 / 97%) 22%,
      rgb(238 232 223 / 82%) 32%,rgb(238 232 223 / 30%) 48%,
      transparent 64%);
  }
}