/* Hannah: tinta, blanco cálido y lima. Motivo de hilos en ambos fondos. */
body.compact-home.reading-light {
  --paper: #eef0e9;
  --paper-raised: #f8f9f4;
  --ink: #20271e;
  --quiet: #56604f;
  --line-light: #a3ad9c;
  --pattern-opacity: .12;
}
body.compact-home.reading-light > .site-header { background: rgba(10, 13, 9, .95); }
body.compact-home.reading-light .compact-context { background: rgba(14, 19, 12, .82); }
/* Three readable service cards; no compressed icon diagrams on phones. */
body.compact-home.reading-light .service-grid { gap: 24px; }
body.compact-home.reading-light .service-card,
body.compact-home.reading-light .service-card:not(.service-card-brain),
body.compact-home.reading-light .service-card-brain {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 158px 1fr auto;
  gap: 24px;
  padding: 28px;
  min-height: 380px;
  color: var(--ink);
  background: var(--paper) url('./assets/threads-light.svg') center / cover;
  border: 1px solid #b9c1b3;
  border-radius: 10px;
  backdrop-filter: none;
}
body.compact-home.reading-light .service-card h3,
body.compact-home.reading-light .service-card-brain h3 {
  grid-column: 1; grid-row: 2;
  color: var(--ink);
  font-size: clamp(25px, 2.2vw, 32px);
  line-height: 1.16;
  max-width: 20ch;
}
body.compact-home.reading-light .service-card .solution-illustration,
body.compact-home.reading-light .service-card:not(.service-card-brain) .solution-illustration {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: center;
  grid-column: 1; grid-row: 1;
  width: 100%; height: 158px; margin: 0; padding: 0; gap: 18px;
  background: none; border: 0;
}
body.compact-home.reading-light .solution-illustration::before,
body.compact-home.reading-light .solution-illustration::after { display: none; }
body.compact-home.reading-light .solution-illustration svg {
  display: block; width: 76px; height: 76px; color: #425c21;
}
body.compact-home.reading-light .service-card .solution-illustration > span {
  display: block; width: auto; height: auto; padding: 0; border: 0; background: none;
  color: var(--quiet); font: 14px/1.5 Arial, sans-serif;
}
body.compact-home.reading-light .service-card .service-actions,
body.compact-home.reading-light .service-card:not(.service-card-brain) .service-actions {
  grid-column: 1; grid-row: 3; padding: 0; margin: 0; align-self: end;
}
body.compact-home.reading-light .service-card .detail-link { color: var(--ink); text-decoration-color: #697b58; }
body.compact-home.reading-light .service-card .detail-link:hover { color: #3b5913; }
body.compact-home.reading-light .service-card .icon { color: #425c21; }
body.compact-home.reading-light .service-card :focus-visible { outline-color: #425c21; }
/* The light gallery is an entire band, aligned with every other section. */
body.compact-home.reading-light .projects {
  width: 100%; max-width: none; margin-inline: 0;
  padding-inline: max(var(--gutter, 20px), calc((100vw - 1440px) / 2));
  background: var(--paper) url('./assets/threads-light.svg') center / cover;
  color: var(--ink); border-block: 1px solid #abb5a3;
}
body.compact-home.reading-light .projects .section-head { margin-bottom: 28px; }
body.compact-home.reading-light .projects .section-head h2 { color: var(--ink); }
body.compact-home.reading-light .unified-gallery { display: flex; flex-direction: column; }
body.compact-home.reading-light .ug-heading { order: 0; margin-bottom: 14px; }
body.compact-home.reading-light .ug-heading h3 { color: var(--ink); font: 600 clamp(23px, 2.4vw, 30px)/1.25 Arial, sans-serif; }
body.compact-home.reading-light .ug-purpose { margin: 8px 0 0; color: var(--quiet); font: 15px/1.5 Arial, sans-serif; }
body.compact-home.reading-light .ug-controls { order: 1; margin: 0 0 16px; }
body.compact-home.reading-light .ug-surface { order: 2; background: var(--paper-raised); border-color: #89957f; border-radius: 10px; }
body.compact-home.reading-light .ug-hint { order: 3; }
body.compact-home.reading-light .ug-expand { order: 4; }
body.compact-home.reading-light .ug-viewport { min-height: 0; perspective: none; }
body.compact-home.reading-light .ug-panel { width: 100%; height: 100%; transition: opacity .2s ease; }
body.compact-home.reading-light .ug-panel:not([data-camera-position=center]) { visibility: hidden; opacity: 0; pointer-events: none; }
body.compact-home.reading-light .ug-panel[data-camera-position=center] { transform: translateX(-50%); clip-path: none; }
body.compact-home.reading-light .ug-panel > .ug-screen {
  overflow: auto; overscroll-behavior: auto; scrollbar-width: thin;
  border: 0; border-radius: 0; box-shadow: none;
  scrollbar-color: #88967c #eef0e9;
}
/* Same application palette in the gallery and enlarged dialog. */
body.compact-home.reading-light .ug-screen > .mock-app {
  --app-bg: #f8f9f4 !important; --app-raised: #e8ede2 !important;
  --app-text: #20271e !important; --app-muted: #56604f !important; --app-line: #a3ad9c !important;
  background: #f8f9f4; color: #20271e;
  min-height: 100%; backdrop-filter: none; -webkit-backdrop-filter: none;
}
body.compact-home.reading-light .ug-screen .mock-top { background: #e5eadf; color: #43503b; font-size: 12px; min-height: 46px; }
body.compact-home.reading-light .ug-screen .mock-sidebar { background: #eef0e9; }
body.compact-home.reading-light .ug-screen .mock-main { padding: 28px; }
body.compact-home.reading-light .ug-screen .mock-heading strong { font-size: 26px; letter-spacing: -.025em; }
body.compact-home.reading-light .ug-screen .mock-heading small { font-size: 14px; }
body.compact-home.reading-light .ug-screen .app-stat { background: #eef2e9; border-color: #a3ad9c; padding: 16px; }
body.compact-home.reading-light .ug-screen .app-stat span,
body.compact-home.reading-light .ug-screen .app-stat em { font-size: 12px; }
body.compact-home.reading-light .ug-screen .app-stat b { color: #30451e; font-size: 34px; }
body.compact-home.reading-light .ug-screen .app-chart { height: 85px; margin-bottom: 24px; }
body.compact-home.reading-light .ug-screen .app-chart i { background: #6e873f; animation: none; }
body.compact-home.reading-light .ug-screen .app-chart i:nth-child(3n) { background: #354d28; }
body.compact-home.reading-light .ug-screen .tag { background: #e7eddf; color: #35472a; border-color: #96a58a; font-size: 12px; }
body.compact-home.reading-light .ug-screen .data-row { font-size: 14px; min-height: 62px; }
body.compact-home.reading-light .ug-screen .data-row small { font-size: 13px; }
body.compact-home.reading-light .ug-screen .mock-foot { font-size: 12px; }
body.compact-home.reading-light .ug-screen button,
body.compact-home.reading-light :is(.unified-gallery, .ug-dialog) button {
  min-height: 44px; color: #20271e; border-color: #849379; background: #f8f9f4;
}
body.compact-home.reading-light .ug-screen button:hover,
body.compact-home.reading-light .ug-screen button[aria-pressed=true],
body.compact-home.reading-light .ug-screen button[aria-selected=true] { background: #dce7c4; color: #243b12; border-color: #5c753e; }
body.compact-home.reading-light :is(.unified-gallery, .ug-dialog) :focus-visible { outline: 2px solid #425c21; outline-offset: 3px; }
body.compact-home.reading-light .ug-counter { color: #56604f; }
body.compact-home.reading-light .ug-screen .c4-demo-main { min-height: calc(100% - 46px); background: #f8f9f4; }
body.compact-home.reading-light .ug-screen :is(.c4-time,.c4-demo-heading small,.c4-activity small,.c4-dependency span) { color: #56604f; }
body.compact-home.reading-light .ug-screen :is(.c4-gantt-row,.c4-activity,.c4-dependency) { color: #20271e; border-color: #bdc7b6; }
body.compact-home.reading-light .ug-screen .c4-gantt-row { min-height: 62px; font-size: 14px; }
body.compact-home.reading-light .ug-screen .c4-bar { height: 18px; }
body.compact-home.reading-light .ug-screen .c4-bar-main { background: #63832e; }
body.compact-home.reading-light .ug-screen .c4-tabs { border-color: #a3ad9c; }
body.compact-home.reading-light .ug-screen .c4-activity { background: #eef2e9; }
body.compact-home.reading-light .ug-screen .c4-activity b { color: #3f5a20; }
body.compact-home.reading-light .ug-screen .brain-demo { background: none; }
body.compact-home.reading-light .ug-screen .brain-question { background: #e4ebda; color: #20271e; font-size: 25px; }
body.compact-home.reading-light .ug-screen .brain-answer { font-size: 16px; min-height: 130px; }
body.compact-home.reading-light .ug-screen .brain-source { color: #56604f; }
body.compact-home.reading-light .ug-screen .mock-card { background: #f8f9f4; }
body.compact-home.reading-light .ug-screen .system-status { background: #e4ebda; color: #35472a; }
body.compact-home.reading-light .ug-dialog {
  --ug-line: #849379; color: #20271e;
  background: #eef0e9 url('./assets/threads-light.svg') center / cover;
  border-color: #849379; backdrop-filter: none;
}
body.compact-home.reading-light .ug-dialog-controls { color: #56604f; }
/* A second quiet light surface at Odoo; form fields close the same visual loop. */
body.compact-home.reading-light .compact-odoo .odoo-grid {
  background: #eef0e9 url('./assets/threads-light.svg') center / cover;
  border: 1px solid #a3ad9c; border-radius: 12px; color: #20271e;
}
body.compact-home.reading-light .compact-odoo .odoo-copy h2,
body.compact-home.reading-light .compact-odoo .odoo-action,
body.compact-home.reading-light .compact-odoo .odoo-partner { color: #20271e; }
body.compact-home.reading-light .compact-odoo .odoo-board { background: #e1e7da; border: 1px solid #b2bea7; color: #20271e; }
body.compact-home.reading-light .compact-odoo .odoo-app-icon { background: #f8f9f4; }
body.compact-home.reading-light .contact-action {
  background: #eef0e9 url('./assets/threads-light.svg') center / cover;
  border: 1px solid #a3ad9c; border-radius: 12px;
  color: #20271e; padding: clamp(22px, 3vw, 40px);
}
body.compact-home.reading-light .contact-form :is(label,small,.contact-form-note),
body.compact-home.reading-light .contact-consent > span,
body.compact-home.reading-light .contact-direct a { color: #20271e; }
body.compact-home.reading-light .contact-form input:not([type=checkbox]),
body.compact-home.reading-light .contact-form textarea { border: 1px solid #849379; border-radius: 5px; background: #f8f9f4; color: #20271e; padding: 12px; }
body.compact-home.reading-light .contact-form ::placeholder { color: #56604f; opacity: 1; }
body.compact-home.reading-light .contact-form :focus-visible { outline: 2px solid #425c21; outline-offset: 3px; }
body.compact-home.reading-light .contact-submit { background: #c7ed59; color: #20271e; border: 1px solid #6c853d; }
body.compact-home.reading-light .contact-submit:hover { background: #bada51; }
body.compact-home.reading-light .contact-direct { border-color: #a3ad9c; }
body.compact-home.reading-light .contact-action .icon { color: #425c21; }
@media (min-width:701px) and (max-width:1024px) {
  body.compact-home.reading-light .service-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
  body.compact-home.reading-light .service-card,
  body.compact-home.reading-light .service-card:not(.service-card-brain),
  body.compact-home.reading-light .service-card-brain { padding: 22px; grid-template-rows: 150px 1fr auto; gap: 20px; }
  body.compact-home.reading-light .service-card h3, body.compact-home.reading-light .service-card-brain h3 { font-size: 25px; }
}
@media (max-width:700px) {
  body.compact-home.reading-light .service-grid { gap: 16px; }
  body.compact-home.reading-light .service-card,
  body.compact-home.reading-light .service-card:not(.service-card-brain),
  body.compact-home.reading-light .service-card-brain { padding: 24px; grid-template-rows: 112px auto auto; gap: 18px; min-height: 320px; }
  body.compact-home.reading-light .service-card .solution-illustration,
  body.compact-home.reading-light .service-card:not(.service-card-brain) .solution-illustration { height: 112px; gap: 12px; }
  body.compact-home.reading-light .solution-illustration svg { width: 64px; height: 64px; }
  body.compact-home.reading-light .service-card h3,
  body.compact-home.reading-light .service-card-brain h3 { font-size: 27px; max-width: 22ch; align-self: start; }
  body.compact-home.reading-light .projects { padding-inline: 20px; }
  body.compact-home.reading-light .ug-heading { gap: 16px; }
  body.compact-home.reading-light .ug-purpose { font-size: 14px; }
  body.compact-home.reading-light .ug-screen .mock-main { padding: 20px 16px; }
  body.compact-home.reading-light .ug-screen .mock-heading strong { font-size: 23px; }
  body.compact-home.reading-light .ug-screen .app-stats { gap: 8px; }
  body.compact-home.reading-light .ug-screen .app-stat { padding: 10px; }
  body.compact-home.reading-light .ug-screen .app-stat span,
  body.compact-home.reading-light .ug-screen .app-stat em { font-size: 11px; }
  body.compact-home.reading-light .ug-screen .app-stat b { font-size: 30px; }
  body.compact-home.reading-light .ug-screen .data-row { font-size: 13px; }
  body.compact-home.reading-light .ug-screen .data-row small { font-size: 12px; }
  body.compact-home.reading-light .ug-screen .c4-demo-main { padding: 22px 16px; }
  body.compact-home.reading-light .ug-screen .c4-gantt-row { font-size: 13px; min-height: 64px; }
  body.compact-home.reading-light .ug-screen .c4-demo-heading { flex-wrap: wrap; gap: 12px; }
  body.compact-home.reading-light .ug-screen .c4-tabs { flex-wrap: wrap; }
  body.compact-home.reading-light .ug-screen .kanban { grid-template-columns: 1fr; }
  body.compact-home.reading-light .ug-screen .kanban-col { min-height: auto; padding: 14px; }
  body.compact-home.reading-light .ug-screen .mock-card { padding: 14px; font-size: 14px; }
  body.compact-home.reading-light .ug-screen .mock-card small { font-size: 12px; }
  body.compact-home.reading-light .ug-screen .brain-question { font-size: 23px; }
  body.compact-home.reading-light .ug-screen .brain-answer { min-height: 205px; }
}
body.compact-home.reading-light .ug-panel { transition: none; }
body.compact-home.reading-light .service-card,
body.compact-home.reading-light .service-card:not(.service-card-brain),
body.compact-home.reading-light .service-card-brain { grid-column: auto; grid-row: auto; }
body.compact-home.reading-light .contact-form,
body.compact-home.reading-light .contact-form :is(input,textarea,button,label,small),
body.compact-home.reading-light .ug-screen,
body.compact-home.reading-light .ug-screen :is(button,strong,small,span,p) { font-family: Arial, sans-serif; }
@media (min-width:701px) and (max-width:1024px) {
  body.compact-home.reading-light .service-grid { grid-template-columns: 1fr; }
  body.compact-home.reading-light .service-card,
  body.compact-home.reading-light .service-card:not(.service-card-brain),
  body.compact-home.reading-light .service-card-brain {
    grid-template-columns: 180px 1fr; grid-template-rows: 1fr auto;
    min-height: 210px; gap: 18px 36px; padding: 28px;
  }
  body.compact-home.reading-light .service-card .solution-illustration,
  body.compact-home.reading-light .service-card:not(.service-card-brain) .solution-illustration {
    grid-column: 1; grid-row: 1 / span 2; height: 150px;
  }
  body.compact-home.reading-light .service-card h3,
  body.compact-home.reading-light .service-card-brain h3 { grid-column: 2; grid-row: 1; align-self: end; font-size: 30px; max-width: 24ch; }
  body.compact-home.reading-light .service-card .service-actions,
  body.compact-home.reading-light .service-card:not(.service-card-brain) .service-actions { grid-column: 2; grid-row: 2; align-self: start; }
}

/* Textura análoga: la misma trama, escala e intensidad sobre blanco y negro. */
body.compact-home.reading-light {
  background-color: #11140f;
  background-image: url('./assets/surface-grain.svg');
  background-size: 180px 180px;
  background-repeat: repeat;
}
body.compact-home.reading-light .analog-filter-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
body.compact-home.reading-light .site-header {
  background-color: rgba(17, 20, 15, .96);
  background-image: url('./assets/surface-grain.svg'); background-size: 180px 180px;
}
body.compact-home.reading-light :is(.service-card,.service-card-brain,.projects,.compact-odoo .odoo-grid,.contact-action,.ug-dialog) {
  background-image: url('./assets/surface-grain.svg'), url('./assets/threads-light.svg');
  background-size: 180px 180px, cover;
  background-repeat: repeat, no-repeat;
}
body.compact-home.reading-light :is(.ug-screen > .mock-app,.ug-screen .c4-demo-main,.ug-screen .mock-top,.ug-screen .mock-sidebar,.ug-screen .app-stat,.ug-screen .mock-card,.ug-screen .system-panel,.ug-screen .kanban-col,.odoo-board,.compact-context,.brain-card,.service-dialog) {
  background-image: url('./assets/surface-grain.svg');
  background-size: 180px 180px; background-repeat: repeat;
}
body.compact-home.reading-light .service-dialog { background-color: #191d16; }
/* El pigmento pierde como máximo 1,5 % de opacidad, conserva los bordes. */
body.compact-home.reading-light :is(h1,h2,h3,h4,p,summary,label,.eyebrow,.detail-link,.underlink,.header-cta,.ug-screen .mock-heading,.ug-screen .data-row,.ug-screen .system-panel,.ug-screen .app-stat,.ug-screen .brain-demo,.brand img,.site-footer img,.solution-illustration svg) {
  filter: url('#hannah-ink-grain');
}
body.compact-home.reading-light :is(button,.btn,input,textarea) {
  background-image: url('./assets/surface-grain.svg');
  background-size: 180px 180px;
}
@media (hover:hover) and (pointer:fine) {
  body.compact-home.reading-light {
    --hannah-cursor-arrow: url('./assets/cursor-angular-dark-grain.svg') 3 2, auto;
    --hannah-cursor-text: url('./assets/cursor-text-dark-grain.svg') 16 16, text;
    --hannah-cursor-hand: url('./assets/cursor-hand-dark-grain.svg') 13 9, pointer;
    --hannah-cursor-press: url('./assets/cursor-hand-press-dark-grain.svg') 13 9, pointer;
  }
  body.compact-home.reading-light :is(.service-card,.projects,.ug-dialog,.contact-action,.odoo-grid,.partner-ccl img,.btn-primary,.contact-submit,.skip) {
    --hannah-cursor-arrow: url('./assets/cursor-angular-grain.svg') 3 2, auto;
    --hannah-cursor-text: url('./assets/cursor-text-grain.svg') 16 16, text;
    --hannah-cursor-hand: url('./assets/cursor-hand-grain.svg') 13 9, pointer;
    --hannah-cursor-press: url('./assets/cursor-hand-press-grain.svg') 13 9, pointer;
    --hannah-cursor-color: #20271e;
  }
}
@media (hover:hover) and (pointer:fine) {
  body.compact-home.reading-light .ug-screen button,
  body.compact-home.reading-light .ug-screen button:hover {
    --hannah-cursor-arrow: url('./assets/cursor-angular-grain.svg') 3 2, auto;
    --hannah-cursor-text: url('./assets/cursor-text-grain.svg') 16 16, text;
    --hannah-cursor-hand: url('./assets/cursor-hand-grain.svg') 13 9, pointer;
    --hannah-cursor-press: url('./assets/cursor-hand-press-grain.svg') 13 9, pointer;
  }
}

/* El blanco queda como acento. La trama original del canvas se ve a través. */
body.compact-home.reading-light .projects {
  background: transparent;
  color: #f1f2ea; border-color: #45503d;
}
body.compact-home.reading-light .projects .section-head h2,
body.compact-home.reading-light .ug-heading h3 { color: #f1f2ea; }
body.compact-home.reading-light .ug-purpose,
body.compact-home.reading-light .ug-counter { color: #c1c8b8; }
body.compact-home.reading-light .service-card,
body.compact-home.reading-light .service-card:not(.service-card-brain),
body.compact-home.reading-light .service-card-brain {
  background-color: rgba(25, 30, 21, .58);
  background-image: url('./assets/surface-grain.svg'); background-size: 180px 180px;
  color: #f1f2ea; border-color: #647058;
}
body.compact-home.reading-light .service-card h3,
body.compact-home.reading-light .service-card-brain h3,
body.compact-home.reading-light .service-card .detail-link { color: #f1f2ea; }
body.compact-home.reading-light .service-card .solution-illustration > span { color: #c1c8b8; }
body.compact-home.reading-light .solution-illustration svg {
  box-sizing: border-box; padding: 10px; border-radius: 6px;
  background: rgba(238,240,233,.91) url('./assets/surface-grain.svg'); background-size: 180px 180px;
  width: 84px; height: 84px; color: #425c21;
}
body.compact-home.reading-light .service-card .detail-link:hover,
body.compact-home.reading-light .service-card .icon { color: #c7ed59; }
body.compact-home.reading-light .service-card :focus-visible { outline-color: #c7ed59; }
body.compact-home.reading-light .ug-surface { background: transparent; }
body.compact-home.reading-light .ug-screen { background: rgba(238,240,233,.92) url('./assets/surface-grain.svg'); background-size: 180px 180px; }
body.compact-home.reading-light .ug-screen > .mock-app,
body.compact-home.reading-light .ug-screen .c4-demo-main { background-color: transparent; }
body.compact-home.reading-light .ug-screen .mock-main { background: transparent; }
body.compact-home.reading-light .ug-dialog {
  background: rgba(238,240,233,.91) url('./assets/surface-grain.svg'); background-size: 180px 180px;
}
body.compact-home.reading-light .compact-odoo .odoo-grid {
  background: rgba(25,30,21,.56) url('./assets/surface-grain.svg'); background-size: 180px 180px;
  color: #f1f2ea; border-color: #647058;
}
body.compact-home.reading-light .compact-odoo .odoo-copy h2,
body.compact-home.reading-light .compact-odoo .odoo-partner { color: #f1f2ea; }
body.compact-home.reading-light .compact-odoo .odoo-board {
  background: rgba(238,240,233,.9) url('./assets/surface-grain.svg'); background-size: 180px 180px;
}
body.compact-home.reading-light .contact-action {
  background: rgba(25,30,21,.5) url('./assets/surface-grain.svg'); background-size: 180px 180px;
  color: #f1f2ea; border-color: #647058;
}
body.compact-home.reading-light .contact-form :is(label,small,.contact-form-note),
body.compact-home.reading-light .contact-consent > span,
body.compact-home.reading-light .contact-direct a { color: #e1e6d9; }
body.compact-home.reading-light .contact-form input:not([type=checkbox]),
body.compact-home.reading-light .contact-form textarea {
  background-color: rgba(238,240,233,.92); color: #20271e;
}
body.compact-home.reading-light .contact-form :focus-visible { outline-color: #c7ed59; }
body.compact-home.reading-light .contact-action .icon { color: #c7ed59; }
body.compact-home.reading-light .contact-submit .icon { color: #425c21; }
@media (hover:hover) and (pointer:fine) {
  body.compact-home.reading-light :is(.service-card,.projects,.contact-action,.odoo-grid) {
    --hannah-cursor-arrow: url('./assets/cursor-angular-dark-grain.svg') 3 2, auto;
    --hannah-cursor-text: url('./assets/cursor-text-dark-grain.svg') 16 16, text;
    --hannah-cursor-hand: url('./assets/cursor-hand-dark-grain.svg') 13 9, pointer;
    --hannah-cursor-press: url('./assets/cursor-hand-press-dark-grain.svg') 13 9, pointer;
    --hannah-cursor-color: #c7ed59;
  }
  body.compact-home.reading-light :is(.ug-screen,.ug-dialog,.odoo-board,.solution-illustration svg,.contact-form input,.contact-form textarea) {
    --hannah-cursor-arrow: url('./assets/cursor-angular-grain.svg') 3 2, auto;
    --hannah-cursor-text: url('./assets/cursor-text-grain.svg') 16 16, text;
    --hannah-cursor-hand: url('./assets/cursor-hand-grain.svg') 13 9, pointer;
    --hannah-cursor-press: url('./assets/cursor-hand-press-grain.svg') 13 9, pointer;
    --hannah-cursor-color: #20271e;
  }
}
/* Una sola capa de grano por superficie evita acumular ruido en las muestras. */
body.compact-home.reading-light .ug-screen > .mock-app,
body.compact-home.reading-light .ug-screen .c4-demo-main { background-image: none; }
body.compact-home.reading-light .ug-screen { background-color: rgba(238,240,233,.88); }

/* La placa fotográfica original sin isotipo continúa como atmósfera del sitio. */
body.compact-home.reading-light { isolation: isolate; background-image: none; }
body.compact-home.reading-light::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(17,20,15,.52),rgba(17,20,15,.67)), url('./assets/optimized/background-hardware-landscape.webp');
  background-size: cover; background-position: 50% 53%;
  filter: blur(11px) saturate(.4) brightness(.7);
  transform: scale(1.045);
}
body.compact-home.reading-light::after {
  content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: url('./assets/surface-grain.svg') repeat; background-size: 180px 180px;
}
@media (max-width:1024px) and (min-aspect-ratio:1/1) {
  body.compact-home.reading-light::before { background-position: 50% 50%; filter: blur(10px) saturate(.4) brightness(.68); }
}
@media (max-aspect-ratio:1/1) {
  body.compact-home.reading-light::before {
    background-image: linear-gradient(rgba(17,20,15,.56),rgba(17,20,15,.68)), url('./assets/optimized/hero-photo-941.webp');
    background-position: 50% 51%; filter: blur(9px) saturate(.3) brightness(.68);
  }
}

/* Algunas muestras claras alternan con tinta para conservar el peso oscuro. */
body.compact-home.reading-light .ug-screen[data-tone=dark] {
  background-color: rgba(22,27,19,.86); color: #edf0e6;
}
body.compact-home.reading-light .ug-screen[data-tone=dark] > .mock-app {
  --app-bg: #191f16 !important; --app-raised: #242c1f !important;
  --app-text: #edf0e6 !important; --app-muted: #c1cbb5 !important; --app-line: #6d7c5e !important;
  color: #edf0e6;
}
body.compact-home.reading-light .ug-screen[data-tone=dark] .mock-top { background-color: rgba(40,48,33,.6); color: #d3dcc8; }
body.compact-home.reading-light .ug-screen[data-tone=dark] :is(.mock-sidebar,.app-stat,.mock-card,.kanban-col,.system-panel) { background-color: rgba(36,44,31,.7); border-color: #6d7c5e; }
body.compact-home.reading-light .ug-screen[data-tone=dark] .app-stat b { color: #d3e9b4; }
body.compact-home.reading-light .ug-screen[data-tone=dark] :is(.tag,.system-status) { background: #334329; color: #e1ebd6; border-color: #849b6b; }
body.compact-home.reading-light .ug-screen[data-tone=dark] button { background: #242c1f; color: #edf0e6; border-color: #8b9a7b; }
body.compact-home.reading-light .ug-screen[data-tone=dark] button:hover,
body.compact-home.reading-light .ug-screen[data-tone=dark] button[aria-pressed=true] { background: #c7ed59; color: #20271e; }
body.compact-home.reading-light .ug-screen[data-tone=dark] :focus-visible { outline-color: #c7ed59; }
@media (hover:hover) and (pointer:fine) {
  body.compact-home.reading-light .ug-screen[data-tone=dark],
  body.compact-home.reading-light .ug-screen[data-tone=dark] button {
    --hannah-cursor-arrow: url('./assets/cursor-angular-dark-grain.svg') 3 2, auto;
    --hannah-cursor-text: url('./assets/cursor-text-dark-grain.svg') 16 16, text;
    --hannah-cursor-hand: url('./assets/cursor-hand-dark-grain.svg') 13 9, pointer;
    --hannah-cursor-press: url('./assets/cursor-hand-press-dark-grain.svg') 13 9, pointer;
  }
}

/* Una sola fotografía fija: conserva el tratamiento sin trabajo en cada scroll. */
body.compact-home.reading-light::before { display: none; }
body.compact-home.reading-light > .hardware-backdrop {
  position: fixed; inset: 0; z-index: -1; overflow: hidden;
  pointer-events: none; background: #11140f;
  --hardware-photo: url('./assets/optimized/background-hardware-landscape.webp');
}
body.compact-home.reading-light .hardware-photo {
  position: absolute; inset: -14%;
  background: var(--hardware-photo) center / cover no-repeat;
  filter: blur(.25px) saturate(.2) contrast(1.1);
  transform-origin: 50% 52%;
  transform: translateY(-2.8vh) scale(1.23);
  opacity: .9;
}
body.compact-home.reading-light .hardware-veil {
  position: absolute; inset: 0;
  background: linear-gradient(rgba(10,14,10,.58),rgba(10,14,10,.74));
}
@media (max-aspect-ratio:1/1) {
  body.compact-home.reading-light > .hardware-backdrop { --hardware-photo: url('./assets/optimized/hero-photo-941.webp'); }
  body.compact-home.reading-light .hardware-photo { inset: -21%; transform: translateY(-1.6vh) scale(1.28); }
}


/* El patrón vivo se invierte únicamente sobre los acentos de papel. */
body.compact-home.reading-light [data-paper-pattern] { position: relative; isolation: isolate; }
body.compact-home.reading-light [data-paper-pattern] > .paper-pattern {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none; opacity: .27;
}
body.compact-home.reading-light [data-paper-pattern] > :not(.paper-pattern) { position: relative; z-index: 1; }
body.compact-home.reading-light .partners > .paper-pattern {
  left: calc((100% - 100vw) / 2); right: auto; width: 100vw;
}
body.compact-home.reading-light .ug-screen > .paper-pattern { opacity: .16; }

/* El menú se lee sobre papel opaco, independientemente de la foto o del patrón. */
@media (max-width:700px) {
  body.compact-home.reading-light.menu-open > .site-header nav {
    grid-template-columns: minmax(0,1fr);
    justify-content: stretch;
    align-items: stretch;
    background: var(--paper) url('./assets/surface-grain.svg') repeat;
    background-size: 180px 180px;
    color: var(--ink);
    border-color: #a3ad9c;
    box-shadow: 0 16px 28px rgba(10,14,10,.25);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    max-height: calc(100dvh - 64px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  body.compact-home.reading-light.menu-open > .site-header nav a {
    color: var(--ink);
    border-color: #c3cabd;
    opacity: 1;
  }
  body.compact-home.reading-light.menu-open > .site-header nav a:focus-visible {
    outline: 2px solid #425c21;
    outline-offset: 3px;
  }
  body.compact-home.reading-light.menu-open .mobile-nav-actions a:last-child { color: #35472a; }
}

/* La misma trama viva se mantiene visible sobre las placas de tinta. */
body.compact-home.reading-light :is(.service-card,.contact-action,.odoo-grid,.compact-context,.ug-screen[data-tone=dark]) > .paper-pattern {opacity:.24}