/* VERDEA — sistema visual Dark Premium, con una interfaz sencilla y orientada a la acción. */
:root {
  color-scheme: dark;
  --bg: #07130d;
  --bg-soft: #091711;
  --surface: #142c20;
  --surface-raised: #193d2b;
  --ink: #f1f5ef;
  --muted: #a3b0a6;
  --muted-strong: #c0ccc2;
  --forest: #c2cbb3;
  --forest-2: #d5ddc8;
  --leaf: #bdc8ad;
  --sage: #d5dccb;
  --line: #21392b;
  --line-strong: #2b4a38;
  --clay: #d9a58c;
  --sand: #76b85b;
  --white: #f7f6f0;
  --max: 1160px;
  --display: 'Manrope', 'DM Sans', system-ui, sans-serif;
  --body: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ease: cubic-bezier(.22,.72,.18,1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body {
  display: flex; flex-direction: column; min-height: 100vh; margin: 0; min-width: 320px;
  overflow-x: clip; background: var(--bg); color: var(--ink);
  font: 400 16px/1.65 var(--body); -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--forest); color: #07130d; }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button:disabled { cursor: wait; opacity: .55; }
a { color: inherit; }
p, h1, h2, h3, figure, dl, blockquote { margin: 0; }
h1, h2, h3 { font-family: var(--display); font-weight: 600; line-height: 1.03; letter-spacing: -.055em; text-wrap: balance; }
h1 { font-size: clamp(3rem, 6.2vw, 5.6rem); }
h2 { font-size: clamp(2rem, 4.3vw, 3.65rem); }
h3 { font-size: clamp(1.3rem, 2.3vw, 1.75rem); }

.skip { position: absolute; top: 12px; left: -10000px; z-index: 1000; padding: 10px 14px; border-radius: 4px; background: var(--forest); color: #07130d; text-decoration: none; }
.skip:focus { left: 14px; }
:focus-visible { outline: 2px solid var(--sand); outline-offset: 4px; }
.section-shell { width: min(var(--max), calc(100% - 64px)); margin-inline: auto; }
.eyebrow { color: var(--leaf); font-size: .68rem; font-weight: 600; line-height: 1.35; letter-spacing: .11em; text-transform: uppercase; }
.hero-small { max-width: 58ch; margin-top: 1.25rem; color: var(--muted); font-size: 1rem; line-height: 1.8; }

/* Navegación: pocos elementos, orden claro y CTA siempre visible. */
.site-nav { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(242,241,235,.09); background: rgba(17,18,16,.91); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.nav-inner { width: min(var(--max), calc(100% - 64px)); min-height: 82px; margin-inline: auto; display: grid; grid-template-columns: 144px minmax(0,1fr); align-items: center; gap: clamp(26px,3.2vw,42px); }
.logo { display: inline-flex; width: 144px; align-items: center; text-decoration: none; }
.logo img { width: 100%; height: auto; }
.menu { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.menu-links { min-width: 0; display: flex; align-items: center; justify-content: center; gap: clamp(13px,1.55vw,22px); }
.lnk { position: relative; display: inline-flex; flex: 0 0 auto; align-items: center; min-height: 42px; padding-inline: 2px; color: #a3b0a6; font-size: .82rem; font-weight: 500; white-space: nowrap; text-decoration: none; transition: color .2s ease; }
.lnk:hover, .lnk[aria-current='page'] { color: var(--ink); }
.lnk[aria-current='page'] { text-decoration: underline; text-decoration-color: var(--sand); text-underline-offset: 7px; text-decoration-thickness: 1px; }
.nav-actions { display: flex; align-items: center; gap: 20px; }
.nav-book { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--forest); border-radius: 4px; background: var(--forest); color: #07130d; font-size: .79rem; font-weight: 700; text-decoration: none; white-space: nowrap; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.nav-book:hover { border-color: var(--forest-2); background: var(--forest-2); transform: translateY(-1px); }
.nav-login { color: #a3b0a6; font-size: .8rem; font-weight: 500; text-decoration: none; white-space: nowrap; }
.nav-login:hover { color: var(--ink); }
.burger { display: none; width: 42px; height: 42px; margin-left: auto; padding: 0; border: 1px solid var(--line); border-radius: 4px; background: transparent; cursor: pointer; }
.burger span { display: block; width: 18px; height: 1px; margin: 5px auto; background: var(--ink); transition: transform .2s var(--ease); }
.burger[aria-expanded='true'] span:first-child { transform: translateY(3px) rotate(45deg); }
.burger[aria-expanded='true'] span:last-child { transform: translateY(-3px) rotate(-45deg); }
.account { position: relative; }
.account summary { list-style: none; }
.account summary::-webkit-details-marker { display: none; }
.account-summary { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0; border: 0; background: transparent; color: var(--ink); font-size: .78rem; font-weight: 600; cursor: pointer; }
.account-summary::after { content: ''; width: 6px; height: 6px; margin-left: 2px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--surface-raised); color: var(--ink); font-size: .62rem; font-weight: 700; }
.account-panel { position: absolute; right: 0; top: calc(100% + 10px); z-index: 90; width: 240px; padding: 10px; border: 1px solid var(--line); border-radius: 5px; background: #1b1c19; box-shadow: 0 16px 40px rgba(0,0,0,.28); }
.account-panel strong { display: block; padding: 7px 8px 12px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .7rem; overflow-wrap: anywhere; }
.account-link, .account-logout { display: block; width: 100%; padding: 10px 8px; border: 0; background: transparent; color: var(--ink); font-size: .8rem; font-weight: 500; text-align: left; text-decoration: none; cursor: pointer; }
.account-link:hover, .account-logout:hover { background: var(--surface-raised); }
.account-logout { margin-top: 3px; border-top: 1px solid var(--line); color: var(--clay); }

/* Inicio. El visual es una vista conceptual de una web, no una ilustración decorativa. */
.hero { position: relative; width: min(var(--max), calc(100% - 64px)); min-height: 650px; margin-inline: auto; padding: 76px 0 82px; display: grid; grid-template-columns: minmax(0, .95fr) minmax(360px, .9fr); align-items: center; gap: clamp(44px,7vw,100px); }
.hero-copy { position: relative; z-index: 2; max-width: 640px; }
.hero-kicker { color: var(--sand); }
.hero h1 { max-width: 10ch; margin-top: 20px; font-size: clamp(3.4rem,6.1vw,5.65rem); }
.hero h1 .w { padding-bottom: .08em; }
.hero-note { max-width: 52ch; margin-top: 24px; color: var(--muted); font-size: 1rem; line-height: 1.85; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; margin-top: 30px; }
.hero-meta { margin-top: 17px; color: #898a81; font-size: .75rem; }
.hero-visual { position: relative; width: 100%; max-width: 540px; justify-self: end; padding: 18px 0 26px 20px; }
.preview-frame { position: relative; z-index: 1; overflow: hidden; border: 1px solid #42433b; border-radius: 7px; background: #e9e7df; color: #252720; box-shadow: 0 28px 70px rgba(0,0,0,.27); transform: translateY(0); transform-origin: center; transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
.hero-visual:hover .preview-frame { transform: translateY(-5px); box-shadow: 0 38px 80px rgba(0,0,0,.35); }
.preview-browser { min-height: 35px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid rgba(29,30,26,.11); color: #67685f; font-size: .59rem; letter-spacing: .03em; }
.preview-site { padding: clamp(19px,3vw,32px); }
.preview-site-nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #55564d; font-size: .55rem; letter-spacing: .06em; text-transform: uppercase; }
.preview-wordmark { color: #1b1c18; font-size: .75rem; font-weight: 800; letter-spacing: .1em; }
.preview-site-nav span:last-child { text-align: right; }
.preview-site-content { padding-top: clamp(25px,3.4vw,42px); }
.preview-overline { color: #77766b; font-size: .56rem; letter-spacing: .12em; text-transform: uppercase; }
.preview-site-content h2 { max-width: 9ch; margin-top: 12px; color: #24251f; font-size: clamp(2rem,3.5vw,3.1rem); line-height: .98; letter-spacing: -.065em; }
.preview-photo { position: relative; height: clamp(135px,18vw,220px); margin-top: 22px; overflow: hidden; background-color: #45463f; background-image: linear-gradient(180deg,rgba(20,21,18,.02),rgba(20,21,18,.22)),url("/assets/images/casa-norte-study.svg"); background-position: center; background-size: cover; }
.preview-meta { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 15px; color: #5b5c52; font-size: .62rem; }
.preview-meta a { color: #20211c; font-weight: 700; text-decoration: none; }
.preview-caption { max-width: 30ch; margin: 20px 5px 0 auto; color: #87877d; font-size: .69rem; line-height: 1.6; text-align: right; }

/* Secciones del inicio */
.home-services { padding: 88px 0 92px; border-top: 1px solid var(--line); }
.section-heading { display: grid; grid-template-columns: minmax(0, .8fr) minmax(260px, .7fr); align-items: end; gap: 42px; margin-bottom: 38px; }
.section-heading h2 { max-width: 12ch; margin-top: 12px; }
.section-heading > p { max-width: 48ch; margin-bottom: 4px; color: var(--muted); font-size: .92rem; line-height: 1.8; }
.home-service-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.home-service { min-height: 240px; padding: 26px 24px 24px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid var(--line); border-radius: 5px; background: linear-gradient(145deg,rgba(255,255,255,.025),transparent 64%); transition: border-color .25s ease, background .25s ease, transform .25s ease; }
.home-service:hover { transform: translateY(-3px); border-color: #58594f; background-color: rgba(255,255,255,.02); }
.home-service h3 { margin-top: 0; padding-top: 0; font-size: clamp(1.35rem,2.25vw,1.8rem); letter-spacing: -.045em; }
.home-service p { max-width: 36ch; margin-top: 10px; color: var(--muted); font-size: .83rem; line-height: 1.75; }
.home-service-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 19px; color: var(--forest); font-size: .77rem; font-weight: 700; text-decoration: none; }
.home-service-link span { display: inline-block; transition: transform .2s ease; }
.home-service-link:hover span { transform: translateX(4px); }
.home-process { padding: 84px 0 96px; background: var(--bg-soft); }
.home-process .section-heading { margin-bottom: 34px; }
.home-process-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; }
.home-process-item { padding-top: 18px; border-top: 1px solid var(--line-strong); }
.home-process-item h3 { margin-top: 18px; font-size: 1.55rem; }
.home-process-item p { max-width: 35ch; margin-top: 10px; color: var(--muted); font-size: .84rem; line-height: 1.8; }
.home-process-index { color: var(--sand); font-size: .72rem; font-weight: 600; letter-spacing: .08em; }
.home-cta { width: min(var(--max),calc(100% - 64px)); margin: 0 auto; padding: 76px 0 86px; display: flex; align-items: end; justify-content: space-between; gap: 36px; border-bottom: 1px solid var(--line); }
.home-cta h2 { max-width: 12ch; margin-top: 12px; }
.home-cta p:not(.eyebrow) { max-width: 47ch; margin-top: 14px; color: var(--muted); font-size: .9rem; }

/* Reseñas de la portada */
.home-reviews { padding: 82px 0 91px; background: #181916; color: var(--white); }
.home-reviews-inner { width: min(var(--max),calc(100% - 64px)); margin-inline: auto; display: grid; grid-template-columns: minmax(240px,.65fr) minmax(0,1fr); gap: clamp(42px,7vw,100px); align-items: start; }
.home-reviews-heading h2 { max-width: 10ch; margin-top: 13px; font-size: clamp(2rem,3.8vw,3.3rem); }
.home-reviews-heading .eyebrow { color: var(--sand); }
.btn-text-light { margin-top: 24px; color: var(--ink) !important; }
.quote-wrap { position: relative; min-height: 200px; }
.quote { padding-top: 2px; }
.quote blockquote { max-width: 22ch; font: 500 clamp(1.8rem,3.3vw,3.15rem)/1.12 var(--display); letter-spacing: -.05em; }
.quote figcaption { margin-top: 22px; color: var(--muted); font-size: .8rem; }
.qnav { display: flex; gap: 22px; margin-top: 24px; }
.qnav button { padding: 4px 0; border: 0; border-bottom: 1px solid #66665d; background: transparent; color: var(--ink); font-size: .74rem; cursor: pointer; }
.qnav button:hover { border-color: var(--sand); color: var(--forest); }

/* Cabeceras de páginas interiores */
.page-hero { padding: 82px 0 50px; }
.page-hero h1 { max-width: 11ch; margin-top: 17px; font-size: clamp(3.05rem,6vw,5.15rem); }
.page-hero .hero-small { max-width: 57ch; }

/* Servicios */
.service-list { padding: 12px 0 74px; }
.service-item { display: grid; grid-template-columns: minmax(0,1fr) minmax(250px,.7fr); gap: 42px; align-items: start; padding: 27px 0 30px; border-top: 1px solid var(--line); }
.service-item:last-child { border-bottom: 1px solid var(--line); }
.service-number { display: none; }
.service-item h2 { max-width: 15ch; font-size: clamp(1.65rem,3.1vw,2.6rem); letter-spacing: -.05em; }
.service-item p { max-width: 56ch; color: var(--muted); font-size: .9rem; line-height: 1.8; }
.service-tag { display: none; }
.pricing-note { padding: 4px 0 69px; }
.pricing-copy { max-width: 80ch; margin-top: 12px; color: var(--muted); font-size: .83rem; line-height: 1.9; }
.pricing-copy strong { color: var(--ink); font-weight: 600; }
.contact-band { width: min(var(--max),calc(100% - 64px)); margin: 0 auto 84px; padding: 30px 0; display: flex; align-items: end; justify-content: space-between; gap: 26px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.contact-band h2 { max-width: 12ch; margin-top: 12px; font-size: clamp(1.8rem,3.6vw,3rem); }

/* Proceso */
.process-wrap { padding: 10px 0 80px; }
.proc { margin: 0; padding: 0; list-style: none; }
.process-item { display: grid; grid-template-columns: 60px minmax(0,1fr); gap: 26px; padding: 29px 0 32px; border-top: 1px solid var(--line); }
.process-item:last-child { border-bottom: 1px solid var(--line); }
.process-no { color: var(--sand); font-size: .78rem; font-weight: 600; }
.process-item h2 { max-width: 14ch; margin-top: 10px; margin-bottom: 9px; font-size: clamp(1.7rem,3vw,2.6rem); }
.process-item p:last-child { max-width: 58ch; color: var(--muted); font-size: .9rem; line-height: 1.8; }

/* Agenda: formulario destacado, sin ruido visual */
.booking-stage { padding: 12px 0 92px; display: grid; grid-template-columns: minmax(240px,.7fr) minmax(0,1.3fr); gap: clamp(38px,7vw,100px); align-items: start; }
.booking-copy { position: sticky; top: 120px; }
.booking-copy h2 { max-width: 11ch; margin-top: 13px; font-size: clamp(2rem,4vw,3.2rem); }
.booking-copy > p:last-child { max-width: 35ch; margin-top: 14px; color: var(--muted); font-size: .9rem; line-height: 1.85; }
.demo { width: 100%; padding: 26px clamp(20px,3.3vw,38px) 32px; justify-self: end; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); box-shadow: 0 20px 50px rgba(0,0,0,.12); }
.booking-topline { display: flex; justify-content: space-between; gap: 12px; padding: 0 0 17px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .67rem; font-weight: 500; letter-spacing: .025em; }
.stp { display: flex; gap: clamp(13px,2vw,24px); margin: 0; padding: 17px 0; border-bottom: 1px solid var(--line); list-style: none; overflow-x: auto; }
.stp li { color: #77786f; font-size: .72rem; white-space: nowrap; }
.stp li.on { color: var(--forest); }
.booking-panel { padding-top: 29px; }
.pn[hidden] { display: none; }
.panel-question { margin-bottom: 17px; color: var(--ink); font: 600 clamp(1.6rem,2.8vw,2.15rem)/1.1 var(--display); letter-spacing: -.05em; }
.choice-grid { display: grid; gap: 9px; }
.choice-grid button { min-height: 52px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 4px; background: transparent; color: var(--ink); text-align: left; font-size: .83rem; font-weight: 500; cursor: pointer; transition: border-color .2s ease,background .2s ease,transform .2s ease; }
.choice-grid button:hover, .choice-grid button:focus-visible { border-color: var(--forest); background: rgba(194,203,179,.055); transform: translateY(-1px); }
.choice-grid button[aria-pressed='true'], .choice-grid button[aria-selected='true'] { border-color: var(--forest); background: rgba(194,203,179,.09); }
.date-grid, .slot-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.back { margin-top: 16px; padding: 4px 0; border: 0; border-bottom: 1px solid #66675e; background: transparent; color: var(--muted); font-size: .74rem; cursor: pointer; }
.back:hover { color: var(--ink); border-color: var(--sand); }
.done-state { min-height: 245px; display: grid; align-content: center; justify-items: start; text-align: left; }
.done-symbol { display: grid; place-items: center; width: 45px; height: 45px; border: 1px solid var(--forest); border-radius: 50%; color: var(--forest); font-size: 1.2rem; }
.done { max-width: 40ch; margin-top: 18px; color: var(--muted); font-size: .92rem; }

/* Portafolio dinámico: tarjetas limpias para proyectos reales publicados desde la API. */
.projects-stage { padding: 8px 0 90px; }
.projects-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px 20px; }
.works figure { min-width: 0; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.works figure img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 4px; background: var(--surface-raised); }
.works figure h3 { margin-top: 16px; font-size: clamp(1.4rem,2.4vw,2rem); }
.works figure small { display: block; margin-top: 8px; color: var(--sand); font-size: .69rem; letter-spacing: .04em; }
.works figure p { max-width: 58ch; margin-top: 8px; color: var(--muted); font-size: .84rem; line-height: 1.8; }
.projects-stage-empty .projects-grid { display: block; }
.project-empty-state { max-width: 820px; margin: 0 auto; padding: clamp(24px,5vw,52px); border: 1px solid var(--line); border-radius: 5px; background: var(--surface); }
.project-empty-state h2 { max-width: 20ch; font: 500 clamp(1.65rem,3.2vw,2.5rem)/1.15 var(--display); letter-spacing: -.04em; }
.project-empty-state p { max-width: 58ch; margin: 14px 0 22px; color: var(--muted); font-size: .9rem; line-height: 1.75; }
.works .empty, #reviews-all > p { grid-column: 1 / -1; padding: 25px 0; border-top: 1px solid var(--line); color: var(--muted); font-size: .9rem; }

/* Reseñas */
.review-list-stage { padding: 10px 0 76px; }
.all-reviews { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 42px; }
.all-reviews figure { padding: 25px 0 27px; border-top: 1px solid var(--line); }
.all-reviews blockquote { max-width: 29ch; font: 500 clamp(1.3rem,2.15vw,1.9rem)/1.28 var(--display); letter-spacing: -.04em; }
.all-reviews figcaption { margin-top: 16px; color: var(--muted); font-size: .78rem; }
.review-form-stage { padding: 38px 0 88px; border-top: 1px solid var(--line); }
.review-form-stage .narrow { width: min(620px,100%); }
.review-form-stage h2 { margin-top: 12px; }
.form-note { margin-top: 12px; color: var(--muted); font-size: .88rem; }

/* Contacto */
.contact-stage { padding: 10px 0 94px; display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1fr); gap: clamp(38px,7vw,95px); align-items: start; }
.contact-intro h2 { max-width: 11ch; margin-top: 13px; font-size: clamp(2rem,4vw,3.2rem); }
.contact-intro > p:not(.eyebrow) { max-width: 42ch; margin-top: 15px; color: var(--muted); font-size: .92rem; line-height: 1.85; }
.contact-intro .btn-text { margin-top: 23px; }

/* Cuenta */
.account-shell { padding: 62px 0 88px; }
.account-heading { padding-bottom: 27px; border-bottom: 1px solid var(--line); }
.account-heading h1 { max-width: none; margin-top: 13px; font-size: clamp(2.8rem,5vw,4.5rem); }
.account-subtitle { margin-top: 7px; color: var(--muted); font-size: .86rem; }
.account-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(35px,6vw,76px); padding: 34px 0; }
.account-card h2 { margin-top: 12px; margin-bottom: 22px; font-size: clamp(1.75rem,3vw,2.5rem); }
.account-data { border-top: 1px solid var(--line); }
.account-data > div { display: grid; grid-template-columns: 125px minmax(0,1fr); gap: 18px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.account-data dt { color: var(--muted); font-size: .75rem; }
.account-data dd { margin: 0; color: var(--ink); font-size: .84rem; overflow-wrap: anywhere; }

/* Administración */
.admin-page { min-height: 100svh; }
.admin-nav { width: min(var(--max),calc(100% - 64px)); margin-inline: auto; padding: 17px 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.admin-nav-right { display: flex; align-items: center; gap: 18px; }
.auth-brand { display: inline-flex; align-items: center; width: 144px; text-decoration: none; }
.auth-brand img { width: 100%; height: auto; }
.admin-shell { width: min(var(--max),calc(100% - 64px)); margin-inline: auto; padding: 53px 0 76px; }
.admin-heading { padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.admin-heading h1 { max-width: none; margin-top: 10px; font-size: clamp(2.6rem,5vw,4.2rem); }
.admin-who { margin-top: 7px; color: var(--muted); font-size: .8rem; }
.tabs { display: flex; flex-wrap: wrap; gap: 7px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.tabs button { padding: 8px 12px; border: 1px solid var(--line); border-radius: 3px; background: transparent; color: var(--muted); font-size: .72rem; font-weight: 500; cursor: pointer; transition: background .18s ease,color .18s ease,border-color .18s ease; }
.tabs button[aria-selected='true'], .tabs button:hover, .tabs button:focus-visible { border-color: var(--forest); background: var(--forest); color: #07130d; }
.admin-panel { padding-top: 16px; overflow-x: auto; }
.arow { display: grid; grid-template-columns: 150px minmax(0,1fr) 140px; gap: 16px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); font-size: .76rem; }
.arow span { min-width: 0; overflow-wrap: anywhere; }
.arow .grow { color: var(--muted); }
.arow button { padding: 7px 10px; border: 1px solid var(--line); border-radius: 3px; background: transparent; color: var(--ink); font-size: .7rem; cursor: pointer; }
.addf { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)) auto; gap: 8px; margin-bottom: 15px; }
.addf input, .addf select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 3px; background: var(--surface); color: var(--ink); font-size: .75rem; }
.addf button { min-height: 40px; padding: 8px 12px; border: 1px solid var(--forest); border-radius: 3px; background: var(--forest); color: #07130d; font-size: .73rem; font-weight: 700; }

/* Pie común */
.site-foot { margin-top: auto; border-top: 1px solid var(--line); background: #091711; color: rgba(242,241,235,.8); }
.footer-inner { width: min(var(--max),calc(100% - 64px)); margin-inline: auto; padding: 40px 0 18px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 26px; }
.footer-brand img { width: 130px; height: auto; }
.footer-brand p { max-width: 34ch; margin-top: 13px; color: var(--muted); font-size: .78rem; }
.footer-nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 11px 21px; align-content: start; }
.footer-link { color: #c0ccc2; font-size: .77rem; text-decoration: none; transition: color .2s ease; }
.footer-link:hover { color: var(--forest); }
.footer-bottom { grid-column: 1/-1; padding-top: 15px; border-top: 1px solid var(--line); color: #89978d; font-size: .68rem; }
.hp { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

@media (max-width: 980px) {
  .nav-inner { grid-template-columns: 140px auto; justify-content: space-between; gap: 20px; }
  .menu { position: absolute; left: 32px; right: 32px; top: calc(100% + 1px); display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 13px; border: 1px solid var(--line); border-radius: 5px; background: #091711; box-shadow: 0 22px 42px rgba(0,0,0,.3); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s ease,transform .2s ease,visibility .2s ease; }
  .menu.open { opacity: 1; visibility: visible; transform: none; }
  .burger { display: block; grid-column: 2; grid-row: 1; }
  .menu-links { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .menu .lnk { min-height: 47px; padding: 10px 7px; border-bottom: 1px solid var(--line); }
  .lnk[aria-current='page'] { text-decoration: none; color: var(--forest); }
  .nav-actions { justify-content: space-between; padding: 14px 7px 5px; }
  .nav-actions .nav-book { order: 1; }
  .nav-actions .account, .nav-actions .nav-login { order: 2; }
  .hero { grid-template-columns: minmax(0,1fr) minmax(300px,.85fr); gap: 35px; }
  .hero h1 { font-size: clamp(3.2rem,6vw,5rem); }
  .section-heading { gap: 28px; }
  .booking-stage { grid-template-columns: minmax(210px,.7fr) minmax(0,1.3fr); gap: 42px; }
  .contact-stage { grid-template-columns: minmax(0,.7fr) minmax(0,1fr); gap: 45px; }
}
@media (max-width: 740px) {
  .section-shell, .hero, .home-reviews-inner, .home-cta, .admin-nav, .admin-shell, .footer-inner { width: calc(100% - 36px); }
  .nav-inner { width: calc(100% - 36px); min-height: 72px; }
  .logo { width: 132px; }
  .menu { left: 18px; right: 18px; }
  .hero { min-height: auto; grid-template-columns: 1fr; padding: 65px 0 62px; gap: 38px; }
  .hero-copy { max-width: 590px; }
  .hero h1 { max-width: 10ch; font-size: clamp(3.2rem,12vw,5rem); }
  .hero-note { max-width: 52ch; font-size: .95rem; }
  .actions { gap: 16px; margin-top: 25px; }
  .hero-visual { width: min(100%,540px); justify-self: center; padding: 4px 0 20px 9px; }
  .preview-frame { transform: none; }
  .preview-site-content h2 { font-size: clamp(2rem,8vw,3.2rem); }
  .preview-photo { height: clamp(170px,48vw,250px); }
  .home-services { padding: 67px 0 70px; }
  .section-heading { grid-template-columns: 1fr; gap: 15px; margin-bottom: 28px; }
  .section-heading h2 { max-width: 13ch; }
  .section-heading > p { font-size: .9rem; }
  .home-service-grid { grid-template-columns: 1fr; gap: 10px; }
  .home-service { min-height: 0; padding: 22px; }
  .home-service h3 { margin-top: 0; padding-top: 0; }
  .home-process { padding: 66px 0 72px; }
  .home-process-list { grid-template-columns: 1fr; gap: 25px; }
  .home-process-item { padding-top: 16px; }
  .home-process-item h3 { margin-top: 10px; }
  .home-cta { padding: 61px 0 68px; align-items: flex-start; flex-direction: column; gap: 25px; }
  .home-cta h2 { max-width: 12ch; }
  .home-reviews { padding: 66px 0 70px; }
  .home-reviews-inner { grid-template-columns: 1fr; gap: 34px; }
  .home-reviews-heading h2 { max-width: 12ch; }
  .quote-wrap { min-height: 170px; }
  .quote blockquote { font-size: clamp(1.8rem,8vw,2.8rem); }
  .page-hero { padding: 64px 0 39px; }
  .page-hero h1 { font-size: clamp(3rem,11.5vw,4.5rem); }
  .hero-small { font-size: .95rem; }
  .service-list, .process-wrap, .review-list-stage, .review-form-stage, .contact-stage, .booking-stage { padding-top: 8px; }
  .service-item { grid-template-columns: 1fr; gap: 11px; padding: 24px 0; }
  .service-item h2 { font-size: clamp(1.65rem,7vw,2.3rem); }
  .service-item p { font-size: .88rem; }
  .contact-band { width: calc(100% - 36px); margin-bottom: 62px; flex-direction: column; align-items: flex-start; padding: 25px 0; gap: 19px; }
  .process-item { grid-template-columns: 36px minmax(0,1fr); gap: 16px; padding: 24px 0; }
  .process-item h2 { font-size: clamp(1.7rem,7.5vw,2.3rem); }
  .booking-stage { grid-template-columns: 1fr; gap: 30px; padding-bottom: 70px; }
  .booking-copy { position: static; }
  .booking-copy h2 { max-width: 13ch; }
  .demo { width: 100%; padding: 21px 19px 24px; }
  .booking-panel { padding-top: 23px; }
  .date-grid, .slot-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .all-reviews, .projects-grid { grid-template-columns: 1fr; column-gap: 0; }
  .all-reviews figure { padding: 22px 0; }
  .review-list-stage { padding-bottom: 62px; }
  .review-form-stage { padding-bottom: 67px; }
  .contact-stage { grid-template-columns: 1fr; gap: 31px; padding-bottom: 70px; }
  .field-grid { grid-template-columns: 1fr; }
  .account-shell { width: calc(100% - 36px); padding: 48px 0 66px; }
  .account-grid { grid-template-columns: 1fr; gap: 43px; padding: 28px 0; }
  .admin-shell { padding: 41px 0 62px; }
  .tabs { overflow-x: auto; flex-wrap: nowrap; }
  .tabs button { white-space: nowrap; }
  .arow { grid-template-columns: 1fr; gap: 6px; padding: 13px 0; }
  .addf { grid-template-columns: 1fr 1fr; }
  .addf button { grid-column: 1/-1; }
  .footer-inner { grid-template-columns: 1fr; gap: 24px; padding-top: 32px; }
  .footer-nav { justify-content: flex-start; }
  .footer-bottom { grid-column: auto; }
}
@media (max-width: 480px) {
  .actions { align-items: stretch; flex-direction: column; }
  .actions .btn-primary { width: 100%; }
  .actions .btn-text { align-self: flex-start; }
  .preview-site { padding: 17px; }
  .preview-site-nav { font-size: .48rem; }
  .preview-wordmark { font-size: .63rem; }
  .preview-meta { align-items: flex-start; flex-direction: column; gap: 7px; }
  .stp { gap: 13px; }
  .choice-grid button { min-height: 47px; }
  .account-data > div { grid-template-columns: 1fr; gap: 3px; }
  .addf { grid-template-columns: 1fr; }
  .addf button { grid-column: auto; }
  .admin-nav-right { gap: 11px; }
  .auth-brand { width: 126px; }
}