:root { --paper:#fafaf8; --ink:#191919; --muted:#60605c; --line:#d7d7d2; --accent:#283999; --accent-light:#bcc6f1; --space:clamp(24px,5vw,88px); --sans:Arial,Helvetica,sans-serif; --serif:Georgia,'Times New Roman',serif; }
* { box-sizing:border-box; letter-spacing:0; }
html { scroll-behavior:smooth; scroll-padding-top:104px; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.6 var(--sans); }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; cursor:pointer; }
img { display:block; width:100%; height:auto; }
figure,p,h1,h2,h3 { margin:0; }
p { max-width:65ch; }
a,button,summary { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid var(--accent-light); outline-offset:5px; }
::selection { background:var(--accent); color:#fff; }
em { font-family:var(--serif); font-weight:400; }
h2 { font-size:72px; font-weight:500; line-height:1.08; }
.section { padding:76px var(--space); }
.section-label { display:flex; justify-content:space-between; gap:24px; border-top:1px solid var(--line); padding:18px 0 26px; font-size:12px; }
.section-label>span:first-child { font-size:20px; font-weight:600; line-height:1.4; flex-shrink:0; }
.eyebrow { font-size:12px; }
.skip-link { position:fixed; left:20px; top:-100px; background:white; padding:12px; z-index:100; }
.skip-link:focus { top:12px; }
.header { height:84px; padding:0 var(--space); display:flex; align-items:center; justify-content:space-between; position:fixed; top:0; width:100%; z-index:20; background:var(--paper); border-bottom:1px solid var(--line); }
.header nav { display:flex; align-items:center; gap:32px; font-size:14px; }
.header nav a { padding:12px 0; }
.header nav>a[href="#contacto"] { color:var(--accent); }
.header nav a:hover { text-decoration:underline; text-underline-offset:7px; }
.menu-toggle { border:0; background:none; padding:10px; width:48px; height:48px; display:grid; place-items:center; }
.hamburger { position:relative; display:block; width:26px; height:20px; }
.hamburger span { position:absolute; left:0; width:26px; height:2px; background:currentColor; transform-origin:center; transition:transform .3s ease,opacity .2s ease; }
.hamburger span:nth-child(1) { top:1px; }
.hamburger span:nth-child(2) { top:9px; }
.hamburger span:nth-child(3) { top:17px; }
.menu-toggle[aria-expanded="true"] .hamburger span:nth-child(1) { transform:translateY(8px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .hamburger span:nth-child(2) { opacity:0; transform:scaleX(0); }
.menu-toggle[aria-expanded="true"] .hamburger span:nth-child(3) { transform:translateY(-8px) rotate(-45deg); }
.menu-socials { display:none; }
[hidden] { display:none!important; }
.brand-logo { display:block; flex-shrink:0; position:relative; overflow:hidden; }
.brand-logo img { position:absolute; max-width:none; width:131.82%; height:auto; left:-16.12%; top:-61.24%; }
/* El alfa del PNG original conserva la silueta y el antialiasing, sin filtros de color aproximados. */
@supports (mask-image:url("")) or (-webkit-mask-image:url("")) {
  .brand-logo img { opacity:0; }
  .brand-logo::before {
    content:""; position:absolute; width:131.82%; aspect-ratio:1;
    left:-16.12%; top:-61.24%; background:var(--accent);
    -webkit-mask:url("../assets/images/logo%20en%20png.png") center / contain no-repeat;
    mask:url("../assets/images/logo%20en%20png.png") center / contain no-repeat;
  }
}
.header-logo { width:108px; height:72px; }
.footer-logo { width:96px; height:64px; }
.site-arrow { display:inline-flex; width:24px; height:24px; flex-shrink:0; vertical-align:middle; align-items:center; justify-content:center; }
.site-arrow svg { display:block; width:100%; height:100%; }
.site-arrow-up svg { transform:rotate(-45deg); }
.hero { position:relative; min-height:650px; height:calc(100svh - 72px); max-height:1000px; background:#363636; color:#fff; isolation:isolate; padding:118px var(--space) 24px; display:flex; flex-direction:column; overflow:hidden; }
.hero-image { position:absolute; inset:0; height:100%; object-fit:cover; object-position:center 42%; z-index:-2; }
.hero:after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#0002 20%,#0003 45%,#000b 100%); z-index:-1; }
.hero-top { display:flex; justify-content:space-between; gap:24px; font-size:12px; }
.hero-copy { margin-top:auto; padding-top:90px; }
.hero h1 { font-size:128px; font-weight:400; line-height:1; margin:14px 0 12px; }
.hero h1 span { color:var(--accent-light); }
.hero-statement { font-size:44px; line-height:1.15; }
.hero-bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-top:28px; }
.hero-bottom>p { max-width:38ch; font-size:16px; }
.hero-actions { display:flex; align-items:center; gap:28px; }
.action-link { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; min-height:52px; padding:12px 22px; font-size:14px; }
.action-light { background:var(--paper); color:var(--ink); }
.action-light:hover { background:#e5e9f8; }
.hero-contact { display:inline-flex; align-items:center; gap:14px; min-height:48px; font-size:14px; }
.hero-contact:hover { text-decoration:underline; text-underline-offset:5px; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin:16px 0 48px; }
.section-heading p { font-size:15px; color:var(--muted); }
.work { background:var(--paper); padding-top:32px; }
.work-grid { display:grid; grid-template-columns:1fr 1fr; gap:52px 36px; }
.project { min-width:0; }
.project .image-wrap { position:relative; overflow:hidden; background:#e6e6e2; aspect-ratio:5/4; }
.project img { height:100%; object-fit:cover; object-position:center top; }
.project-art img { object-fit:contain; }
.project-open { position:absolute; inset:0; width:100%; border:0; background:transparent; display:flex; align-items:flex-end; justify-content:flex-end; padding:18px; }
.project-open .site-arrow { background:var(--paper); color:var(--ink); width:44px; height:44px; padding:10px; transition:background .2s,color .2s; }
.project-open:hover .site-arrow { background:var(--accent); color:white; }
.project-open:focus-visible { outline-offset:-5px; }
.project figcaption { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-top:16px; }
.project-category,.project-index { font-size:11px; color:var(--muted); }
.project h3 { font-size:30px; font-weight:500; line-height:1.25; margin-top:4px; }
.project-index { font-size:36px; font-weight:500; line-height:1; padding-top:4px; }
.project-description { display:none; }
.text-link { display:flex; align-items:center; justify-content:space-between; gap:24px; max-width:360px; min-height:48px; padding:14px 0; border-bottom:1px solid currentColor; font-size:14px; }
.text-link:hover { color:var(--accent); }
.work-outro,.services-outro { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:40px; padding-top:22px; border-top:1px solid var(--line); }
.work-outro .text-link,.services-outro .text-link { width:280px; }
.services { background:#f0f1ee; }
.service-list { border-top:1px solid var(--line); }
details { border-bottom:1px solid var(--line); }
summary { display:flex; align-items:center; gap:28px; padding:30px 0; cursor:pointer; list-style:none; }
summary::-webkit-details-marker { display:none; }
summary h3 { min-width:0; font-size:36px; font-weight:600; line-height:1.3; }
summary .number { font-size:42px; font-weight:400; color:var(--muted); font-variant-numeric:tabular-nums; }
.plus { flex-shrink:0; margin-left:auto; font-size:28px; line-height:1; transition:transform .2s; }
details[open] .plus { transform:rotate(45deg); }
details[open] summary h3,summary:hover h3 { color:var(--accent); }
.service-body { padding:0 48px 32px 0; }
.service-body p { font-size:18px; line-height:1.9; max-width:76ch; }
.about { background:var(--ink); color:var(--paper); }
.about .section-label { border-color:#565653; }
.about-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:8%; padding:20px 0 48px; }
.about-copy h2 { font-size:54px; margin-top:18px; }
.about-description p { color:#d3d3cf; margin-bottom:18px; }
.about-description .text-link { margin-top:22px; }
.about .text-link:hover { color:var(--accent-light); }
.approach-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; border-top:1px solid #565653; padding-top:30px; }
.approach-grid .eyebrow { color:var(--accent-light); }
.approach-grid h3 { font-size:22px; font-weight:400; margin:12px 0; line-height:1.3; }
.approach-grid p { color:#c5c5c1; font-size:14px; max-width:34ch; }
.contact-intro { margin:24px 0 16px; font-size:20px; }
.contact h2 { font-size:104px; line-height:1.1; color:var(--accent); }
.contact-prompt { margin-top:20px; color:var(--muted); }
.contact-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; border-top:1px solid var(--line); padding-top:20px; margin-top:36px; }
.contact-method { display:flex; flex-direction:column; gap:12px; padding:12px 0; min-width:0; }
.contact-method-title { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:26px; }
.contact-method-detail { font-size:14px; overflow-wrap:anywhere; }
.contact-method:hover { color:var(--accent); }
.site-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px var(--space); border-top:1px solid var(--line); }
.footer-credits { min-width:0; text-align:center; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.footer-credits a { text-decoration:underline; text-underline-offset:3px; }
.back-to-top { display:inline-flex; align-items:center; gap:10px; min-height:44px; font-size:12px; }
.back-to-top:hover { color:var(--accent); }
.motion .reveal { opacity:0; transform:translateY(16px); transition:opacity .5s ease,transform .5s ease; }
.motion .reveal.is-visible { opacity:1; transform:none; }
.project-dialog { width:min(1060px,calc(100% - 48px)); max-height:calc(100svh - 48px); padding:24px; border:0; background:var(--paper); color:var(--ink); overflow:auto; }
.project-dialog::backdrop { background:#000c; }
.project-dialog-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:20px; }
.dialog-close { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; background:none; border:1px solid var(--line); }
.dialog-close:hover { background:#e7e7e2; }
.dialog-close svg { width:24px; height:24px; }
.project-dialog-content figure { display:grid; grid-template-columns:1.3fr 1fr; align-items:center; gap:32px; }
.project-dialog-content img { height:min(65svh,680px); object-fit:contain; background:transparent; }
.project-dialog-content h3 { font-size:32px; line-height:1.2; margin:12px 0 20px; }
.project-dialog-content p { color:var(--muted); font-size:16px; }
.project-dialog-content .text-link { margin-top:28px; }
body.dialog-open,body.menu-open { overflow:hidden; }
@media(min-width:1700px) { .section { padding-left:max(var(--space),calc((100vw - 1550px)/2)); padding-right:max(var(--space),calc((100vw - 1550px)/2)); } }
@media(max-width:1100px) {
  h2 { font-size:60px; }
  .hero h1 { font-size:104px; }
  .hero-actions { flex-direction:column; gap:8px; align-items:flex-start; }
  .hero-statement { font-size:38px; }
  .about-copy h2 { font-size:44px; }
  .contact-method-title { font-size:24px; }
}
@media(max-width:760px) {
  html { scroll-padding-top:88px; }
  .header { height:72px; }
  .header-logo { width:96px; height:64px; }
  .header nav { font-size:12px; gap:12px; }
  .header:has(.menu-toggle[hidden]) { height:auto; min-height:84px; flex-wrap:wrap; }
  .header nav[data-mobile] { display:flex; position:fixed; top:72px; left:0; right:0; height:calc(100dvh - 72px); background:var(--paper); padding:28px var(--space) max(24px,env(safe-area-inset-bottom)); flex-direction:column; align-items:stretch; gap:12px; font-size:28px; overflow:auto; visibility:hidden; opacity:0; transform:translateY(-12px); transition:opacity .28s ease,transform .35s ease,visibility 0s .35s; }
  .header nav[data-mobile].is-open { visibility:visible; opacity:1; transform:none; transition-delay:0s; }
  .header nav[data-mobile]>a { border-bottom:1px solid var(--line); transform:translateY(10px); opacity:0; transition:transform .3s ease,opacity .3s ease; }
  .header nav[data-mobile].is-open>a { transform:none; opacity:1; }
  .header nav[data-mobile].is-open>a:nth-child(2) { transition-delay:.04s; }
  .header nav[data-mobile].is-open>a:nth-child(3) { transition-delay:.08s; }
  .header nav[data-mobile].is-open>a:nth-child(4) { transition-delay:.12s; }
  .header nav[data-mobile] .menu-socials { display:grid; gap:8px; margin-top:auto; padding-top:32px; }
  .header nav[data-mobile] .menu-social { display:flex; align-items:center; gap:16px; padding:12px 0; min-height:64px; font-size:18px; color:var(--ink); }
  .menu-social svg { width:26px; height:26px; flex-shrink:0; }
  .menu-whatsapp svg { color:#18794e; }
  .menu-social small { display:block; color:var(--muted); font-size:12px; margin-top:2px; }
  .hero { min-height:650px; height:calc(100svh - 64px); max-height:860px; padding-top:99px; padding-bottom:20px; }
  .hero-image { object-position:60% 45%; }
  .hero-top { font-size:11px; }
  .hero-top span:last-child { display:none; }
  .hero-copy { padding-top:110px; }
  .hero h1 { font-size:76px; margin:14px 0 12px; }
  .hero-statement { font-size:29px; max-width:18ch; }
  .hero-copy>.eyebrow { font-size:10px; }
  .hero-bottom { display:block; margin-top:22px; }
  .hero-bottom>p { font-size:14px; max-width:34ch; }
  .hero-actions { flex-direction:row; align-items:center; gap:16px; margin-top:22px; }
  .action-link { gap:12px; padding:12px 14px; font-size:13px; flex-shrink:0; }
  .hero-contact { font-size:12px; gap:6px; line-height:1.4; }
  .hero-contact .site-arrow { width:18px; height:18px; }
  .section { padding:48px var(--space); }
  .work { padding-top:24px; }
  .section-label { font-size:11px; gap:18px; padding:16px 0 22px; }
  .section-label>span:first-child { font-size:16px; }
  .section-label span:last-child { text-align:right; max-width:48%; }
  h2 { font-size:46px; }
  .section-heading { display:block; margin:8px 0 28px; }
  .section-heading p { font-size:14px; margin-top:16px; }
  .work-grid { grid-template-columns:1fr; gap:30px; }
  .project .image-wrap { aspect-ratio:6/5; }
  .project h3 { font-size:26px; }
  .project-open { padding:12px; }
  .work-outro,.services-outro { align-items:flex-start; flex-direction:column; gap:12px; margin-top:28px; }
  .work-outro p,.services-outro p { font-size:15px; }
  .work-outro .text-link,.services-outro .text-link { width:100%; }
  summary { gap:10px; padding:24px 0; }
  .service-body { padding:0 8px 26px 0; }
  .service-body p { font-size:16px; line-height:1.8; }
  .about-grid { grid-template-columns:1fr; gap:24px; padding:4px 0 32px; }
  .about-copy h2 { font-size:38px; }
  .about-description p { font-size:15px; }
  .approach-grid { grid-template-columns:1fr; gap:24px; }
  .approach-grid>div+div { border-top:1px solid #565653; padding-top:24px; }
  .approach-grid h3 { font-size:22px; margin:8px 0; }
  .approach-grid p { max-width:40ch; }
  .contact-intro { font-size:17px; margin-top:12px; }
  .contact h2 { font-size:62px; }
  .contact-prompt { font-size:15px; }
  .contact-links { grid-template-columns:1fr; gap:10px; margin-top:28px; }
  .contact-method+.contact-method { border-top:1px solid var(--line); padding-top:20px; }
  .site-footer { flex-wrap:wrap; gap:12px 16px; padding-top:16px; padding-bottom:16px; }
  .footer-credits { order:3; width:100%; text-align:left; }
  .project-dialog { width:calc(100% - 24px); max-height:calc(100svh - 24px); padding:16px; }
  .project-dialog-content figure { grid-template-columns:1fr; gap:20px; }
  .project-dialog-content img { height:42svh; }
  .project-dialog-content h3 { font-size:26px; margin:8px 0 14px; }
}
@media(max-width:360px) {
  .hero h1 { font-size:66px; }
  .hero-statement { font-size:26px; }
  .hero-actions { gap:12px; }
  .hero-contact .site-arrow { display:none; }
  .hero-contact { max-width:100px; }
  h2 { font-size:40px; }
  .about-copy h2 { font-size:34px; }
  .contact h2 { font-size:52px; }
}

.client-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); list-style:none; padding:0; margin:0; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.client-grid li { min-width:0; min-height:152px; display:grid; place-content:center; padding:24px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.client-logo { border:0; background:transparent; width:100%; min-height:96px; padding:8px; }
.client-logo img { width:100%; height:80px; object-fit:contain; }
.hero-image,.project img { filter:grayscale(1); transition:filter .7s ease; }
.hero.is-color .hero-image,.project.is-color img,.project:has(.project-open:focus-visible) img { filter:grayscale(0); }
@media(hover:hover) and (pointer:fine) {
  .hero:hover .hero-image,.project .image-wrap:hover img { filter:grayscale(0); }
}
.approach-grid .eyebrow { display:flex; align-items:center; gap:12px; }
.approach-number { font-size:44px; line-height:1.1; font-weight:500; }
.dialog-navigation { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:24px; }
.dialog-navigation button { width:44px; height:44px; background:transparent; border:1px solid var(--line); font-size:24px; }
.dialog-navigation button:hover { background:var(--ink); color:var(--paper); }
.dialog-counter { min-width:60px; text-align:center; font-size:14px; font-variant-numeric:tabular-nums; }
@media(max-width:1100px) {
  summary h3 { font-size:30px; }
  summary .number { font-size:36px; }
}
@media(max-width:760px) {
  .client-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .client-grid li { min-height:128px; padding:16px; }
  summary h3 { font-size:22px; }
  summary .number { font-size:26px; }
  .plus { font-size:24px; }
  .approach-number { font-size:36px; }
}
@media(max-width:360px) {
  summary h3 { font-size:18px; }
  summary .number { font-size:22px; }
}

@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*:before,*:after { animation:none!important; transition:none!important; }
  .motion .reveal { opacity:1; transform:none; }
}
@media(max-width:760px) and (max-height:720px) {
  .header nav[data-mobile] { padding-top:16px; gap:4px; font-size:24px; }
  .header nav[data-mobile]>a { padding:10px 0; }
  .header nav[data-mobile] .menu-socials { padding-top:16px; gap:0; }
  .header nav[data-mobile] .menu-social { padding:8px 0; min-height:60px; }
  .hero { min-height:600px; height:auto; }
  .hero-copy { padding-top:26px; }
  .hero h1 { font-size:56px; }
  .hero-bottom { margin-top:16px; }
  .hero-actions { margin-top:16px; }
}

/* Segunda revisión: mismas tipografías, paleta y componentes. */
.hero { padding-bottom:40px; }
.hero-statement { font-size:clamp(28px,3.2vw,46px); max-width:none; }
.about-copy h2 { font-size:clamp(34px,3.35vw,52px); line-height:1.16; }
.editorial-banner { position:relative; height:clamp(230px,26vw,400px); overflow:hidden; background:#363636; }
.editorial-banner img { width:100%; height:100%; object-fit:cover; object-position:center 30%; filter:grayscale(1); transition:filter .7s ease; }
.service-list summary { padding:24px 0; gap:20px; }
.service-list summary h3 { display:flex; align-items:baseline; gap:20px; font-size:clamp(19px,2.1vw,30px); line-height:1.3; }
.service-list summary .number { flex-shrink:0; font-size:clamp(18px,1.8vw,26px); }
.service-body { padding:0 48px 28px 64px; }
.service-body p { max-width:62ch; font-size:16px; line-height:1.75; }
.service-body .service-keywords { margin-top:16px; font-size:14px; line-height:1.8; color:var(--muted); }
.work { padding-top:76px; }
.work-category + .work-category { margin-top:56px; }
.work-category-heading { display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding:22px 0; border-top:1px solid var(--line); }
.work-category-heading h3 { font-size:clamp(20px,2vw,28px); font-weight:500; }
.work-category-heading p { font-family:var(--serif); font-style:italic; font-size:22px; }
.work-category .work-grid:has(> .project:only-child) { grid-template-columns:1fr; }
.work-category .work-grid > .project:only-child .image-wrap { aspect-ratio:16/9; }
@media(min-width:761px) and (max-width:1000px) { .header nav { gap:18px; font-size:13px; } }
@media(max-width:760px) {
  .hero-statement { font-size:clamp(26px,6vw,38px); }
  .hero-actions { flex-wrap:wrap; }
  .editorial-banner { height:240px; }
  .editorial-banner img { object-position:58% center; }
  .service-list summary { gap:12px; padding:20px 0; }
  .service-list summary h3 { gap:12px; }
  .service-body { padding:0 0 24px; }
  .service-body p { font-size:15px; line-height:1.65; }
  .service-body .service-keywords { font-size:13px; }
  .work { padding-top:48px; }
  .work-category + .work-category { margin-top:36px; }
  .work-category-heading { flex-direction:column; gap:8px; }
  .work-category-heading p { font-size:20px; }
  .work-category .work-grid > .project:only-child .image-wrap { aspect-ratio:6/5; }
  .section-label>span:only-child { max-width:none; text-align:left; }
}

/* Pulido final: ritmo y medidas de lectura, sin cambiar el contenido ni la estructura. */
.hero-bottom { align-items:center; }
.hero-bottom>p { max-width:42ch; line-height:1.7; }
.hero-actions { flex-shrink:0; }
.about-grid { gap:clamp(32px,6vw,88px); }
.about-copy h2 { max-width:19ch; }
.about-description { padding-top:4px; }
.about-description p { max-width:53ch; line-height:1.75; }
.service-list summary .number { min-width:44px; }
.project figcaption { gap:12px; }
.project h3 { font-size:clamp(23px,2.1vw,30px); }
.project-index { font-size:28px; }
.work-category-heading p { max-width:32ch; line-height:1.4; }
.work-grid { gap:40px 32px; }
.client-grid li { min-height:144px; }
.contact-method-title { font-size:clamp(22px,2vw,26px); }
@media(max-width:1100px) and (min-width:761px) {
  .about-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:760px) {
  .hero { height:auto; min-height: min(760px,100svh); padding-bottom:32px; }
  .hero-copy { padding-top:clamp(90px,18svh,150px); }
  .hero-actions { gap:12px 20px; }
  .hero-bottom>p { max-width:38ch; }
  .about-grid { gap:28px; }
  .about-description { padding-top:0; }
  .service-list summary .number { min-width:36px; }
  .work-grid { gap:32px; }
  .work-category-heading { padding:20px 0; }
  .client-grid li { min-height:120px; }
  .contact-links { gap:12px; }
}
@media(max-width:760px) and (max-height:720px) {
  .hero { min-height:600px; }
  .hero-copy { padding-top:48px; }
}

/* Composición fotográfica: cada imagen conserva su proporción intrínseca. */
.project .image-wrap,
.work-category .work-grid > .project:only-child .image-wrap { aspect-ratio:auto; }
.project img { width:auto; max-width:100%; height:auto; max-height:760px; margin-inline:auto; object-fit:contain; object-position:center; }
.work-grid { align-items:start; }
.work-category .work-grid > .project:only-child { width:min(100%,640px); margin-inline:auto; }
.project .image-wrap { background:#eeefeb; }
.client-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
.client-grid li { display:flex; align-items:center; justify-content:center; padding:20px 12px; min-height:144px; }
.client-logo { display:flex; align-items:center; justify-content:center; min-width:0; min-height:100px; padding:0; }
.client-logo img { width:100%; max-width:240px; height:auto; max-height:120px; aspect-ratio:2/1; object-fit:contain; object-position:center; }
/* Ventana sobre la foto, sin ampliar su escala durante el scroll. */
.editorial-banner { height:clamp(240px,26vw,400px); }
.editorial-banner img { position:absolute; top:var(--banner-static-offset,0px); width:100%; height:auto; min-height:calc(100% + 120px); object-fit:cover; object-position:center; transform:translate3d(0,var(--banner-offset,0px),0); will-change:transform; }
@media(min-width:761px) and (max-width:1100px) {
  .hero-image { top:84px; height:auto; object-fit:contain; object-position:center top; }
}
@media(max-width:1000px) {
  .client-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .client-grid li { min-height:140px; }
}
@media(max-width:760px) {
  .hero { min-height:0; max-height:none; background:#242424; }
  .hero-image { top:72px; height:auto; object-fit:contain; object-position:center top; }
  .hero-copy { padding-top:clamp(205px,54vw,380px); }
  .hero:after { background:linear-gradient(180deg,transparent 15%,#24242422 35%,#242424 65%); }
  .project img { max-height:680px; }
  .editorial-banner { height:clamp(220px,58vw,300px); }
  .client-grid li { min-height:112px; padding:16px 10px; }
  .client-logo { min-height:80px; }
  .client-logo img { max-height:100px; }
}
@media(prefers-reduced-motion:reduce) { .editorial-banner img { transform:none; will-change:auto; } }

/* Encabezados de marca y lectura editorial de servicios. */
#services-title,#work-title,#clients-title,#contact-title,.contact-method-title { color:var(--accent); }
.service-body { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(24px,4vw,64px); }
.service-body .service-keywords { margin-top:0; padding-left:24px; border-left:1px solid var(--line); }
/* Carrusel nativo desplazable: sin JS los diez clientes siguen disponibles. */
.client-viewport { overflow:clip; pointer-events:none; user-select:none; }
.client-carousel .client-grid { display:flex; width:100%; border-left:0; }
.client-carousel .client-grid li { flex:0 0 20%; min-width:0; min-height:150px; }
.client-logo img { filter:none; transition:none; }
@media(max-width:1100px) { .client-carousel .client-grid li { flex-basis:33.333333%; } }
@media(max-width:760px) {
  .client-carousel .client-grid li { flex-basis:50%; min-height:124px; }
  .service-body { grid-template-columns:1fr; gap:16px; }
  .service-body .service-keywords { padding:14px 0 0; border-left:0; border-top:1px solid var(--line); }
}

/* Frase editorial directamente sobre el fondo de Nosotros. */
.about-copy h2 em {
  display:block;
  margin:22px 0 0;
  padding:0;
  max-width:100%;
  background:none;
  border:0;
  box-shadow:none;
  color:var(--paper);
  font-family:var(--serif);
  font-style:italic;
  font-weight:400;
  font-size:clamp(32px,3.1vw,48px);
  line-height:1.05;
}
.about-statement-lead { display:block; color:var(--accent-light); }
.about-statement-end { display:block; }
/* Dos secuencias idénticas, sin navegación manual ni pausas de interacción. */
.client-carousel:not(.is-marquee) .client-grid { flex-wrap:wrap; }
.client-carousel.is-marquee .client-grid { width:400%; animation:clients-marquee 45s linear infinite; }
.client-carousel.is-marquee .client-grid li { flex:0 0 5%; }
.client-logo img { -webkit-user-drag:none; }
@keyframes clients-marquee { from { transform:translate3d(0,0,0); } to { transform:translate3d(-50%,0,0); } }
@media(max-width:1100px) { .client-carousel.is-marquee .client-grid { width:666.666667%; } }
@media(max-width:760px) {
  .about-copy h2 em { font-size:clamp(28px,7.6vw,34px); line-height:1.08; }
  .client-carousel.is-marquee .client-grid { width:1000%; }
}
@media(prefers-reduced-motion:reduce) {
  .client-carousel.is-marquee .client-grid { animation:none; transform:none; width:100%; flex-wrap:wrap; }
  .client-carousel.is-marquee .client-grid li { flex-basis:20%; }
  .client-carousel .client-grid li[aria-hidden="true"] { display:none; }
}
@media(prefers-reduced-motion:reduce) and (max-width:1100px) {
  .client-carousel.is-marquee .client-grid li { flex-basis:50%; }
}

/* Nueva fotografía del banner: proporción intacta y monocromo permanente. */
.editorial-banner { height:clamp(260px,39vw,760px); }
.editorial-banner img { object-position:50% 72%; filter:grayscale(100%); transition:none; }
@media(max-width:760px) {
  .editorial-banner { height:clamp(240px,68vw,300px); }
  .editorial-banner img { object-position:85% 50%; }
}

/* Espacio real para el pan: escala base constante, nunca zoom animado. */
@media(max-width:1100px) { .editorial-banner img { min-height:calc(100% + 90px); } }
@media(max-width:760px) { .editorial-banner img { min-height:calc(100% + 50px); } }

/* Categorías del portfolio de a dos, conservando su orden y sus galerías. */
.work-categories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 32px; align-items:start; }
.work-categories > .work-category { min-width:0; margin-top:0; }
.work-categories .work-category-heading { display:flex; flex-direction:column; align-items:flex-start; gap:8px; min-height:128px; }
.work-categories .work-grid { grid-template-columns:minmax(0,1fr); }
.work-categories .work-grid > .project:only-child { width:100%; margin-inline:0; }
@media(max-width:1100px) and (min-width:761px) {
  .work-categories .work-category-heading { min-height:152px; }
}
@media(max-width:760px) {
  .work-categories { grid-template-columns:minmax(0,1fr); gap:36px; }
  .work-categories .work-category-heading { min-height:0; }
}

/* Espacios iguales con fotografías completas, sin recorte ni marco de fondo. */
.work-categories .work-category .work-grid .project .image-wrap {
  aspect-ratio:4/5;
  width:100%;
  background:transparent;
}
.work-categories .work-category .work-grid .project .image-wrap img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:none;
  object-fit:contain;
  object-position:center;
}

/* Portada de Identidad: recuperar el color al interactuar. */
.project[data-campaign="editorial-de-moda"]:focus-within img,
.project[data-campaign="editorial-de-moda"].is-color img { filter:grayscale(0); }
.project[data-campaign="editorial-de-moda"]:hover img { filter:grayscale(0); }

/* Continuación de Producción en una fila completa, con tarjetas del mismo ancho. */
.work-categories > .work-continuation { grid-column:1 / -1; }
.work-categories .work-continuation .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 32px; }
@media(max-width:760px) {
  .work-categories .work-continuation .work-grid { grid-template-columns:minmax(0,1fr); }
}

/* Color inmediato en las portadas actualizadas. */
.project[data-campaign="editorial-de-moda"] img,
.project[data-campaign="concepto-visual"] img { transition:none; }
.project[data-campaign="concepto-visual"]:hover img,
.project[data-campaign="concepto-visual"]:focus-within img { filter:grayscale(0); }