/* Final visual QA layer · 2026-08-22
   Kept separate so the deployment can be audited and reverted cleanly. */

/* Home: portfolio controls and compact technical teaser. */
.portfolio-v2__controls{gap:5px!important;padding:5px!important;border:1px solid rgba(20,31,36,.14)!important;border-radius:999px!important;background:rgba(255,250,239,.82)!important;box-shadow:0 12px 35px rgba(14,24,29,.09)!important;backdrop-filter:blur(12px)}
.portfolio-v2__controls button{min-width:42px!important;height:42px!important;padding:0 12px!important;border:0!important;background:transparent!important}
.portfolio-v2__controls button:hover:not(:disabled){color:#fff8ea!important;background:#a94230!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 7px 18px rgba(126,47,31,.22)!important}
.portfolio-v2__autoplay-progress{position:relative;overflow:hidden;width:min(100%,360px);height:3px;margin:-8px 0 22px auto;border-radius:999px;background:rgba(26,39,44,.12)}
.portfolio-v2__autoplay-progress span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#a73d30,#f08a4f,#bf4c32);transform:scaleX(0);transform-origin:left}
.portfolio-v2__autoplay-progress span.is-running{animation:portfolio-polish-progress var(--portfolio-autoplay-duration,6500ms) linear forwards}
@keyframes portfolio-polish-progress{to{transform:scaleX(1)}}
.technical-teaser{min-height:min(760px,92svh)!important;padding-block:clamp(54px,6.5vw,82px)!important}
.technical-teaser__ambient{right:auto!important;left:0!important;width:min(46vw,700px)!important;opacity:.28!important;transform:scaleX(-1)!important}
.technical-teaser__shell{grid-template-columns:minmax(0,.86fr) minmax(440px,1.14fr)!important;min-height:min(620px,72svh)!important;align-items:stretch!important}
.technical-teaser__copy{align-self:center}.technical-teaser__proof{margin-block:24px!important}.technical-teaser__visual{min-height:520px!important}.technical-teaser__visual img{object-position:69% center!important}

/* Service hub: no oval overlays, less empty paper, readable method. */
.services-hub-grid-section{padding-top:clamp(44px,5vw,72px)!important;background:linear-gradient(90deg,rgba(250,246,237,.9),rgba(250,246,237,.78) 50%,rgba(250,246,237,.94)),url('../assets/services-crescent-v7.webp') left top/clamp(330px,34vw,540px) auto no-repeat,#f7f1e7!important}
.services-hub-heading{grid-template-columns:minmax(0,1fr) minmax(250px,.64fr)!important;row-gap:16px!important;margin-bottom:clamp(25px,3.5vw,46px)!important;padding:clamp(23px,3vw,38px)!important}
.services-hub-heading__cta{grid-column:2;justify-self:start;display:inline-flex;gap:9px;margin-top:18px;color:#963c2b;font-weight:780;text-decoration:underline;text-decoration-color:rgba(150,60,43,.3);text-underline-offset:5px}
.services-hub-heading__botanical{right:18px!important;bottom:auto!important;top:18px!important;width:138px!important;height:76px!important;aspect-ratio:auto!important;border-radius:0!important;opacity:.16!important;background-size:contain!important;background-position:right top!important;-webkit-mask-image:linear-gradient(90deg,transparent,#000 42%)!important;mask-image:linear-gradient(90deg,transparent,#000 42%)!important}
.services-hub-card{min-height:clamp(400px,35vw,520px)!important}.services-hub-card-media::after{content:none!important;display:none!important}.services-hub-card:hover,.services-hub-card:focus-within{transform:translateY(-4px)!important}.services-hub-card:hover .services-hub-card-media img,.services-hub-card:focus-within .services-hub-card-media img{transform:scale(1.018)!important}
.services-hub-method{padding-top:clamp(60px,7vw,92px)!important;background:linear-gradient(180deg,#f7f1e7 0,#e9e0d2 10%,#081216 10.1%,#081216 100%)!important}.services-hub-method-intro{position:relative;z-index:2}.services-hub-method-intro .service-kicker{color:#ef8955!important}.services-hub-method-intro h2{color:#fff8ea!important;text-shadow:0 2px 22px rgba(0,0,0,.22)}.services-hub-method-intro>p{color:#bdc9ca!important}.services-hub-method-intro .service-text-link--ink{color:#fff3de!important}
.service-method::before{background-image:var(--service-context-art)!important;background-position:76% center!important;background-size:cover!important;opacity:.24!important;filter:saturate(.72) contrast(1.06)!important}.service-method::after{background:linear-gradient(90deg,rgba(5,14,19,.98),rgba(5,14,19,.88) 53%,rgba(5,14,19,.62))!important}.service-process-detailed{padding-inline:clamp(20px,3vw,42px)!important}.service-process-detailed>li{grid-template-columns:82px minmax(0,1.1fr) minmax(310px,.9fr)!important;gap:clamp(30px,4vw,68px)!important;padding:29px 14px!important;border-radius:3px 17px 3px 3px}.service-page[data-service='apps'] .service-method{--service-method-tone:rgba(205,89,50,.25)}.service-deliverables::before,.service-principles::before{opacity:.24!important;mix-blend-mode:multiply;filter:saturate(.72) contrast(.98)}

/* Portfolio archive and project detail. */
.portfolio-archive .hero-inner{grid-template-columns:minmax(0,1.2fr) minmax(420px,.8fr)!important;align-items:end!important}.portfolio-archive .stats-bar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important;width:min(100%,500px)!important;margin:0 0 6px auto!important;overflow:hidden!important;border:1px solid rgba(255,245,227,.18)!important;border-radius:4px 24px 4px 24px!important;background:rgba(5,15,20,.62)!important;box-shadow:0 22px 60px rgba(0,0,0,.24)!important;backdrop-filter:blur(15px)}
.portfolio-archive .stat-item,.portfolio-archive .stat-item:first-child{grid-row:auto!important;min-height:94px!important;display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:13px!important;align-content:center!important;align-items:center!important;padding:17px 19px!important;border-right:1px solid rgba(255,245,227,.11)!important;border-bottom:1px solid rgba(255,245,227,.11)!important;background:transparent!important}.portfolio-archive .stat-item:nth-child(2n){border-right:0!important}.portfolio-archive .stat-item:nth-last-child(-n+2){border-bottom:0!important}.portfolio-archive .stat-item:first-child{background:rgba(185,69,44,.22)!important}.portfolio-archive .stat-item:first-child::after{content:none!important}.portfolio-archive .stat-number,.portfolio-archive .stat-item:first-child .stat-number{font-size:clamp(2rem,3vw,3.1rem)!important;line-height:1!important}.portfolio-archive .stat-label,.portfolio-archive .stat-item:first-child .stat-label{max-width:16ch!important;color:#dce4e2!important;font-size:.62rem!important}
.portfolio-archive .filter-section{margin-bottom:0!important;transform:translateY(50%)!important}.portfolio-archive .filter-status{top:calc(100% + 7px)!important}.portfolio-archive .projects-section{margin-top:0!important;padding-top:112px!important}.portfolio-archive .card-body::after{content:'A.N'!important;color:rgba(177,70,43,.13)!important;font-size:2rem!important;letter-spacing:-.07em!important}.portfolio-archive .card-img-wrap::before{content:none!important;display:none!important}.portfolio-archive .project-card:hover .card-img-wrap img,.portfolio-archive .project-card:focus-visible .card-img-wrap img{transform:scale(1.045)!important}
.project-study .cs-layout{grid-template-columns:minmax(170px,13vw) minmax(0,1fr) minmax(250px,18vw)!important}.project-study .cs-hero-inner,.project-study .cs-hero-text{text-align:left!important}.project-study .cs-breadcrumb{justify-content:flex-start!important}.project-study .cs-subtitle{margin-inline:0!important}.project-study .cs-hero-actions{justify-content:flex-start!important}
.case-quick-contact{display:grid;gap:11px;margin-top:14px;padding:17px;color:#f7eee0;border:1px solid rgba(239,132,82,.23);border-radius:4px 22px 4px 22px;background:linear-gradient(145deg,rgba(7,19,24,.97),rgba(14,35,40,.95));box-shadow:0 22px 55px rgba(0,0,0,.22)}.case-quick-contact>.contact-v2__honeypot{display:none!important}.case-quick-contact__eyebrow{color:#ef8756;font:760 .65rem/1.4 var(--font-mono);letter-spacing:.08em;text-transform:uppercase}.case-quick-contact label{display:grid;gap:5px;min-width:0}.case-quick-contact label>span{color:#aebbbc;font-size:.65rem}.case-quick-contact :is(input,textarea){width:100%;min-width:0;padding:10px 11px;color:#f8f2e7;border:1px solid rgba(255,255,255,.12);border-radius:3px 11px;background:rgba(255,255,255,.045);outline:0}.case-quick-contact textarea{resize:vertical}.case-quick-contact :is(input,textarea):focus{border-color:#e67b4d;box-shadow:0 0 0 3px rgba(230,123,77,.1)}.case-quick-contact__privacy{grid-template-columns:auto 1fr!important;align-items:start}.case-quick-contact__privacy input{width:16px;margin-top:2px;accent-color:#df7047}.case-quick-contact__privacy a{color:#ef8a5d;text-decoration:underline}.case-quick-contact .sidebar-contact-btn{width:100%;margin:2px 0 0;border:0}.case-quick-contact__message{padding:9px;color:#dfe9e6;font-size:.72rem;border:1px solid rgba(255,255,255,.1);border-radius:3px 10px}

/* About: stable key lighting, controls, type, timeline axis and form. */
.cv-midnight .skill-detail h3{max-width:100%;min-height:1.15em!important;overflow-wrap:anywhere;font-size:clamp(2rem,3.8vw,3.8rem)!important;line-height:1.04!important}.skill-keyboard-deck.is-key-switching::after,.skill-keyboard-deck.is-key-switching .skill-key[aria-pressed='true']{animation:none!important}.skill-key[aria-pressed='true']{box-shadow:0 3px 0 #05090c,0 13px 26px rgba(224,93,55,.25),inset 0 -3px 14px rgba(255,162,107,.18)!important}.skill-key[aria-pressed='true']::after{background:#ef7748!important;box-shadow:0 0 12px rgba(239,119,72,.68)!important}.skill-detail-controls{display:inline-flex!important;gap:5px!important;padding:5px!important;border:1px solid rgba(236,135,84,.2);border-radius:999px;background:rgba(255,255,255,.035)}.skill-detail-controls button{width:42px!important;height:42px!important;border-radius:50%!important;background:rgba(255,255,255,.035)!important}.skill-detail-controls button:hover,.skill-detail-controls button:focus-visible{color:#fff4e5!important;border-color:#df6d48!important;background:#a83f30!important;transform:translateY(-2px)}.skill-detail-counter{min-width:72px;padding:7px 10px;color:#f3d7c7!important;border:1px solid rgba(236,135,84,.16);border-radius:999px;background:rgba(255,255,255,.035);text-align:center;font-variant-numeric:tabular-nums}.cv-journey-list::before{left:calc(clamp(20px,3vw,38px) + 155px)!important;transform:translateX(-50%)}.cv-journey-item::before{left:155px!important;transform:translateX(-50%)}.cv-closing-copy h2{max-width:12ch;letter-spacing:-.045em!important;line-height:1.04!important;text-wrap:balance}.cv-quick-form>.contact-v2__honeypot{display:none!important}.cv-quick-form>input[type='hidden']{display:none!important}

/* Blog: editorial crescendo plus a genuinely useful quick contact. */
.blog-hero-manifesto{align-items:flex-end!important;justify-content:flex-end!important}.blog-hero-manifesto span{font-family:var(--font-display)!important;line-height:.82!important;letter-spacing:-.075em!important}.blog-hero-manifesto span:nth-child(1){font-size:clamp(2rem,4.4vw,4.7rem)!important;transform:translateX(-1.2em)!important}.blog-hero-manifesto span:nth-child(2){font-size:clamp(3rem,6.1vw,6.5rem)!important;transform:translateX(-.52em)!important}.blog-hero-manifesto span:nth-child(3){font-size:clamp(4rem,8vw,8.7rem)!important;transform:none!important}
.newsletter-preview--contact{grid-template-columns:minmax(0,.8fr) minmax(420px,1.2fr)!important;align-items:start!important}.blog-quick-contact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:24px;border:1px solid rgba(240,138,85,.26);border-radius:4px 24px 4px 24px;background:rgba(5,15,20,.84);backdrop-filter:blur(15px)}.blog-quick-contact>.contact-v2__honeypot,.blog-quick-contact>input[type='hidden']{display:none!important}.blog-quick-contact label{display:grid;gap:6px}.blog-quick-contact label>span{color:#b8c5c6;font-size:.66rem}.blog-quick-contact :is(input,textarea){width:100%;min-height:46px;padding:11px 13px;color:#fff6e9;border:1px solid rgba(255,255,255,.13);border-radius:3px 11px;background:rgba(255,255,255,.045);outline:0}.blog-quick-contact__privacy{grid-column:1/-1;grid-template-columns:auto 1fr!important;align-items:start}.blog-quick-contact__privacy input{width:17px;min-height:17px;margin-top:2px;accent-color:#e5734a}.blog-quick-contact__privacy a{color:#ef8a5d;text-decoration:underline}.blog-quick-contact button{min-height:46px;color:#fff7e8;border:0;border-radius:3px 14px;background:linear-gradient(135deg,#a63c30,#d0643e);font-weight:780}.blog-quick-contact__message{grid-column:1/-1;padding:10px;color:#e2ece9;font-size:.74rem}

@media(max-width:1220px){.project-study .cs-layout{grid-template-columns:minmax(0,1fr) 290px!important}}
@media(max-width:1020px){.portfolio-archive .hero-inner{grid-template-columns:1fr!important}.portfolio-archive .stats-bar{margin-left:0!important}.services-hub-heading__cta{grid-column:1}.service-process-detailed>li{grid-template-columns:64px minmax(0,1fr)!important}.service-process-detailed dl{grid-column:2!important}.newsletter-preview--contact{grid-template-columns:1fr!important}}
@media(max-width:820px){.project-study .cs-layout{grid-template-columns:1fr!important}}
@media(max-width:900px){.technical-teaser{min-height:0!important}.technical-teaser__shell{grid-template-columns:1fr!important;min-height:0!important}.technical-teaser__ambient{width:100%!important;opacity:.18!important}.technical-teaser__visual{min-height:min(105vw,570px)!important}.portfolio-v2__autoplay-progress{margin-inline:0}.cv-journey-list::before{left:calc(clamp(20px,3vw,38px) + 10px)!important}.cv-journey-item::before{left:10px!important}}
@media(max-width:680px){.services-hub-grid-section{background-size:340px auto!important}.services-hub-heading__botanical{display:none!important}.services-hub-card{min-height:0!important}.services-hub-method{background:#081216!important}.service-process-detailed{padding-inline:0!important}.service-process-detailed>li{grid-template-columns:48px minmax(0,1fr)!important;gap:18px!important;padding-inline:10px!important}.service-process-detailed dl{grid-column:1/-1!important;margin-left:66px!important}.portfolio-archive .stats-bar{width:100%!important}.portfolio-archive .stat-item,.portfolio-archive .stat-item:first-child{min-height:82px!important;padding:14px!important}.portfolio-archive .filter-section{transform:translateY(42%)!important}.portfolio-archive .projects-section{padding-top:126px!important}.cv-journey-list::before{left:21px!important}.cv-journey-item::before{left:5px!important}.blog-quick-contact{grid-template-columns:1fr;padding:18px}.blog-quick-contact__privacy,.blog-quick-contact__message{grid-column:1}.blog-hero-manifesto span:nth-child(1){transform:translateX(-.4em)!important}.blog-hero-manifesto span:nth-child(2){transform:translateX(-.16em)!important}}
@media(prefers-reduced-motion:reduce){.portfolio-v2__autoplay-progress span{animation:none!important}}

/* V2 · cierre de dirección visual y densidad solicitado el 22/08. */

/* El puntero conserva un punto limpio, sin halo. En interacción usa coral
   sakura de alto contraste: se lee sobre papel, tinta y botones koi. */
.neo-pointer::after{
    width:6px!important;
    height:6px!important;
    background:#f16f3e!important;
    box-shadow:none!important;
}
.neo-pointer.is-interactive::before{
    background:
        linear-gradient(#ff4f70,#ff4f70) left top/10px 2px no-repeat,
        linear-gradient(#ff4f70,#ff4f70) left top/2px 10px no-repeat,
        linear-gradient(#ff4f70,#ff4f70) right top/10px 2px no-repeat,
        linear-gradient(#ff4f70,#ff4f70) right top/2px 10px no-repeat,
        linear-gradient(#ff4f70,#ff4f70) left bottom/10px 2px no-repeat,
        linear-gradient(#ff4f70,#ff4f70) left bottom/2px 10px no-repeat,
        linear-gradient(#ff4f70,#ff4f70) right bottom/10px 2px no-repeat,
        linear-gradient(#ff4f70,#ff4f70) right bottom/2px 10px no-repeat!important;
    filter:drop-shadow(0 0 .7px rgba(255,246,229,.94))!important;
}
.neo-pointer.is-interactive::after{
    width:7px!important;
    height:7px!important;
    background:#fff3dc!important;
    box-shadow:none!important;
}

/* El carrusel del portfolio adopta el mismo mando de tres piezas que el
   proceso: flecha, pausa y flecha, sin la cápsula genérica anterior. */
.portfolio-v2__controls{
    display:inline-grid!important;
    grid-template-columns:repeat(3,40px)!important;
    gap:3px!important;
    padding:4px!important;
    border:1px solid rgba(255,243,220,.2)!important;
    border-radius:14px 5px 14px 5px!important;
    background:rgba(4,11,15,.88)!important;
    box-shadow:0 10px 28px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.06)!important;
    backdrop-filter:blur(14px) saturate(120%)!important;
}
.portfolio-v2__controls button,
.portfolio-v2__controls .portfolio-v2__autoplay{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    padding:0!important;
    color:#fff3dc!important;
    border:0!important;
    border-radius:10px 3px 10px 3px!important;
    background:transparent!important;
    box-shadow:none!important;
}
.portfolio-v2__controls button:hover:not(:disabled),
.portfolio-v2__controls button:focus-visible{
    color:#10191d!important;
    background:#fff3dc!important;
    box-shadow:0 7px 17px rgba(0,0,0,.2)!important;
    transform:translateY(-1px)!important;
}
.portfolio-v2__controls .portfolio-v2__autoplay{
    color:#fff8eb!important;
    background:linear-gradient(145deg,#d65032,#9f3228)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.16),0 6px 18px rgba(165,48,35,.3)!important;
}
.portfolio-v2__controls .portfolio-v2__autoplay:hover,
.portfolio-v2__controls .portfolio-v2__autoplay:focus-visible{
    color:#1b120e!important;
    background:linear-gradient(145deg,#ffc18c,#f28a52)!important;
}
.portfolio-v2__autoplay [data-portfolio-autoplay-label]{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
}

/* Servicios: transición continua, aire real antes del contenido y una escena
   editorial compacta en vez de un bloque oscuro sin jerarquía. */
.services-hub-method{
    margin-top:-1px!important;
    padding-block:clamp(104px,9vw,142px) clamp(76px,8vw,118px)!important;
    background:
        linear-gradient(180deg,#eee5d8 0,rgba(19,31,34,.96) 112px,#081216 180px,#081216 100%)!important;
}
.services-hub-method-layout{
    grid-template-columns:minmax(270px,.68fr) minmax(540px,1.32fr)!important;
    gap:clamp(42px,6vw,92px)!important;
    align-items:center!important;
}
.services-hub-method-intro{
    padding:18px 0 18px clamp(22px,2.8vw,38px)!important;
    border-left:2px solid #dc6841;
}
.services-hub-method-intro h2{
    max-width:9.5ch!important;
    margin:14px 0 20px!important;
    font-size:clamp(2.25rem,3.7vw,3.85rem)!important;
}
.services-hub-method-intro>p{max-width:42ch!important;line-height:1.66!important}
.services-hub-method-scene{
    min-height:540px!important;
    border-radius:7px 34px 7px 34px!important;
    background-position:center!important;
}
.services-hub-method-scene ol{gap:6px!important;padding:clamp(24px,3vw,38px)!important}
.services-hub-method-scene li,
.services-hub-method-scene li+li{
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:15px!important;
    padding:13px 15px!important;
    border-radius:4px 15px 4px 15px!important;
}
.services-hub-method-scene li>span{width:38px!important;height:38px!important}
.services-hub-method-scene h3{font-size:clamp(.94rem,1vw,1.05rem)!important}
.services-hub-method-scene p{font-size:.79rem!important;line-height:1.48!important}

/* Las cinco fases de cada servicio se leen en dos columnas en escritorio.
   Se reduce casi a la mitad la altura sin perder entregables ni criterio. */
.service-method.service-section{padding-block:clamp(58px,6vw,82px)!important}
.service-method .service-section-heading{max-width:980px!important;margin-bottom:30px!important}
.service-process-detailed{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    padding:1px!important;
    background:rgba(255,245,226,.08)!important;
    border:1px solid rgba(255,245,226,.1)!important;
    border-radius:6px 24px 6px 24px!important;
}
.service-process-detailed>li{
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr)!important;
    gap:12px 18px!important;
    min-height:0!important;
    padding:21px!important;
    border:1px solid rgba(255,245,226,.08)!important;
    border-radius:4px 17px 4px 17px!important;
    background:rgba(5,15,19,.68)!important;
}
.service-process-detailed>li:last-child{
    grid-column:1/-1!important;
    grid-template-columns:48px minmax(0,.76fr) minmax(300px,1.24fr)!important;
    align-items:center!important;
}
.service-process-detailed h3{margin:1px 0 7px!important;font-size:clamp(1.05rem,1.35vw,1.35rem)!important}
.service-process-detailed p{font-size:.87rem!important;line-height:1.55!important}
.service-process-detailed dl{
    grid-column:2!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin:3px 0 0!important;
}
.service-process-detailed>li:last-child dl{grid-column:3!important;margin:0!important}
.service-process-detailed dl div{padding:10px 11px!important;border-radius:3px 10px 3px 10px!important}
.service-process-detailed dt{margin-bottom:4px!important;font-size:.54rem!important}
.service-process-detailed dd{font-size:.75rem!important;line-height:1.38!important}

/* Sello propio en los casos: inspiración hanko sin recurrir a una palabra
   japonesa decorativa que el visitante no comprendería. */
.portfolio-archive .card-body::after{
    content:'A.N'!important;
    display:grid!important;
    place-items:center!important;
    width:46px!important;
    height:46px!important;
    right:20px!important;
    bottom:17px!important;
    color:rgba(173,56,39,.46)!important;
    border:1px solid rgba(173,56,39,.32)!important;
    border-radius:3px 11px 3px 11px!important;
    font:700 1rem/1 'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',Georgia,serif!important;
    letter-spacing:-.08em!important;
    transform:rotate(-4deg)!important;
}

/* El contacto dentro de cada caso deja de parecer un bloque genérico. */
.case-quick-contact{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    padding:clamp(18px,2vw,24px)!important;
    background:
        linear-gradient(135deg,rgba(4,13,17,.95),rgba(11,29,32,.88)),
        url('../assets/footer-neo-tattoo-full-v9.webp') 58% center/cover no-repeat!important;
    box-shadow:0 24px 64px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.05)!important;
}
.case-quick-contact::before{
    content:'';
    position:absolute;
    z-index:-1;
    inset:0;
    pointer-events:none;
    background:linear-gradient(115deg,transparent 52%,rgba(224,91,52,.11)),radial-gradient(circle at 88% 14%,rgba(240,145,87,.16),transparent 31%);
}
.case-quick-contact :is(input,textarea){background:rgba(3,11,15,.62)!important;backdrop-filter:blur(8px)}

/* Teclas más legibles: cada marca vive sobre una pastilla obsidiana común y
   el nombre conserva contraste independientemente del color de la tecla. */
.cv-midnight .skill-key{padding-top:8px!important}
.cv-midnight .skill-key-icon{
    display:grid!important;
    place-items:center!important;
    width:38px!important;
    height:38px!important;
    margin-inline:auto!important;
    color:#fff4e5!important;
    border:1px solid rgba(255,246,229,.2)!important;
    border-radius:10px 3px 10px 3px!important;
    background:rgba(3,10,14,.82)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.08),0 4px 10px rgba(0,0,0,.16)!important;
}
.cv-midnight .skill-key-icon img{width:29px!important;height:29px!important;max-width:29px!important;object-fit:contain!important;opacity:1!important;filter:none!important}
.cv-midnight .skill-key-icon svg{width:27px!important;height:27px!important}
.cv-midnight .skill-key strong{
    max-width:100%!important;
    color:#fffdf6!important;
    font-size:clamp(.55rem,.58vw,.68rem)!important;
    line-height:1.08!important;
    letter-spacing:-.015em!important;
    text-shadow:0 1px 2px rgba(0,0,0,.9)!important;
}
.cv-midnight .skill-key small{color:rgba(255,255,255,.7)!important}

@media(max-width:1080px){
    .services-hub-method-layout{grid-template-columns:1fr!important}
    .services-hub-method-intro h2{max-width:13ch!important}
    .services-hub-method-scene{min-height:0!important}
    .service-process-detailed{grid-template-columns:1fr!important}
    .service-process-detailed>li:last-child{grid-column:auto!important;grid-template-columns:48px minmax(0,1fr)!important;align-items:start!important}
    .service-process-detailed>li:last-child dl{grid-column:2!important;margin-top:3px!important}
}
@media(max-width:680px){
    .portfolio-v2__controls{grid-template-columns:repeat(3,36px)!important}
    .portfolio-v2__controls button,.portfolio-v2__controls .portfolio-v2__autoplay{width:36px!important;min-width:36px!important;height:36px!important}
    .services-hub-method{padding-block:76px 64px!important;background:#081216!important}
    .services-hub-method-intro{padding:0 0 0 18px!important}
    .services-hub-method-scene ol{padding:18px!important}
    .service-method.service-section{padding-block:48px!important}
    .service-process-detailed>li,
    .service-process-detailed>li:last-child{grid-template-columns:40px minmax(0,1fr)!important;padding:17px 14px!important}
    .service-process-detailed dl,
    .service-process-detailed>li:last-child dl{grid-column:1/-1!important;grid-template-columns:1fr!important;margin:0 0 0 58px!important}
    .cv-midnight .skill-key-icon{width:34px!important;height:34px!important}
    .cv-midnight .skill-key-icon img{width:26px!important;height:26px!important}
}

/* V3 · contraste transversal, formularios y ritmo editorial. */

/* Cursor adaptativo: conserva el punto limpio y cambia de tinta según la
   luminosidad real de la superficie, sin halos ni contornos artificiales. */
.neo-pointer{
    --pointer-core:#e87847;
    --pointer-corners:#ffc08c;
}
.neo-pointer.is-on-light{
    --pointer-core:#963526;
    --pointer-corners:#173944;
}
.neo-pointer.is-on-dark{
    --pointer-core:#ff9155;
    --pointer-corners:#ffd2a8;
}
.neo-pointer::before{filter:none!important}
.neo-pointer::after{
    width:6px!important;
    height:6px!important;
    background:var(--pointer-core)!important;
    border:0!important;
    box-shadow:none!important;
}
.neo-pointer.is-interactive::before{
    background:
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left top/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left top/2px 11px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right top/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right top/2px 11px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left bottom/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left bottom/2px 11px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right bottom/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right bottom/2px 11px no-repeat!important;
    filter:none!important;
}
.neo-pointer.is-interactive::after{
    width:6px!important;
    height:6px!important;
    background:var(--pointer-core)!important;
    border:0!important;
    box-shadow:none!important;
}
.neo-pointer.is-text::before{
    background:
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) center top/9px 1px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) center bottom/9px 1px no-repeat,
        linear-gradient(var(--pointer-core),var(--pointer-core)) center/1.5px 100% no-repeat!important;
    filter:none!important;
}

/* Stepper accesible y coherente para las verificaciones numéricas. */
input[type='number']{-moz-appearance:textfield;appearance:textfield}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.captcha-number-control{position:relative;display:block;min-width:0}
.captcha-number-control>input{width:100%!important;padding-right:45px!important}
.captcha-steppers{
    position:absolute;
    top:4px;
    right:4px;
    bottom:4px;
    display:grid;
    grid-template-rows:1fr 1fr;
    width:34px;
    overflow:hidden;
    border:1px solid rgba(222,105,64,.27);
    border-radius:3px 9px 3px 9px;
    background:rgba(5,14,18,.82);
}
.captcha-steppers button{
    display:grid;
    place-items:center;
    min-width:0;
    min-height:0;
    padding:0;
    color:#ffb077;
    border:0;
    background:transparent;
    font:750 .68rem/1 var(--font-mono);
    cursor:pointer;
}
.captcha-steppers button+button{border-top:1px solid rgba(255,255,255,.1)}
.captcha-steppers button:hover,.captcha-steppers button:focus-visible{color:#10191d;background:#ff9a58;outline:0}

/* Marcas de herramientas difíciles: pastilla clara y saturación controlada. */
.cv-midnight .skill-key[data-skill='ecommerce'] .skill-key-icon,
.cv-midnight .skill-key[data-skill='php'] .skill-key-icon,
.cv-midnight .skill-key[data-skill='electron'] .skill-key-icon{
    background:#fff8ec!important;
    border-color:rgba(240,127,70,.4)!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),0 5px 12px rgba(0,0,0,.18)!important;
}
.cv-midnight .skill-key[data-skill='ecommerce'] .skill-key-icon img,
.cv-midnight .skill-key[data-skill='php'] .skill-key-icon img,
.cv-midnight .skill-key[data-skill='electron'] .skill-key-icon img{
    width:31px!important;
    height:31px!important;
    max-width:31px!important;
    filter:saturate(1.35) contrast(1.12)!important;
}

/* Manifiesto del blog: una única jerarquía tipográfica, alineada a la derecha
   como una inscripción editorial japonesa. */
.blog-hero-manifesto{
    right:clamp(0px,1.2vw,18px)!important;
    justify-items:end!important;
    width:min(48vw,760px)!important;
    font-family:'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',Georgia,serif!important;
    text-align:right!important;
}
.blog-hero-manifesto span,
.blog-hero-manifesto span:nth-child(1),
.blog-hero-manifesto span:nth-child(2),
.blog-hero-manifesto span:nth-child(3){
    display:block!important;
    width:100%!important;
    color:rgba(255,244,226,.14)!important;
    font-family:inherit!important;
    font-size:clamp(3rem,6.3vw,6.9rem)!important;
    font-weight:700!important;
    line-height:.84!important;
    letter-spacing:-.065em!important;
    text-align:right!important;
    transform:none!important;
}
.blog-hero-manifesto span:nth-child(2){color:rgba(239,112,73,.22)!important}

/* Contacto del blog en papel cálido, con ramas en las dos diagonales. */
.newsletter-preview--contact{
    position:relative!important;
    color:#111c20!important;
    border-color:rgba(151,79,52,.2)!important;
    background:
        linear-gradient(115deg,rgba(255,250,240,.96),rgba(245,234,217,.9)),
        url('../assets/portfolio-sakura-branch-v4.webp') left top/52% auto no-repeat,
        url('../assets/portfolio-sakura-branch-v4.webp') right bottom/50% auto no-repeat!important;
    box-shadow:0 24px 68px rgba(65,45,31,.14),inset 0 1px rgba(255,255,255,.9)!important;
}
.newsletter-preview--contact::before,
.newsletter-preview--contact::after{
    content:''!important;
    position:absolute!important;
    z-index:0!important;
    width:min(47%,520px)!important;
    height:58%!important;
    pointer-events:none!important;
    border:0!important;
    border-radius:0!important;
    background:url('../assets/portfolio-sakura-branch-v4.webp') left top/cover no-repeat!important;
    box-shadow:none!important;
    opacity:.52!important;
}
.newsletter-preview--contact::before{top:0!important;left:0!important}
.newsletter-preview--contact::after{right:0!important;bottom:0!important;transform:rotate(180deg)!important}
.newsletter-preview--contact>*{
    position:relative!important;
    z-index:1!important;
}
.newsletter-preview--contact h2{color:#111c20!important}
.newsletter-preview--contact p{color:#596466!important}
.newsletter-preview--contact .section-tag{color:#a94731!important}
.newsletter-preview--contact .blog-quick-contact{
    color:#172126!important;
    border-color:rgba(126,72,48,.2)!important;
    background:rgba(255,252,246,.78)!important;
    box-shadow:0 18px 46px rgba(77,52,34,.1)!important;
    backdrop-filter:blur(14px)!important;
}
.newsletter-preview--contact #contactForm{
    padding:24px!important;
    color:#172126!important;
    border-color:rgba(126,72,48,.2)!important;
    border-radius:4px 24px 4px 24px!important;
    background:rgba(255,252,246,.82)!important;
    box-shadow:0 18px 46px rgba(77,52,34,.1)!important;
}
.newsletter-preview--contact .blog-quick-contact label>span{color:#58656a!important}
.newsletter-preview--contact .blog-quick-contact :is(input,textarea){
    color:#152026!important;
    border-color:rgba(38,55,62,.16)!important;
    background:rgba(255,255,255,.76)!important;
}

/* Las cabeceras de diagnóstico y alcance ya no dejan el párrafo aislado en
   una segunda fila vacía. El texto acompaña al titular en la misma columna. */
.service-diagnostic.service-section,
.service-deliverables.service-section{padding-block:clamp(62px,6vw,88px)!important}
.service-diagnostic .service-section-heading,
.service-deliverables .service-section-heading{
    grid-template-columns:minmax(150px,.34fr) minmax(0,1.66fr)!important;
    grid-template-areas:'kicker title' '. copy'!important;
    gap:14px clamp(34px,5vw,74px)!important;
    margin-bottom:clamp(28px,3vw,42px)!important;
}
.service-diagnostic .service-section-heading>.service-kicker,
.service-deliverables .service-section-heading>.service-kicker{grid-area:kicker!important;padding-top:7px}
.service-diagnostic .service-section-heading>h2,
.service-deliverables .service-section-heading>h2{grid-area:title!important;font-size:clamp(2.35rem,4vw,4rem)!important}
.service-diagnostic .service-section-heading>p,
.service-deliverables .service-section-heading>p{
    grid-area:copy!important;
    max-width:58ch!important;
    margin:0!important;
    font-size:.96rem!important;
    line-height:1.66!important;
}
.service-diagnostic-list{margin-top:0!important}
.service-diagnostic-list li{min-height:170px!important;padding:clamp(23px,3vw,36px)!important}
.service-deliverable-ledger{margin-top:0!important}
.service-deliverable-ledger article{min-height:260px!important;padding:clamp(24px,2.6vw,36px) clamp(19px,2vw,29px)!important}
.service-deliverable-ledger h3{margin:44px 0 12px!important}
body[data-service='apps'] .service-deliverable-ledger article{
    color:#142026!important;
    border-color:rgba(154,75,48,.18)!important;
    background:linear-gradient(155deg,#fffaf0,#f1e3d4)!important;
}
body[data-service='apps'] :is(.service-deliverable-ledger,.service-diagnostic-list,.service-process-detailed) .service-number,
body[data-service='apps'] :is(.service-deliverable-ledger,.service-diagnostic-list,.service-process-detailed) .service-process-index{color:#df7047!important}

/* El método individual conserva su contenido, pero su cabecera deja de ocupar
   media pantalla antes de que aparezca la primera fase. */
.service-method .service-section-heading{
    display:grid!important;
    grid-template-columns:minmax(190px,.45fr) minmax(0,1.55fr)!important;
    grid-template-areas:'kicker title' 'copy title'!important;
    gap:12px clamp(34px,5vw,70px)!important;
    max-width:none!important;
    margin-bottom:28px!important;
}
.service-method .service-section-heading>.service-kicker{grid-area:kicker!important;padding-top:6px}
.service-method .service-section-heading>h2{
    grid-area:title!important;
    margin:0!important;
    color:#fff8ea!important;
    -webkit-text-fill-color:#fff8ea!important;
    font-size:clamp(2.2rem,3.6vw,3.5rem)!important;
    line-height:1.03!important;
}
.service-method .service-section-heading>p{grid-area:copy!important;margin:0!important;font-size:.9rem!important;line-height:1.58!important}
.service-final-cta--midpage{padding-block:clamp(48px,6vw,78px)!important;background:linear-gradient(180deg,#eee5d8,#f8f2e8)!important}

/* Hanko más evidente y contador legible sobre la escena oscura de software. */
.portfolio-archive .card-body::after{
    content:'A.N\A 制作'!important;
    white-space:pre!important;
    width:50px!important;
    height:50px!important;
    color:rgba(154,43,33,.74)!important;
    border:2px solid rgba(176,55,39,.52)!important;
    border-radius:2px 9px 2px 9px!important;
    background:rgba(255,248,235,.46)!important;
    font:700 .82rem/.92 'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',Georgia,serif!important;
    letter-spacing:.02em!important;
    text-align:center!important;
}
.portfolio-archive .cat-group[data-category='apps'] .cat-count{
    color:#fff5e7!important;
    border:1px solid rgba(255,240,220,.25)!important;
    background:#9f3f2f!important;
    box-shadow:0 6px 18px rgba(86,28,20,.18)!important;
}

/* El arte neojaponés del formulario de caso se hace visible sin sacrificar
   contraste en los campos. */
.case-quick-contact{
    border-color:rgba(245,143,87,.42)!important;
    background:
        linear-gradient(115deg,rgba(3,11,15,.94) 0 36%,rgba(4,14,18,.68) 72%,rgba(8,24,27,.62)),
        url('../assets/footer-neo-tattoo-full-v9.webp') 58% center/cover no-repeat!important;
}
.case-quick-contact#contactForm{
    border-color:rgba(245,143,87,.42)!important;
    border-radius:4px 22px 4px 22px!important;
    background:
        linear-gradient(115deg,rgba(3,11,15,.94) 0 36%,rgba(4,14,18,.68) 72%,rgba(8,24,27,.62)),
        url('../assets/footer-neo-tattoo-full-v9.webp') 58% center/cover no-repeat!important;
    box-shadow:0 24px 64px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.05)!important;
}
.case-quick-contact::before{
    background:
        linear-gradient(115deg,transparent 40%,rgba(226,92,52,.14)),
        url('../assets/portfolio-sakura-branch-v4.webp') right bottom/78% auto no-repeat!important;
    opacity:.72!important;
}

@media(max-width:760px){
    .blog-hero-manifesto{right:8px!important;width:72vw!important}
    .blog-hero-manifesto span,.blog-hero-manifesto span:nth-child(n){font-size:clamp(2.25rem,11vw,4.8rem)!important}
    .service-diagnostic .service-section-heading,
    .service-deliverables .service-section-heading,
    .service-method .service-section-heading{
        grid-template-columns:1fr!important;
        grid-template-areas:'kicker' 'title' 'copy'!important;
        gap:12px!important;
    }
    .service-diagnostic .service-section-heading>p,
    .service-deliverables .service-section-heading>p,
    .service-method .service-section-heading>p{margin-top:2px!important}
    .service-deliverable-ledger article{min-height:0!important}
}

/* V4 · coherencia de marca, lectura rápida y fondos específicos. */

/* El hover conserva la respuesta gráfica y hereda la tinta adaptativa de la
   superficie; no vuelve a fijar un color que falle en papel o en tinta. */
.neo-pointer.is-interactive::before{
    background:
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left top/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left top/2px 11px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right top/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right top/2px 11px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left bottom/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left bottom/2px 11px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right bottom/11px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right bottom/2px 11px no-repeat!important;
    filter:none!important;
}
.neo-pointer.is-interactive::after{
    width:6px!important;
    height:6px!important;
    background:var(--pointer-core)!important;
    border:0!important;
    box-shadow:none!important;
}

/* Home · Sobre mí: progreso profesional como huella secundaria, menos altura
   y un acceso inspirado en un pequeño sello editorial, no en una flecha UI. */
.technical-teaser{
    min-height:0!important;
    padding-block:clamp(50px,5.7vw,74px)!important;
}
.technical-teaser__ambient{
    inset:10% auto 10% 0!important;
    width:min(38vw,560px)!important;
    height:auto!important;
    opacity:.62!important;
    transform:none!important;
    background:
        linear-gradient(90deg,rgba(4,12,16,.14),rgba(4,12,16,.45) 64%,rgba(4,12,16,.98)),
        url('../assets/about-home-growth-v1.webp') left center/cover no-repeat!important;
    -webkit-mask-image:linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent)!important;
    mask-image:linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent)!important;
}
.technical-teaser__shell{
    min-height:0!important;
    grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr)!important;
    gap:clamp(34px,5vw,76px)!important;
}
.technical-teaser__copy h2{font-size:clamp(2.45rem,4.3vw,4.7rem)!important}
.technical-teaser__proof{margin-block:20px 25px!important}
.technical-teaser__proof>div{min-height:96px!important;padding:17px 16px!important}
.technical-teaser__visual{
    min-height:clamp(430px,38vw,540px)!important;
    max-height:540px!important;
    align-self:center!important;
}
.technical-teaser__visual>i{
    top:22px!important;
    right:22px!important;
    width:45px!important;
    color:#fff5e5!important;
    border:1px solid rgba(255,246,229,.32)!important;
    border-radius:3px 13px 3px 13px!important;
    background:linear-gradient(145deg,#c94f36,#923328)!important;
    box-shadow:0 10px 24px rgba(0,0,0,.24)!important;
    font:800 .64rem/1 'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',serif!important;
    letter-spacing:.03em!important;
}
.technical-teaser__visual:hover>i,
.technical-teaser__visual:focus-visible>i{
    color:#182126!important;
    background:#fff2dc!important;
    transform:translateY(-2px)!important;
}

/* Sello reutilizable: 制作 significa creación/producción. */
.portfolio-v2-card__body{position:relative!important;padding-bottom:62px!important}
.portfolio-v2-card__body::after{
    content:'A.N\A 制作';
    position:absolute;
    right:17px;
    bottom:14px;
    display:grid;
    place-items:center;
    width:47px;
    height:47px;
    white-space:pre;
    color:#9f382c;
    border:2px solid rgba(159,56,44,.5);
    border-radius:2px 10px 2px 10px;
    background:rgba(255,248,236,.66);
    font:900 .78rem/.9 'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',Georgia,serif;
    letter-spacing:-.02em;
    text-align:center;
    transform:rotate(-3deg);
    pointer-events:none;
}
.portfolio-archive .card-body::after{
    font-family:'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',Georgia,serif!important;
    font-weight:900!important;
    letter-spacing:-.01em!important;
}
.an-hanko{
    display:inline-grid!important;
    place-items:center!important;
    width:56px!important;
    height:56px!important;
    margin-top:12px!important;
    color:#ef8a5b!important;
    border:2px solid rgba(239,117,73,.62)!important;
    border-radius:3px 13px 3px 13px!important;
    background:rgba(5,14,18,.42)!important;
    transform:rotate(-3deg)!important;
}
.an-hanko strong,.an-hanko small{
    display:block!important;
    color:inherit!important;
    font-family:'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',Georgia,serif!important;
    line-height:.9!important;
}
.an-hanko strong{font-size:.96rem!important;letter-spacing:-.06em!important}
.an-hanko small{font-size:.62rem!important;letter-spacing:.08em!important}

/* Servicios conectados: nueva imagen nítida, sin el velo pixelado anterior. */
.services-hub-grid-section{
    background:
        linear-gradient(90deg,rgba(250,246,237,.7),rgba(250,246,237,.8) 48%,rgba(250,246,237,.97)),
        url('../assets/services-crescent-v8.webp') left top/min(42vw,680px) auto no-repeat,
        #f7f1e7!important;
}

/* Alcance: una sola familia de papel y un hover limpio. */
.service-deliverable-ledger{
    overflow:hidden!important;
    gap:0!important;
    border:1px solid rgba(93,70,52,.15)!important;
    border-radius:5px 24px 5px 24px!important;
    background:#f6eee2!important;
}
body[data-service] .service-deliverable-ledger article,
body[data-service] .service-deliverable-ledger article:nth-child(n){
    min-height:235px!important;
    color:#142026!important;
    border-color:rgba(93,70,52,.14)!important;
    background:linear-gradient(155deg,rgba(255,252,246,.94),rgba(244,234,219,.9))!important;
    box-shadow:none!important;
}
body[data-service] .service-deliverable-ledger article:hover{
    z-index:1!important;
    color:#142026!important;
    border-color:rgba(196,76,49,.28)!important;
    background:#fffaf1!important;
    box-shadow:0 18px 42px rgba(71,47,32,.1)!important;
    transform:translateY(-4px)!important;
}
.service-deliverable-ledger h3{
    color:#172126!important;
    font-family:var(--font-display)!important;
    font-weight:720!important;
}
.service-deliverable-ledger p{color:#596466!important}

/* Método de cada servicio: lectura inicial corta y detalle bajo demanda. */
.service-method::after{display:none!important}
.service-method.service-section{padding-block:clamp(50px,5vw,70px)!important}
.service-process-detailed{gap:8px!important}
.service-process-detailed>li,
.service-process-detailed>li:last-child{
    grid-column:auto!important;
    grid-template-columns:44px minmax(0,1fr)!important;
    align-items:start!important;
    padding:18px!important;
}
.service-process-copy{min-width:0}
.service-process-detailed h3{font-size:clamp(1rem,1.2vw,1.22rem)!important}
.service-process-detailed p{margin:0!important;font-size:.8rem!important;line-height:1.48!important}
.service-process-more{
    grid-column:2!important;
    margin-top:2px!important;
    border-top:1px solid rgba(255,245,226,.09)!important;
}
.service-process-more summary{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    padding:10px 0 2px!important;
    color:#f0a06f!important;
    font:700 .62rem/1.35 var(--font-mono)!important;
    letter-spacing:.06em!important;
    text-transform:uppercase!important;
    cursor:pointer!important;
    list-style:none!important;
}
.service-process-more summary::-webkit-details-marker{display:none}
.service-process-more summary span{font-size:1rem!important;transition:transform .25s ease!important}
.service-process-more[open] summary span{transform:rotate(45deg)!important}
.service-process-more dl{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    margin:8px 0 0!important;
}

/* Los casos relacionados continúan el lenguaje visual de cada servicio. */
.service-projects{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    background:#081216!important;
}
.service-projects::before{
    content:'';
    position:absolute;
    z-index:0;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(90deg,rgba(5,14,19,.98),rgba(5,14,19,.88) 50%,rgba(5,14,19,.62)),
        var(--service-context-art) 82% center/cover no-repeat;
    opacity:.64;
}
.service-projects>.service-shell{position:relative!important;z-index:1!important}

/* Portfolio: software más luminoso, contador sin pastilla ajena al diseño y
   eliminación del adorno superior que podía leerse como un ojo. */
.portfolio-archive .cat-group[data-category='apps']::before{
    background:
        linear-gradient(90deg,rgba(245,238,227,.97) 0 20%,rgba(245,238,227,.76) 55%,rgba(245,238,227,.42)),
        url('../assets/portfolio-software-workshop-v2.webp') center/cover no-repeat,
        #f5eee3!important;
}
.portfolio-archive .cat-group[data-category='apps'] .cat-count{
    color:#85372c!important;
    border:0!important;
    border-bottom:1px solid rgba(133,55,44,.32)!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    font-weight:800!important;
}
.portfolio-archive .project-card::after{content:none!important;display:none!important}

/* Contacto de caso: se conserva el tatuaje neojaponés y se elimina la rama
   superpuesta que atravesaba la verificación y el botón. */
.case-quick-contact::before{
    background:
        linear-gradient(115deg,transparent 44%,rgba(226,92,52,.13)),
        radial-gradient(circle at 86% 16%,rgba(240,145,87,.13),transparent 30%)!important;
    opacity:1!important;
}

@media(max-width:900px){
    .technical-teaser__ambient{
        inset:0!important;
        width:100%!important;
        opacity:.3!important;
        background-position:left center!important;
        background-size:auto 100%!important;
    }
    .technical-teaser__shell{grid-template-columns:1fr!important}
    .technical-teaser__visual{max-height:none!important}
}
@media(max-width:680px){
    .portfolio-v2-card__body{padding-bottom:58px!important}
    .services-hub-grid-section{background-size:420px auto!important}
    .service-process-detailed>li,
    .service-process-detailed>li:last-child{grid-template-columns:38px minmax(0,1fr)!important;padding:15px 13px!important}
    .service-process-more{grid-column:1/-1!important;margin-left:54px!important}
    .service-process-more dl{grid-template-columns:1fr!important}
}

/* V5 · servicios: raster de alta densidad, transición corta y método sin
   celdas vacías. Este bloque prevalece sobre las iteraciones anteriores. */
.services-hub-grid-section{
    padding-bottom:clamp(38px,4vw,58px)!important;
    background:
        linear-gradient(90deg,rgba(250,246,237,.66),rgba(250,246,237,.8) 48%,rgba(250,246,237,.97)),
        url('../assets/services-crescent-v9.webp') left top/min(42vw,680px) auto no-repeat,
        #f7f1e7!important;
}
.services-hub-method{
    margin-top:-1px!important;
    padding-block:clamp(72px,6.5vw,96px) clamp(72px,7vw,104px)!important;
    background:
        linear-gradient(180deg,
            #f7f1e7 0,
            rgba(130,137,134,.72) 16px,
            rgba(23,36,40,.96) 40px,
            #081216 58px,
            #081216 100%)!important;
}
.service-method.service-section{padding-block:clamp(44px,4.6vw,62px)!important}
.service-method .service-section-heading{margin-bottom:20px!important}

@media(min-width:1181px){
    .service-process-detailed{grid-template-columns:repeat(6,minmax(0,1fr))!important}
    .service-process-detailed>li,
    .service-process-detailed>li:last-child{
        grid-column:span 2!important;
        grid-template-columns:44px minmax(0,1fr)!important;
    }
    .service-process-detailed>li:nth-child(n+4){grid-column:span 3!important}
}
@media(min-width:681px) and (max-width:1180px){
    .service-process-detailed{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .service-process-detailed>li,
    .service-process-detailed>li:last-child{
        grid-column:auto!important;
        grid-template-columns:42px minmax(0,1fr)!important;
    }
    .service-process-detailed>li:last-child{grid-column:1/-1!important}
}
@media(max-width:680px){
    .services-hub-grid-section{
        background:
            linear-gradient(90deg,rgba(250,246,237,.7),rgba(250,246,237,.88) 58%,rgba(250,246,237,.98)),
            url('../assets/services-crescent-v9-mobile.webp') left top/420px auto no-repeat,
            #f7f1e7!important;
    }
    .services-hub-method{
        padding-block:62px 64px!important;
        background:linear-gradient(180deg,#f7f1e7 0,rgba(35,48,51,.95) 30px,#081216 44px,#081216 100%)!important;
    }
    .service-method.service-section{padding-block:42px!important}
    .service-method .service-section-heading{margin-bottom:16px!important}
    .service-process-detailed{grid-template-columns:1fr!important}
    .service-process-detailed>li,
    .service-process-detailed>li:last-child{grid-column:auto!important}
}

/* V6 · contraste de interacción y movimiento editorial. */
.neo-pointer.is-on-light{
    --pointer-core:#943024;
    --pointer-corners:#b63e2d;
}
.neo-pointer.is-on-dark{
    --pointer-core:#ff9155;
    --pointer-corners:#ffd2a8;
}

.portfolio-archive .filter-tab:hover,
.portfolio-archive .filter-tab:focus-visible{
    color:#8f3126!important;
    border-color:rgba(178,62,43,.2)!important;
    background:rgba(193,72,45,.1)!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.38)!important;
}
.portfolio-archive .filter-tab.active,
.portfolio-archive .filter-tab[aria-pressed='true']{
    color:#fff8ec!important;
    border-color:#a94431!important;
    background:linear-gradient(135deg,#9f382d,#d56a43)!important;
    box-shadow:0 8px 20px rgba(133,45,34,.17)!important;
}
.portfolio-archive .filter-tab.active::after,
.portfolio-archive .filter-tab[aria-pressed='true']::after{opacity:0!important}

.service-method,.service-process-more{overflow-anchor:none}
.service-process-more.is-opening,
.service-process-more.is-closing{will-change:height}
.service-process-more.is-closing summary span{transform:rotate(0deg)!important}

.blog-hero-manifesto{
    right:clamp(12px,2.6vw,44px)!important;
    width:min(43vw,650px)!important;
}
.blog-hero-manifesto span,
.blog-hero-manifesto span:nth-child(n){
    color:rgba(255,244,226,.14)!important;
    font-family:var(--font-mono)!important;
    font-size:clamp(2rem,4.2vw,4.6rem)!important;
    font-weight:650!important;
    line-height:.92!important;
    letter-spacing:.025em!important;
    text-align:right!important;
    transform:none!important;
}
.blog-hero-manifesto span:nth-child(2){color:rgba(239,112,73,.23)!important}
@media(max-width:760px){
    .blog-hero-manifesto{right:12px!important;width:74vw!important}
    .blog-hero-manifesto span,
    .blog-hero-manifesto span:nth-child(n){font-size:clamp(1.5rem,7.4vw,3.1rem)!important}
}

/* V13 · cierre de cascada para el avance Sobre mí de la home. Este bloque
   debe permanecer al final para prevalecer sobre las iteraciones históricas. */
.technical-teaser{
    background:
        radial-gradient(circle at 82% 18%,rgba(211,83,42,.13),transparent 30%),
        linear-gradient(135deg,#061116 0%,#09171c 54%,#050c10 100%)!important;
}
.technical-teaser__ambient{
    inset:0 auto 0 0!important;
    width:min(52vw,840px)!important;
    height:100%!important;
    opacity:.58!important;
    transform:none!important;
    background:
        linear-gradient(90deg,rgba(6,17,22,.08) 0%,rgba(6,17,22,.2) 48%,rgba(6,17,22,.96) 91%,#061116 100%),
        linear-gradient(180deg,#061116 0%,transparent 9%,transparent 91%,#061116 100%),
        url('../assets/about-focus-torii-v3.webp') 34% center/cover no-repeat!important;
    -webkit-mask-image:linear-gradient(90deg,#000 0 78%,transparent 100%)!important;
    mask-image:linear-gradient(90deg,#000 0 78%,transparent 100%)!important;
    filter:saturate(.86) contrast(1.04)!important;
}
.technical-teaser__shell{
    grid-template-columns:minmax(0,.96fr) minmax(420px,1.04fr)!important;
    gap:clamp(38px,5.2vw,78px)!important;
}
.technical-teaser__copy{position:relative;z-index:1!important}
.technical-teaser__cta{
    display:flex!important;
    width:max-content!important;
    margin-inline:auto!important;
    color:#fff5e8!important;
}
.technical-teaser__visual{
    width:min(100%,640px)!important;
    min-height:clamp(410px,34vw,480px)!important;
    max-height:480px!important;
    justify-self:end!important;
    align-self:center!important;
}
.technical-teaser__visual img{object-position:64% center!important}
.technical-teaser__visual>i{display:none!important}

@media(max-width:900px){
    .technical-teaser__ambient{
        inset:0!important;
        width:100%!important;
        height:100%!important;
        opacity:.28!important;
        background-position:center,left center,24% center!important;
        background-size:cover,cover,cover!important;
        -webkit-mask-image:none!important;
        mask-image:none!important;
    }
    .technical-teaser__shell{grid-template-columns:1fr!important}
    .technical-teaser__visual{
        width:100%!important;
        min-height:min(72vw,510px)!important;
        max-height:510px!important;
        justify-self:stretch!important;
    }
}
@media(max-width:620px){
    .technical-teaser__proof{grid-template-columns:1fr!important}
    .technical-teaser__proof>div{min-height:0!important}
    .technical-teaser__cta{width:100%!important;justify-content:center!important;text-align:center!important}
    .technical-teaser__visual{min-height:min(93vw,470px)!important}
}

/* ========================================================================
   V14 · AJUSTES FINALES 2026-08-23
   Servicios nítidos, superficies coherentes y contacto transversal.
   ======================================================================== */

/* Servicios: el raster se dibuja sin una capa lechosa encima. El velo solo
   aparece donde empieza el contenido, por lo que la vegetación conserva el
   detalle y las tarjetas siguen siendo legibles. */
.services-hub-grid-section{
    position:relative!important;
    isolation:isolate!important;
    overflow:clip!important;
    padding-bottom:clamp(26px,3vw,42px)!important;
    background:#f7f1e7!important;
}
.services-hub-grid-section::before{
    content:''!important;
    position:absolute!important;
    z-index:0!important;
    inset:0 auto 0 0!important;
    width:min(45vw,720px)!important;
    height:100%!important;
    opacity:1!important;
    background:url('../assets/services-crescent-v10.webp') left top/100% auto no-repeat!important;
    filter:none!important;
    transform:none!important;
    pointer-events:none!important;
}
.services-hub-grid-section::after{
    content:''!important;
    position:absolute!important;
    z-index:0!important;
    inset:0!important;
    width:auto!important;
    height:auto!important;
    opacity:1!important;
    background:linear-gradient(90deg,
        rgba(247,241,231,.05) 0%,
        rgba(247,241,231,.14) 25%,
        rgba(247,241,231,.58) 43%,
        rgba(247,241,231,.94) 65%,
        #f7f1e7 82%)!important;
    filter:none!important;
    transform:none!important;
    pointer-events:none!important;
}
.services-hub-grid-section>.service-shell{position:relative!important;z-index:1!important}

/* La transición elimina la franja desenfocada: un cambio de tinta breve y
   controlado sustituye al degradado gris de casi sesenta píxeles. */
.services-hub-method{
    margin-top:0!important;
    padding-block:clamp(54px,5vw,72px) clamp(68px,7vw,96px)!important;
    border-top:1px solid rgba(18,38,43,.16)!important;
    background:linear-gradient(180deg,#14262b 0,#0b181c 16px,#081216 34px,#081216 100%)!important;
    box-shadow:inset 0 18px 30px -32px rgba(0,0,0,.55)!important;
}

/* Cursor: las esquinas expresan la superficie (tinta en papel y crema sobre
   tinta). El núcleo conserva el koi, con un matiz más oscuro en fondos claros. */
.neo-pointer.is-on-light{
    --pointer-core:#9f3d2a!important;
    --pointer-corners:#121a1e!important;
}
.neo-pointer.is-on-dark{
    --pointer-core:#f27b43!important;
    --pointer-corners:#fff2dd!important;
}

/* Home · portfolio: la captura ocupa dos tercios de la altura anterior para
   que el carrusel enseñe caso, contexto y CTA en un solo vistazo. */
.portfolio-v2-card__media,
.portfolio-v2-card__placeholder{aspect-ratio:12/5!important}

/* Home · Sobre mí: se pausa el paisaje de torii y la narrativa queda en una
   escena midnight continua. Dos focos discretos equilibran texto e imagen. */
.technical-teaser{
    background:
        radial-gradient(circle at 87% 10%,rgba(221,96,53,.19),transparent 24%),
        radial-gradient(circle at 10% 88%,rgba(224,91,54,.16),transparent 25%),
        linear-gradient(135deg,#061116 0%,#09171c 54%,#050c10 100%)!important;
}
.technical-teaser__ambient{display:none!important}
.technical-teaser__visual img{object-position:76% center!important}

/* Portfolio · software: fotografía diurna real y contador idéntico al resto. */
.portfolio-archive .cat-group[data-category='apps']::before{
    background:
        linear-gradient(90deg,rgba(245,238,227,.98) 0 15%,rgba(245,238,227,.72) 48%,rgba(245,238,227,.22)),
        url('../assets/portfolio-software-workshop-v3.webp') center/cover no-repeat,
        #f5eee3!important;
    filter:none!important;
}
.portfolio-archive .cat-group[data-category='apps'] .cat-count,
.portfolio-archive .cat-count{
    color:#59666b!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    font-weight:700!important;
}

/* Formulario compacto al final del archivo de proyectos. */
.archive-quick-contact{
    position:relative;
    isolation:isolate;
    display:grid;
    grid-template-columns:minmax(0,.82fr) minmax(440px,1.18fr);
    gap:clamp(32px,6vw,86px);
    align-items:center;
    width:min(1180px,calc(100% - 48px));
    margin:clamp(46px,6vw,82px) auto clamp(62px,7vw,96px);
    padding:clamp(30px,4vw,54px);
    overflow:hidden;
    color:#172126;
    border:1px solid rgba(126,72,48,.18);
    border-radius:5px 30px 5px 30px;
    background:
        linear-gradient(110deg,rgba(255,251,243,.97),rgba(246,235,218,.9)),
        url('../assets/portfolio-sakura-branch-v4.webp') left top/48% auto no-repeat,
        #f7f1e7;
    box-shadow:0 24px 66px rgba(67,48,34,.12);
}
.archive-quick-contact::after{
    content:'';
    position:absolute;
    z-index:-1;
    right:-7%;
    bottom:-42%;
    width:45%;
    aspect-ratio:1;
    opacity:.14;
    background:url('../assets/footer-neo-tattoo-full-v9.webp') center/cover;
    border-radius:50%;
}
.archive-quick-contact__copy>span{color:#a94731;font:800 .66rem/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}
.archive-quick-contact__copy h2{max-width:12ch;margin:12px 0 16px;color:#111c20;font:700 clamp(2.2rem,4vw,4rem)/.98 var(--font-display);letter-spacing:-.06em}
.archive-quick-contact__copy p{max-width:52ch;margin:0;color:#596466;line-height:1.7}
.archive-quick-contact__form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:24px;border:1px solid rgba(126,72,48,.18);border-radius:4px 22px 4px 22px;background:rgba(255,252,246,.88);box-shadow:0 18px 46px rgba(77,52,34,.09)}
.archive-quick-contact__form>.contact-v2__honeypot,.archive-quick-contact__form>input[type='hidden']{display:none!important}
.archive-quick-contact__form label{display:grid;gap:6px;min-width:0}
.archive-quick-contact__form label>span{color:#566267;font-size:.68rem}
.archive-quick-contact__form :is(input,textarea){width:100%;min-height:46px;padding:11px 13px;color:#152026;border:1px solid rgba(38,55,62,.16);border-radius:4px 11px;background:#fffdf8;outline:0}
.archive-quick-contact__form :is(input,textarea)::placeholder{color:#817d76;opacity:1}
.archive-quick-contact__message-field,.archive-quick-contact__privacy,.archive-quick-contact__status{grid-column:1/-1}
.archive-quick-contact__privacy{grid-template-columns:auto 1fr!important;align-items:start}.archive-quick-contact__privacy input{width:17px;min-height:17px;margin-top:2px;accent-color:#c94e32}.archive-quick-contact__privacy a{color:#9f3d2a;text-decoration:underline}
.archive-quick-contact__form>button[type='submit']{min-height:48px;color:#fff8ec;border:0;border-radius:4px 14px;background:linear-gradient(135deg,#9f382d,#d56a43);font-weight:800}
.archive-quick-contact__status{padding:10px;color:#39474d;font-size:.76rem}

/* Blog: filtro editorial en la frontera del hero, orden independiente y sin
   una columna vacía a la derecha. */
.blog-hero-midnight{min-height:min(740px,78svh)!important;padding-bottom:clamp(92px,10vh,124px)!important}
.blog-filter-dock{
    position:relative;
    z-index:25;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px 18px;
    align-items:center;
    width:min(1180px,calc(100% - 48px));
    margin:0 auto;
    padding:10px;
    border:1px solid rgba(7,17,26,.14);
    border-radius:28px;
    background:rgba(255,252,246,.96);
    box-shadow:0 22px 62px rgba(2,10,16,.22),inset 0 1px rgba(255,255,255,.9);
    transform:translateY(-50%);
}
.blog-filter-dock .blog-filters{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.blog-filter-dock .blog-filter-status{grid-column:1/-1;min-height:0;margin:0;padding:0 12px 3px;text-align:left}
.blog-sort-control{display:flex;align-items:center;gap:9px;padding:4px 5px 4px 12px;color:#58646a;font:700 .66rem/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.blog-sort-control select{min-height:42px;padding:0 34px 0 13px;color:#172126;border:1px solid rgba(7,17,26,.14);border-radius:999px;background:#fffdf8;font:700 .77rem var(--font-body);cursor:pointer}
.blog-index-section{margin-top:calc(-1 * clamp(30px,3vw,42px))!important;padding-top:clamp(72px,7vw,94px)!important}

/* El contacto del blog es una única superficie de papel, no dos cajas grises. */
.newsletter-preview--contact{
    background:
        linear-gradient(115deg,rgba(255,251,243,.98),rgba(247,237,222,.94)),
        url('../assets/portfolio-sakura-branch-v4.webp') left top/45% auto no-repeat,
        url('../assets/portfolio-sakura-branch-v4.webp') right bottom/43% auto no-repeat,
        #f7f1e7!important;
}
.newsletter-preview--contact::before,.newsletter-preview--contact::after{opacity:.2!important}
.newsletter-preview--contact #contactForm,
.newsletter-preview--contact .blog-quick-contact{
    border-color:rgba(126,72,48,.16)!important;
    background:rgba(255,252,246,.93)!important;
    box-shadow:0 16px 40px rgba(77,52,34,.08)!important;
}
.newsletter-preview--contact .blog-quick-contact :is(input,textarea){color:#152026!important;border-color:rgba(38,55,62,.16)!important;background:#fffdf8!important}
.newsletter-preview--contact .blog-quick-contact :is(input,textarea)::placeholder{color:#817d76!important;opacity:1!important}

@media(max-width:900px){
    .services-hub-grid-section::before{width:min(76vw,620px)!important;opacity:.72!important}
    .services-hub-grid-section::after{background:linear-gradient(90deg,rgba(247,241,231,.22),rgba(247,241,231,.76) 58%,#f7f1e7 100%)!important}
    .archive-quick-contact{grid-template-columns:1fr}
    .blog-filter-dock{grid-template-columns:1fr;transform:translateY(-38%)}
    .blog-filter-dock .blog-filter-status{grid-column:1}
    .blog-sort-control{justify-self:start}
}
@media(max-width:680px){
    .services-hub-grid-section::before{width:100%!important;background-image:url('../assets/services-crescent-v10.webp')!important;background-size:auto 720px!important;background-position:left top!important;opacity:.5!important}
    .services-hub-grid-section::after{background:rgba(247,241,231,.73)!important}
    .services-hub-method{padding-block:50px 62px!important;background:#081216!important}
    .portfolio-v2-card__media,.portfolio-v2-card__placeholder{aspect-ratio:16/8!important}
    .technical-teaser__visual img{object-position:72% center!important}
    .archive-quick-contact{width:calc(100% - 32px);padding:24px 18px}.archive-quick-contact__form{grid-template-columns:1fr;padding:18px}.archive-quick-contact__message-field,.archive-quick-contact__privacy,.archive-quick-contact__status{grid-column:1}
    .blog-hero-midnight{min-height:82svh!important}
    .blog-filter-dock{width:calc(100% - 28px);padding:8px;border-radius:20px;transform:translateY(-28%)}
    .blog-sort-control{width:100%;justify-content:space-between;padding-inline:8px}.blog-sort-control select{flex:1;max-width:210px}
    .blog-index-section{margin-top:-26px!important;padding-top:78px!important}
}

/* ========================================================================
   V15 · DENSIDAD, CONTINUIDAD Y CONTRASTE REAL (2026-08-23)
   ======================================================================== */

/* Inicio · las capturas dejan de heredar los 350 px globales de .img-contained.
   Se conserva toda la captura, sin recorte ni filtros que resten nitidez. */
.portfolio-v2-card__media,
.portfolio-v2-card__placeholder{
    height:clamp(205px,18vw,230px)!important;
    min-height:0!important;
    aspect-ratio:auto!important;
}
.portfolio-v2-card__media{
    padding:8px!important;
    background:#081216!important;
}
.portfolio-v2-card__media img{
    width:100%!important;
    height:100%!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center!important;
    image-rendering:auto!important;
    filter:none!important;
}
.portfolio-v2-card__body{
    min-height:0!important;
    padding:clamp(16px,1.7vw,21px) clamp(17px,1.8vw,22px) 54px!important;
}
.portfolio-v2-card__body p{
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
.technical-teaser__visual img{object-position:84% center!important}

/* Servicios · tríptico vertical continuo. Cada imagen mantiene su resolución
   nativa y solapa ligeramente con la siguiente para que no aparezcan cortes. */
.services-hub-grid-section::before{
    width:min(52vw,720px)!important;
    height:100%!important;
    opacity:1!important;
    background:
        url('../assets/services-crescent-lower-v11.webp') left bottom/100% auto no-repeat,
        url('../assets/services-crescent-middle-v11.webp') left center/100% auto no-repeat,
        url('../assets/services-crescent-v10.webp') left top/100% auto no-repeat!important;
    filter:none!important;
}
.services-hub-grid-section::after{
    background:linear-gradient(90deg,
        rgba(247,241,231,.02) 0%,
        rgba(247,241,231,.08) 24%,
        rgba(247,241,231,.36) 43%,
        rgba(247,241,231,.82) 66%,
        #f7f1e7 84%)!important;
}
.services-hub-heading{
    background:rgba(255,250,240,.48)!important;
    -webkit-backdrop-filter:blur(5px)!important;
    backdrop-filter:blur(5px)!important;
}
.services-hub-heading__botanical{
    display:block!important;
    top:-12px!important;
    right:-8px!important;
    bottom:auto!important;
    width:clamp(190px,23vw,340px)!important;
    height:clamp(145px,18vw,260px)!important;
    opacity:.38!important;
    border-radius:0!important;
    background-position:right top!important;
    background-size:contain!important;
    -webkit-mask-image:linear-gradient(225deg,#000 0 38%,rgba(0,0,0,.7) 58%,transparent 88%)!important;
    mask-image:linear-gradient(225deg,#000 0 38%,rgba(0,0,0,.7) 58%,transparent 88%)!important;
}

/* FAQs · cada respuesta respira y el control queda separado del texto. */
.service-faq-list{
    display:grid!important;
    gap:10px!important;
    border-top:0!important;
}
.service-faq-list details{
    overflow:hidden!important;
    border:1px solid rgba(38,55,62,.13)!important;
    border-radius:4px 18px 4px 18px!important;
    background:rgba(255,252,246,.66)!important;
    transition:transform .28s ease,border-color .28s ease,background .28s ease,box-shadow .28s ease!important;
}
.service-faq-list details:hover,
.service-faq-list details:focus-within{
    transform:translateY(-2px)!important;
    border-color:rgba(190,73,43,.34)!important;
    background:rgba(255,252,246,.92)!important;
    box-shadow:0 12px 28px rgba(69,48,34,.08)!important;
}
.service-faq-list summary{
    align-items:center!important;
    gap:26px!important;
    padding:20px 22px!important;
}
.service-faq-list summary span{
    display:grid!important;
    flex:0 0 34px!important;
    width:34px!important;
    height:34px!important;
    place-items:center!important;
    color:#a6402d!important;
    border:1px solid rgba(166,64,45,.28)!important;
    border-radius:50%!important;
    background:rgba(255,250,240,.7)!important;
    font-size:1.05rem!important;
}
.service-faq-list details p{
    margin:-2px 58px 22px 22px!important;
    padding-top:15px!important;
    border-top:1px solid rgba(38,55,62,.1)!important;
}

/* Cursor · las cuatro escuadras también reaccionan en reposo a la superficie.
   En papel son tinta; en midnight son marfil. */
.neo-pointer::before{
    width:20px!important;
    height:20px!important;
    opacity:.94!important;
    background:
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left top/7px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left top/2px 7px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right top/7px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right top/2px 7px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left bottom/7px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) left bottom/2px 7px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right bottom/7px 2px no-repeat,
        linear-gradient(var(--pointer-corners),var(--pointer-corners)) right bottom/2px 7px no-repeat!important;
    filter:none!important;
    box-shadow:none!important;
}
.neo-pointer::after{
    width:7px!important;
    height:7px!important;
    background:var(--pointer-core)!important;
    box-shadow:none!important;
    filter:none!important;
}

/* Blog · el filtro cruza una sola vez la frontera del hero, igual que Portfolio. */
.blog-filter-dock{
    display:flex!important;
    min-height:62px!important;
    padding:8px!important;
    border-radius:999px!important;
}
.blog-filter-dock .blog-filters{flex:1 1 auto!important;min-width:0!important}
.blog-filter-dock .blog-filter-status{
    position:absolute!important;
    top:calc(100% + 10px)!important;
    left:50%!important;
    width:max-content!important;
    max-width:calc(100% - 24px)!important;
    margin:0!important;
    padding:0!important;
    transform:translateX(-50%)!important;
    text-align:center!important;
}
.blog-sort-control{flex:0 0 auto!important}
.blog-index-section{
    margin-top:-62px!important;
    padding-top:clamp(104px,9vw,132px)!important;
}
.blog-index-section::before{top:0!important}

/* El ID del formulario tenía más especificidad que las reglas editoriales.
   Estos selectores garantizan papel claro, texto tinta y placeholders legibles. */
.newsletter-preview--contact{
    background-color:#f7f1e7!important;
    background-blend-mode:normal!important;
}
.newsletter-preview--contact #contactForm{
    color:#172126!important;
    background:rgba(255,252,246,.96)!important;
}
.newsletter-preview--contact #contactForm :is(input,textarea,select){
    color:#172126!important;
    border:1px solid rgba(42,58,63,.2)!important;
    background:#fffdf8!important;
    box-shadow:none!important;
}
.newsletter-preview--contact #contactForm :is(input,textarea,select)::placeholder{
    color:#7a7770!important;
    opacity:1!important;
}
.newsletter-preview--contact #contactForm :is(input,textarea,select):focus{
    border-color:#b44831!important;
    box-shadow:0 0 0 3px rgba(180,72,49,.12)!important;
}

@media(max-width:900px){
    .services-hub-grid-section::before{width:min(76vw,620px)!important}
    .technical-teaser__visual img{object-position:78% center!important}
    .blog-filter-dock{display:grid!important;grid-template-columns:1fr!important;border-radius:22px!important}
    .blog-filter-dock .blog-filter-status{white-space:normal!important}
}
@media(max-width:680px){
    .portfolio-v2-card__media,.portfolio-v2-card__placeholder{height:clamp(188px,58vw,230px)!important;aspect-ratio:auto!important}
    .services-hub-grid-section::before{
        width:100%!important;
        background:
            url('../assets/services-crescent-lower-v11.webp') left bottom/100% auto no-repeat,
            url('../assets/services-crescent-middle-v11.webp') left center/100% auto no-repeat,
            url('../assets/services-crescent-v10.webp') left top/100% auto no-repeat!important;
        opacity:.5!important;
    }
    .services-hub-heading__botanical{display:none!important}
    .service-faq-list summary{padding:18px 16px!important;gap:16px!important}
    .service-faq-list details p{margin:-2px 50px 19px 16px!important}
    .blog-filter-dock{width:calc(100% - 28px)!important;transform:translateY(-32%)!important}
    .blog-index-section{margin-top:-50px!important;padding-top:106px!important}
}

/* ========================================================================
   V16 · UNA SOLA ESCENA, CONTACTO CLARO Y SELECTOR PROPIO (2026-08-23)
   ======================================================================== */

/* Servicios: una única fotografía cubre toda la altura. Ya no existen capas
   apiladas, por lo que perspectiva, piedra, agua e iluminación son continuas. */
.services-hub-grid-section::before{
    width:min(52vw,720px)!important;
    height:100%!important;
    opacity:1!important;
    background:url('../assets/services-crescent-continuous-v12.webp') left center/cover no-repeat!important;
    filter:none!important;
}
.services-hub-grid-section::after{
    background:linear-gradient(90deg,
        rgba(247,241,231,.01) 0%,
        rgba(247,241,231,.06) 26%,
        rgba(247,241,231,.32) 45%,
        rgba(247,241,231,.82) 67%,
        #f7f1e7 85%)!important;
}

/* Blog: el contacto deja de ser una tarjeta clara flotando en una pantalla
   midnight. La propia sección forma una banda de papel de borde a borde. */
.blog-midnight main{background:#f5eee3!important}
.newsletter-preview--contact{
    box-sizing:border-box!important;
    width:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:clamp(58px,6.5vw,82px) max(5vw,calc((100vw - 1120px)/2))!important;
    border:0!important;
    border-radius:0!important;
    background:
        linear-gradient(112deg,rgba(255,252,246,.97),rgba(247,239,226,.96)),
        url('../assets/portfolio-sakura-branch-v4.webp') left top/34% auto no-repeat,
        url('../assets/portfolio-sakura-branch-v4.webp') right bottom/32% auto no-repeat,
        #f7f1e7!important;
    box-shadow:inset 0 1px rgba(122,75,50,.1),inset 0 -1px rgba(122,75,50,.1)!important;
}
.newsletter-preview--contact::after{opacity:.08!important}

/* Filtro del blog: más aire en los extremos y un listbox propio. El menú
   conserva el cursor neojaponés porque ya no depende del desplegable del SO. */
.blog-filter-dock{
    width:min(1180px,calc(100% - 64px))!important;
    gap:18px!important;
    padding:10px 12px!important;
}
.blog-filter-dock .blog-filters{padding-inline:2px!important}
.blog-sort-control{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    gap:11px!important;
    padding:0 2px 0 16px!important;
    color:#59656a!important;
    font:750 .65rem/1 var(--font-mono)!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
}
.blog-sort-select{position:relative!important;min-width:176px!important}
.blog-sort-trigger{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    width:100%!important;
    min-height:44px!important;
    padding:0 15px 0 17px!important;
    color:#172126!important;
    border:1px solid rgba(25,42,48,.2)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#fffdf8,#f7efe4)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.95),0 6px 16px rgba(40,34,27,.06)!important;
    font:760 .78rem/1 var(--font-body)!important;
    text-transform:none!important;
    transition:border-color .22s ease,box-shadow .22s ease,background .22s ease!important;
}
.blog-sort-trigger i{
    width:8px!important;
    height:8px!important;
    border-right:2px solid #a33f2d!important;
    border-bottom:2px solid #a33f2d!important;
    transform:translateY(-2px) rotate(45deg)!important;
    transition:transform .22s ease!important;
}
.blog-sort-control.is-open .blog-sort-trigger,
.blog-sort-trigger:hover,
.blog-sort-trigger:focus-visible{
    border-color:#b94a32!important;
    background:#fffaf1!important;
    box-shadow:0 0 0 3px rgba(185,74,50,.1),0 10px 24px rgba(67,45,32,.1)!important;
}
.blog-sort-control.is-open .blog-sort-trigger i{transform:translateY(2px) rotate(225deg)!important}
.blog-sort-menu{
    position:absolute!important;
    z-index:120!important;
    top:calc(100% + 8px)!important;
    right:0!important;
    display:grid!important;
    width:100%!important;
    min-width:190px!important;
    gap:4px!important;
    padding:6px!important;
    border:1px solid rgba(25,42,48,.18)!important;
    border-radius:5px 16px 5px 16px!important;
    background:rgba(255,252,246,.99)!important;
    box-shadow:0 18px 44px rgba(13,24,29,.2)!important;
}
.blog-sort-menu[hidden]{display:none!important}
.blog-sort-menu button{
    min-height:40px!important;
    padding:0 12px!important;
    color:#29383e!important;
    border:0!important;
    border-radius:3px 10px 3px 10px!important;
    background:transparent!important;
    text-align:left!important;
    font:700 .78rem/1.2 var(--font-body)!important;
    transition:color .18s ease,background .18s ease,transform .18s ease!important;
}
.blog-sort-menu button:hover,
.blog-sort-menu button:focus-visible{
    color:#fff9ed!important;
    background:#a6412f!important;
    transform:translateX(2px)!important;
    outline:0!important;
}
.blog-sort-menu button[aria-selected='true']{
    color:#8f3426!important;
    background:#f6ded0!important;
}
.blog-sort-menu button[aria-selected='true']:hover,
.blog-sort-menu button[aria-selected='true']:focus-visible{color:#fff9ed!important;background:#a6412f!important}

@media(max-width:900px){
    .services-hub-grid-section::before{
        width:min(76vw,620px)!important;
        background:url('../assets/services-crescent-continuous-v12.webp') left center/cover no-repeat!important;
    }
    .newsletter-preview--contact{padding-inline:max(24px,5vw)!important}
    .blog-filter-dock{width:calc(100% - 36px)!important;padding:11px!important}
    .blog-sort-control{width:100%!important;padding:3px 4px 0!important;justify-content:space-between!important}
    .blog-sort-select{min-width:min(210px,58vw)!important}
}
@media(max-width:680px){
    .services-hub-grid-section::before{
        width:100%!important;
        opacity:.48!important;
        background:url('../assets/services-crescent-continuous-v12.webp') left center/cover no-repeat!important;
    }
    .newsletter-preview--contact{padding:46px 18px!important}
    .blog-filter-dock{width:calc(100% - 24px)!important}
    .blog-sort-control{align-items:flex-start!important;flex-direction:column!important;gap:8px!important}
    .blog-sort-select{width:100%!important;min-width:0!important}
}
