/* HOME v3 — schermo del computer + libro (classi dh-*) */
.dh-hero { --n: #16255c; --n2: #0f1b45; --g: #b8963e; --gs: #e8d9b0; --cr: #f3ece0; --pp: #faf6ef; --ln: #e0d5c2; --mu: #6b6a67;
  position: relative; overflow: hidden; background: var(--cr); color: #1f2433; padding: 28px 0 44px; border-bottom: 1px solid var(--ln); }
.dh-hero::before { content: ""; position: absolute; right: -160px; top: -140px; width: 680px; height: 680px; border-radius: 50%;
  background: radial-gradient(circle, rgba(184,150,62,.30), transparent 62%); pointer-events: none; }
.dh-wrap { position: relative; max-width: 1160px; margin: 0 auto; padding: 0 20px; }
.dh-grid { display: grid; grid-template-columns: .9fr 1.1fr; grid-template-areas: "copy scene"; gap: 40px; align-items: center; }
.dh-copy { grid-area: copy; }
.dh-eyebrow { margin: 0; font: 600 12px/1.2 "Source Sans 3", sans-serif; letter-spacing: .18em; text-transform: uppercase; color: var(--g); }
.dh-title { margin: 10px 0 0; font: 600 clamp(34px, 3.9vw, 54px)/1.05 "Cormorant Garamond", Georgia, serif; letter-spacing: -.01em; color: var(--n); }
.dh-lead { margin: 16px 0 22px; max-width: 540px; font-size: 18px; line-height: 1.6; color: #3d4152; }
.dh-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.dh-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 999px;
  font: 600 15px "Source Sans 3", sans-serif; text-decoration: none; border: 1.5px solid var(--n); transition: transform .15s, background .2s; }
.dh-btn:active { transform: scale(.98); }
.dh-btn--primary { background: var(--n); color: #fff; }
.dh-btn--primary:hover { background: var(--n2); }
.dh-btn--ghost { background: transparent; color: var(--n); }
.dh-btn--ghost:hover { background: rgba(22,37,92,.06); }
.dh-release { display: flex; align-items: center; gap: 12px; margin-top: 20px; font-size: 14px; color: var(--mu); }
.dh-countdown { display: flex; gap: 6px; flex-shrink: 0; }
.dh-countdown div { min-width: 54px; padding: 6px 10px; border-radius: 10px; background: var(--pp); border: 1px solid var(--ln); text-align: center; }
.dh-countdown b { display: block; font: 600 24px/1 "Cormorant Garamond", serif; color: var(--n); font-variant-numeric: lining-nums; }
.dh-countdown span { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }

/* scena */
.dh-scene { grid-area: scene; position: relative; padding-bottom: 18px; }
.dh-desk { position: absolute; left: 4%; right: -2%; bottom: 0; height: 18px; border-radius: 50%; background: radial-gradient(closest-side, rgba(15,27,69,.22), transparent); }
.dh-monitor { position: relative; width: 80%; }
.dh-bezel { position: relative; padding: 12px; border-radius: 22px; background: linear-gradient(160deg, #1b2447, #0a1030 60%, #070b22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(184,150,62,.25), 0 40px 70px -30px rgba(15,27,69,.75), 0 18px 30px -18px rgba(15,27,69,.5); }
.dh-bezel::before { content: ""; position: absolute; top: 5px; left: 50%; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: #2a3566; }
.dh-screen { position: relative; overflow: hidden; display: flex; flex-direction: column; min-height: 310px; border-radius: 12px; color: #e9e3d6;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  background: radial-gradient(120% 80% at 80% 0%, rgba(217,189,114,.14), transparent 55%), linear-gradient(180deg, #101c4d, #0b1438); }
.dh-screen::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(115deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.03) 28%, transparent 42%), repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 3px); }
.dh-scr-bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.06); font-size: 11px; color: #9aa3c4; }
.dh-scr-bar i { width: 9px; height: 9px; border-radius: 50%; }
.dh-scr-bar i:nth-child(1) { background: #c9785f; } .dh-scr-bar i:nth-child(2) { background: #d9bd72; } .dh-scr-bar i:nth-child(3) { background: #7fb38a; }
.dh-scr-bar span { margin-left: 10px; letter-spacing: .04em; }
.dh-scr-body { flex: 1; display: flex; flex-direction: column; min-height: 0; padding: 18px 16% 16px 20px; }
.dh-scr-cmd { margin: 0; font-size: 13px; color: #9aa3c4; }
.dh-scr-cmd b { font-weight: 500; color: var(--gs); }
.dh-scr-q { margin: 10px 0 6px; font: 400 12px "JetBrains Mono", monospace; color: var(--gs); opacity: .85; }
.dh-typed { margin: 0; min-height: 2.6em; font: italic 500 clamp(20px, 2.1vw, 27px)/1.28 "Cormorant Garamond", serif; color: #fff; }
.dh-typed::after { content: "▍"; font-style: normal; color: var(--g); animation: dh-blink 1s steps(1) infinite; }
@keyframes dh-blink { 50% { opacity: 0; } }
.dh-detect { margin: 10px 0 0; font-size: 12.5px; color: #9fe0b5; opacity: 0; transition: opacity .4s; }
.dh-fix { margin: 8px 0 0; display: flex; align-items: center; gap: 10px; font-size: 11.5px; color: #9aa3c4; opacity: 0; transition: opacity .4s; }
.dh-detect.is-shown, .dh-fix.is-shown { opacity: 1; }
.dh-fix-bar { flex: 1; max-width: 220px; height: 6px; border-radius: 6px; background: rgba(255,255,255,.08); overflow: hidden; }
.dh-fix-bar i { display: block; width: 0; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--g), var(--gs)); transition: width 1.6s ease; }
.dh-fix.is-shown .dh-fix-bar i { width: 100%; }
.dh-scr-foot { margin: auto 0 0; padding-top: 10px; border-top: 1px dashed rgba(232,217,176,.2); font: 14px/1.4 "Source Sans 3", sans-serif; color: #cfc6b4; }
.dh-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.dh-chin { height: 34px; margin: 0 10px; display: grid; place-items: center; border-radius: 0 0 16px 16px;
  background: linear-gradient(180deg, #efeae1, #d3cbbd); box-shadow: 0 10px 18px -12px rgba(15,27,69,.45); }
.dh-chin img { height: 22px; width: auto; display: block; }
.dh-neck { width: 18%; height: 34px; margin: 0 auto; background: linear-gradient(90deg, #bdb4a3, #e6e0d4 45%, #b9b09e); clip-path: polygon(18% 0, 82% 0, 100% 100%, 0 100%); }
.dh-foot { width: 36%; height: 10px; margin: 0 auto; border-radius: 6px 6px 3px 3px; background: linear-gradient(180deg, #e6e0d4, #bdb4a3); box-shadow: 0 12px 20px -8px rgba(15,27,69,.45); }

/* libro */
.dh-book { position: absolute; right: 0; bottom: 6px; z-index: 3; width: 29%; transform: rotate(-4deg); transform-origin: bottom center; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.dh-book::before { content: ""; position: absolute; left: -30%; right: -30%; bottom: -12%; height: 40%; z-index: -1; background: radial-gradient(closest-side, rgba(217,160,60,.55), transparent); filter: blur(12px); }
.dh-book::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 9%; border-radius: 3px 0 0 3px; pointer-events: none; background: linear-gradient(90deg, rgba(255,255,255,.18), rgba(0,0,0,.25) 60%, transparent); }
.dh-book img { display: block; width: 100%; height: auto; border-radius: 3px 7px 7px 3px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), -6px 0 0 -2px #f3ece0, -7px 0 0 -2px #d8ccb6, -10px 0 0 -3px #efe6d6, 0 34px 50px -18px rgba(0,0,0,.65), 0 10px 16px -8px rgba(0,0,0,.4); }
.dh-scene:hover .dh-book, .dh-book:focus-visible { transform: rotate(-2deg) translateY(-6px); }
.dh-seal { position: absolute; left: -18px; top: -16px; width: 66px; height: 66px; display: grid; place-items: center; text-align: center; border-radius: 50%; transform: rotate(-8deg);
  background: radial-gradient(circle at 30% 25%, #e8d9b0, #b8963e 70%); color: #0f1b45; box-shadow: 0 8px 18px -6px rgba(15,27,69,.5);
  font: 600 10px/1.15 "Source Sans 3", sans-serif; letter-spacing: .06em; text-transform: uppercase; }
.dh-seal b { display: block; font: 600 18px/1 "Cormorant Garamond", serif; letter-spacing: 0; }

@media (max-width: 1000px) {
  .dh-grid { grid-template-columns: 1fr; grid-template-areas: "copy" "scene"; gap: 28px; }
  .dh-scene { max-width: 640px; width: 100%; margin: 0 auto; }
}
@media (max-width: 680px) {
  .dh-hero { padding: 14px 0 30px; }
  .dh-wrap { padding: 0 16px; }
  .dh-grid { grid-template-areas: "head" "scene" "rest"; gap: 18px; }
  .dh-copy { display: contents; }
  .dh-head { grid-area: head; } .dh-rest { grid-area: rest; }
  .dh-title { font-size: 34px; }
  .dh-lead { margin: 0 0 18px; font-size: 17px; }
  .dh-scene { padding-bottom: 0; margin-bottom: 56px; }
  .dh-monitor { width: 100%; }
  .dh-bezel { padding: 7px; border-radius: 14px; }
  .dh-screen { min-height: 0; padding-bottom: 34px; border-radius: 9px; }
  .dh-scr-body { padding: 13px 14px 12px; }
  .dh-scr-cmd { font-size: 11.5px; }
  .dh-typed { font-size: 20px; min-height: 3.9em; }
  .dh-fix-bar { max-width: 32%; }
  .dh-scr-foot { display: none; }
  .dh-chin { height: 22px; border-radius: 0 0 10px 10px; } .dh-chin img { height: 14px; }
  .dh-neck { height: 18px; } .dh-foot { height: 7px; }
  .dh-book { width: 31%; right: 2%; bottom: -54px; }
  .dh-seal { width: 52px; height: 52px; left: -14px; top: -12px; font-size: 8.5px; } .dh-seal b { font-size: 15px; }
  .dh-ctas .dh-btn { width: 100%; }
  .dh-release { margin-top: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .dh-book, .dh-fix-bar i, .dh-detect, .dh-fix { transition: none; }
  .dh-typed::after { animation: none; }
}