/* horizonte-azulejo: hoja de la web de muestra de Altea (2026-10-27). Propia: no hereda ni toca la de horizonte.
   Colores del logo: azul marino #124E82, turquesa #79C4CB y verde menta #BADBC1.
   Fondo claro no blanco (#F3F7F5, de la gama de la menta). Todo texto cumple AA en los dos modos (cifras en
   docs/referencia/muestra-altea.md). Movimiento: solo transform, opacity y clip-path, y NADA bajo
   prefers-reduced-motion. */

@font-face { font-family: 'Jost'; font-style: normal; font-weight: 300 600; font-display: swap; src: url('fonts/jost-vf-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 300 600; font-display: swap; src: url('fonts/jost-vf-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 500; font-display: swap; src: url('fonts/cormorant-garamond-500i-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 500; font-display: swap; src: url('fonts/cormorant-garamond-500i-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --at-bg: #F3F7F5; --at-bg2: #E6F0EC; --at-card: #FBFDFC;
  --at-ink: #0D2C47; --at-tx: #1D3346; --at-tx2: #4A5F70;
  --at-navy: #124E82; --at-turq: #79C4CB; --at-mint: #BADBC1; --at-teal: #1F6E78;
  --at-line: rgba(18, 78, 130, .14); --at-line2: rgba(18, 78, 130, .26);
  --at-cta: #124E82; --at-cta-tx: #fff; --at-cta-h: #0D3D68;
  --at-shadow: 0 1px 2px rgba(13, 44, 71, .06), 0 12px 32px -12px rgba(13, 44, 71, .18);
  --at-sea: #CFE6E8; --at-land: #F8F6EF; --at-urb: #ECEDE7; --at-green: #DEEADA; --at-road: #FFFFFF; --at-road-ed: #E3E2DA; --at-coast: #79C4CB; --at-rail: #8695A3; --at-pier: #CFCABB;
  --at-ease: cubic-bezier(.22, .8, .18, 1); --at-ease-out: cubic-bezier(.16, 1, .3, 1);
  --at-ff: 'Jost', 'Avenir Next', 'Segoe UI', system-ui, sans-serif; --at-ff-acc: 'Cormorant Garamond', Georgia, serif;
  --at-r: 18px; --at-r-s: 12px; --at-max: 1240px; --at-gut: clamp(20px, 5vw, 56px); --at-nav-h: 76px;
  color-scheme: light;
}
html.at-dark {
  --at-bg: #0A1823; --at-bg2: #0F2231; --at-card: #13293A;
  --at-ink: #EEF5F6; --at-tx: #D3E1E6; --at-tx2: #9FB6C2;
  --at-navy: #8EC3E6; --at-teal: #79C4CB;
  --at-line: rgba(142, 195, 230, .16); --at-line2: rgba(142, 195, 230, .3);
  --at-cta: #79C4CB; --at-cta-tx: #06202E; --at-cta-h: #9AD5DA;
  --at-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 16px 36px -14px rgba(0, 0, 0, .6);
  --at-sea: #0E3446; --at-land: #13212C; --at-urb: #1A2C39; --at-green: #15282A; --at-road: #2A4253; --at-road-ed: #2A4253; --at-coast: #4E9AA3; --at-rail: #6F8798; --at-pier: #2E4656;
  color-scheme: dark;
}
/* Los colores del logo en la pagina: la palabra y el arco azul siguen al tema; turquesa y menta no cambian. */
.at-logo { --at-ink: var(--at-logo-ink, #124E82); --at-navy: var(--at-logo-navy, #124E82); display: block; height: auto; }
html.at-dark .at-logo { --at-logo-ink: #EEF5F6; --at-logo-navy: #6FA9D8; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; scroll-behavior: smooth; scroll-padding-top: calc(var(--at-nav-h) + 12px); }
body.at { margin: 0; background: var(--at-bg); color: var(--at-tx); font-family: var(--at-ff); font-size: 17px; line-height: 1.65; font-weight: 400; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; transition: background-color .35s ease, color .35s ease; }
body.at img { max-width: 100%; display: block; }
body.at a { color: inherit; }
body.at :focus-visible { outline: 2px solid var(--at-turq); outline-offset: 3px; border-radius: 4px; }
.at-con { width: 100%; max-width: var(--at-max); margin: 0 auto; padding: 0 var(--at-gut); }
.at-skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--at-cta); color: var(--at-cta-tx); padding: 10px 16px; border-radius: 999px; text-decoration: none; }
.at-skip:focus { top: 12px; }
#atMain { overflow-x: clip; }

/* Tipografia */
.at-eyebrow { font-size: .76rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 500; color: var(--at-teal); margin: 0 0 18px; display: inline-flex; align-items: center; gap: 12px; }
.at-eyebrow::before { content: ''; width: 28px; height: 1px; background: currentColor; opacity: .7; }
.at-eyebrow-light { color: #fff; }
.at-h2 { font-family: var(--at-ff); font-weight: 300; font-size: clamp(2.1rem, 4.4vw, 3.6rem); line-height: 1.06; letter-spacing: -.015em; color: var(--at-ink); margin: 0; text-wrap: balance; }
.at-h2 em, .at-hero-h1 em { font-family: var(--at-ff-acc); font-style: italic; font-weight: 500; color: var(--at-teal); font-size: 1.12em; letter-spacing: 0; }
.at-h3 { font-weight: 400; font-size: clamp(1.4rem, 2.2vw, 1.85rem); line-height: 1.2; letter-spacing: -.005em; color: var(--at-ink); margin: 0 0 18px; }
.at-lead { font-size: clamp(1.05rem, 1.4vw, 1.22rem); color: var(--at-tx2); max-width: 60ch; margin: 18px 0 0; font-weight: 400; }
.at-sechead { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px 64px; margin-bottom: clamp(32px, 5vw, 56px); flex-wrap: wrap; }
.at-sechead-sub { max-width: 42ch; margin: 0; color: var(--at-tx2); }
.at-link { color: var(--at-navy); text-decoration: none; font-weight: 500; border-bottom: 1px solid var(--at-line2); padding-bottom: 2px; transition: border-color .25s; font-style: normal; }
.at-link:hover { border-color: currentColor; }

/* Botones */
.at-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 26px; border-radius: 999px; background: var(--at-cta); color: var(--at-cta-tx); text-decoration: none; font-weight: 500; font-size: .95rem; letter-spacing: .02em; border: 1px solid transparent; cursor: pointer; font-family: inherit; transition: background-color .25s, color .25s, border-color .25s, transform .25s var(--at-ease); white-space: nowrap; }
body.at a.at-btn { color: var(--at-cta-tx); }
.at-btn:hover { background: var(--at-cta-h); }
.at-btn:active { transform: scale(.98); }
.at-btn-light, body.at a.at-btn-light { background: #fff; color: #0D2C47; }
.at-btn-light:hover { background: var(--at-mint); }
.at-btn-ghost, body.at a.at-btn-ghost { background: rgba(255, 255, 255, .08); color: #fff; border-color: rgba(255, 255, 255, .7); backdrop-filter: blur(6px); }
.at-btn-ghost:hover { background: rgba(255, 255, 255, .18); }
.at-btn-line, body.at a.at-btn-line, body.at button.at-btn-line { background: transparent; color: var(--at-navy); border-color: var(--at-line2); }
.at-btn-line:hover { border-color: var(--at-navy); background: transparent; }
.at-btn-line span { color: var(--at-tx2); font-weight: 400; }

/* Cabecera */
.at-nav { position: fixed; inset: 0 0 auto 0; z-index: 50; height: var(--at-nav-h); color: #fff; transition: background-color .3s, color .3s, box-shadow .3s; }
.at-nav::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6, 22, 36, .45), rgba(6, 22, 36, 0)); opacity: 1; transition: opacity .35s; pointer-events: none; }
.at-nav.is-solid { background: color-mix(in srgb, var(--at-bg) 88%, transparent); backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); color: var(--at-ink); box-shadow: 0 1px 0 var(--at-line); height: 66px; }
.at-nav.is-solid::before { opacity: 0; }
.at-nav-i { position: relative; height: 100%; max-width: 1360px; margin: 0 auto; padding: 0 var(--at-gut); display: flex; align-items: center; gap: 28px; }
.at-nav-logo { display: block; width: 132px; flex: none; }
.at-nav:not(.is-solid) .at-nav-logo .at-logo { --at-logo-ink: #fff; --at-logo-navy: #fff; }
.at-nav-links { display: flex; gap: 30px; margin: 0 auto; }
.at-nav-links a { text-decoration: none; font-size: .92rem; letter-spacing: .02em; position: relative; padding: 6px 0; }
.at-nav-links a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .35s var(--at-ease); }
.at-nav-links a:hover::after { transform: scaleX(1); transform-origin: left; }
.at-nav-r { display: flex; align-items: center; gap: 14px; margin-left: auto; }
.at-nav-links + .at-nav-r { margin-left: 0; }
.at-btn-nav { min-height: 42px; padding: 0 20px; font-size: .88rem; }
.at-nav:not(.is-solid) .at-btn-nav { background: #fff; color: #0D2C47; }
.at-lang { position: relative; font-size: .85rem; letter-spacing: .08em; }
.at-lang summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px; border: 1px solid currentColor; border-color: color-mix(in srgb, currentColor 35%, transparent); border-radius: 999px; font-weight: 500; }
.at-lang summary::-webkit-details-marker { display: none; }
.at-lang ul { position: absolute; right: 0; top: calc(100% + 8px); margin: 0; padding: 6px; list-style: none; background: var(--at-card); color: var(--at-ink); border: 1px solid var(--at-line); border-radius: 12px; box-shadow: var(--at-shadow); min-width: 140px; letter-spacing: 0; }
.at-lang:not([open]) ul { display: none; }
.at-lang a { display: block; padding: 8px 12px; border-radius: 8px; text-decoration: none; }
.at-lang a[aria-current] { background: var(--at-bg2); font-weight: 500; }
.at-theme { width: 38px; height: 38px; display: inline-grid; place-items: center; border-radius: 50%; border: 1px solid color-mix(in srgb, currentColor 35%, transparent); background: transparent; color: inherit; cursor: pointer; padding: 0; }
.at-theme svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }
.at-ic-sun { display: none; }
html.at-dark .at-ic-sun { display: block; }
html.at-dark .at-ic-moon { display: none; }
.at-burger { display: none; width: 42px; height: 42px; border-radius: 50%; border: 1px solid color-mix(in srgb, currentColor 35%, transparent); position: relative; }
.at-burger i, .at-menu-x i { position: absolute; left: 12px; right: 12px; height: 1.5px; background: currentColor; border-radius: 2px; }
.at-burger i:first-child { top: 16px; } .at-burger i:last-child { top: 24px; }
.at-menu { position: fixed; inset: 0; z-index: 60; background: var(--at-bg); color: var(--at-ink); display: none; overflow-y: auto; }
.at-menu:target, .at-menu.is-open { display: block; }
.at-menu-i { min-height: 100%; padding: 26px var(--at-gut) 40px; display: flex; flex-direction: column; }
.at-menu-x { align-self: flex-end; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--at-line2); position: relative; color: var(--at-ink); }
.at-menu-x i { top: 21px; left: 11px; right: 11px; }
.at-menu-x i:first-child { transform: rotate(45deg); } .at-menu-x i:last-child { transform: rotate(-45deg); }
.at-menu-l { list-style: none; margin: 30px 0 0; padding: 0; }
.at-menu-l li { border-bottom: 1px solid var(--at-line); }
.at-menu-l a { display: flex; align-items: baseline; gap: 16px; padding: 18px 0; text-decoration: none; font-size: clamp(1.8rem, 7vw, 2.6rem); font-weight: 300; letter-spacing: -.01em; }
.at-menu-l span { font-size: .8rem; color: var(--at-teal); letter-spacing: .1em; font-weight: 500; }
.at-menu.is-open .at-menu-l li { animation: at-up .5s var(--at-ease-out) both; animation-delay: calc(var(--i) * 45ms + 80ms); }
.at-menu-f { margin-top: auto; padding-top: 36px; display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
html.at-lock { overflow: hidden; }
@keyframes at-up { from { transform: translateY(18px); } to { transform: none; } }

/* Hero */
.at-hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; color: #fff; isolation: isolate; overflow: hidden; background: #0D2C47; }
.at-hero-media { position: absolute; inset: 0; z-index: -1; }
.at-hero-img, .at-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.at-hero-img { transform: scale(1.04); animation: at-settle 1.6s var(--at-ease-out) both; }
.at-hero-video { opacity: 0; transition: opacity 1s ease; }
.at-hero-video.is-on { opacity: 1; }
@keyframes at-settle { from { transform: scale(1.08); } to { transform: scale(1.04); } }
.at-hero-veil { position: absolute; inset: 0; background:
  linear-gradient(90deg, rgba(7, 26, 43, .8) 0%, rgba(7, 26, 43, .64) 40%, rgba(7, 26, 43, .3) 66%, rgba(7, 26, 43, .04) 100%),
  linear-gradient(0deg, rgba(7, 26, 43, .66) 0%, rgba(7, 26, 43, 0) 52%); }
.at-hero-c { width: 100%; max-width: var(--at-max); margin: 0 auto; padding: calc(var(--at-nav-h) + 40px) var(--at-gut) clamp(64px, 11vh, 120px); }
.at-hero-logo { width: clamp(220px, 30vw, 380px); margin-bottom: clamp(26px, 4vh, 44px); }
.at-hero-logo .at-logo { --at-logo-ink: #fff; --at-logo-navy: #fff; overflow: visible; }
.at-hero-h1 { font-weight: 300; font-size: clamp(2.3rem, 5.6vw, 4.8rem); line-height: 1.03; letter-spacing: -.02em; margin: 0; max-width: 15ch; text-wrap: balance; text-shadow: 0 1px 24px rgba(4, 18, 30, .35); }
.at-hero-sub { font-size: clamp(1.05rem, 1.6vw, 1.3rem); margin: 22px 0 0; max-width: 44ch; color: rgba(255, 255, 255, .92); text-shadow: 0 1px 14px rgba(4, 18, 30, .4); }
.at-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 34px; }
.at-scroll { position: absolute; right: var(--at-gut); bottom: 34px; width: 1px; height: 64px; background: rgba(255, 255, 255, .35); overflow: hidden; }
.at-scroll span { position: absolute; left: 0; top: 0; width: 1px; height: 22px; background: #fff; animation: at-drip 2.2s var(--at-ease) infinite; }
@keyframes at-drip { from { transform: translateY(-22px); } to { transform: translateY(64px); } }
#atSentinel { height: 1px; margin-top: -1px; }

/* Perfil de Altea */
.at-perfil { padding: clamp(80px, 11vw, 150px) 0 clamp(60px, 8vw, 110px); }
.at-sky { max-width: 1360px; margin: clamp(40px, 6vw, 72px) auto 0; padding: 0 var(--at-gut); }
.at-sky-svg { width: 100%; height: auto; display: block; overflow: visible; }
.at-sky-svg path { stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.at-sky-sierra path { stroke: var(--at-mint); stroke-width: 1.6; }
html.at-dark .at-sky-sierra path { stroke: #5E8D78; }
.at-sky-town path { stroke: var(--at-navy); }
.at-sky-dome path { stroke: var(--at-turq); stroke-width: 1.8; }
.at-sky-mar path { stroke: var(--at-turq); }
.at-draw { stroke-dasharray: 1 1; stroke-dashoffset: 0; }
.at-js .at-sky:not(.is-drawn) .at-draw { stroke-dashoffset: 1; }
.at-sky.is-drawn .at-draw { transition: stroke-dashoffset .5s var(--at-ease); transition-delay: var(--d, 0ms); }
.at-cifras { list-style: none; margin: clamp(36px, 5vw, 56px) 0 0; padding: 26px 0 0; border-top: 1px solid var(--at-line); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.at-cifras strong { display: block; font-weight: 300; font-size: clamp(2.2rem, 4vw, 3.2rem); line-height: 1; color: var(--at-navy); letter-spacing: -.02em; }
.at-cifras span { color: var(--at-tx2); font-size: .95rem; }

/* Alojamientos */
.at-aloj { padding: clamp(64px, 7.5vw, 110px) 0; }
.at-h2 em { white-space: nowrap; }
.at-filtros { display: flex; flex-wrap: wrap; gap: 10px; margin: -12px 0 clamp(28px, 4vw, 44px); align-items: center; }
.at-js .at-filtros[hidden] { display: flex; }
.at-chip { display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--at-line2); background: transparent; color: var(--at-ink); font: inherit; font-size: .93rem; cursor: pointer; transition: background-color .3s, color .3s, border-color .3s; }
.at-chip span { font-size: .78rem; color: var(--at-tx2); font-variant-numeric: tabular-nums; transition: color .3s; }
.at-chip:hover { border-color: var(--at-navy); }
.at-chip.is-on { background: var(--at-cta); color: var(--at-cta-tx); border-color: var(--at-cta); }
.at-chip.is-on span { color: inherit; opacity: .8; }
.at-filtros-st { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; }
.at-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(22px, 2.6vw, 36px) clamp(18px, 2vw, 28px); }
.at-card { position: relative; transition: opacity .45s ease, filter .45s ease; }
.at-card.is-out { opacity: .32; filter: saturate(.25); }
.at-card.is-hot .at-card-h { color: var(--at-navy); }
.at-card-a { display: block; text-decoration: none; color: inherit; }
.at-card-media { position: relative; aspect-ratio: 4 / 3; border-radius: var(--at-r); overflow: hidden; background: var(--at-bg2); isolation: isolate; }
.at-card-track { display: flex; height: 100%; transition: transform .32s var(--at-ease-out); }
.at-card-img { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--at-ease-out); }
.at-card-dots { position: absolute; left: 0; right: 0; bottom: 12px; display: flex; justify-content: center; gap: 6px; opacity: 0; transition: opacity .3s; }
.at-card-dots i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, .55); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .15); transition: background-color .25s, transform .25s; }
.at-card-dots i.on { background: #fff; transform: scale(1.25); }
.at-card-a:hover .at-card-dots, .at-card-a:focus-visible .at-card-dots { opacity: 1; }
.at-card-b { padding: 16px 2px 0; }
.at-card-z { margin: 0 0 4px; font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--at-teal); font-weight: 500; }
.at-card-h { margin: 0; font-weight: 400; font-size: 1.28rem; line-height: 1.25; color: var(--at-ink); transition: color .25s; }
.at-card-s { margin: 6px 0 0; color: var(--at-tx2); font-size: .92rem; }
.at-card-t { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.at-card-t li { font-size: .74rem; letter-spacing: .04em; padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--at-mint) 42%, transparent); color: var(--at-ink); }
html.at-dark .at-card-t li { background: color-mix(in srgb, var(--at-mint) 16%, transparent); }

/* Mapa */
.at-mapa { padding: clamp(64px, 7.5vw, 110px) 0; background: var(--at-bg2); }
.at-mapa-wrap { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); gap: clamp(18px, 2.4vw, 32px); align-items: start; }
.at-mlist { list-style: none; margin: 0; padding: 6px; max-height: min(78vh, 760px); overflow-y: auto; border-radius: var(--at-r); background: var(--at-card); box-shadow: var(--at-shadow); scrollbar-width: thin; }
.at-mlist li { transition: opacity .35s; }
.at-mlist li.is-out { opacity: .38; }
.at-mlist a { display: flex; gap: 14px; align-items: center; padding: 9px; border-radius: 12px; text-decoration: none; transition: background-color .25s; }
.at-mlist img { width: 72px; height: 54px; border-radius: 9px; object-fit: cover; flex: none; background: var(--at-bg2); }
.at-mlist strong { display: block; font-weight: 500; font-size: .95rem; color: var(--at-ink); line-height: 1.3; }
.at-mlist em { font-style: normal; font-size: .82rem; color: var(--at-tx2); }
.at-mlist li.is-hot a, .at-mlist a:hover { background: color-mix(in srgb, var(--at-turq) 18%, transparent); }
.at-map { aspect-ratio: var(--ratio, 1.2); border-radius: var(--at-r); overflow: hidden; box-shadow: var(--at-shadow); background: var(--at-sea); position: sticky; top: calc(var(--at-nav-h) + 8px); }
.at-map > * { position: absolute; }
.at-map > .am-base { inset: 0; }
.at-map .am-base { width: 100%; height: 100%; }
.m-sea { fill: var(--at-sea); } .m-land { fill: var(--at-land); } .m-urb { fill: var(--at-urb); } .m-green { fill: var(--at-green); } .m-beach { fill: #EFE3C6; }
html.at-dark .m-beach { fill: #2B3530; }
.m-coast { fill: none; stroke: var(--at-coast); stroke-width: 1.4; }
.m-r3 { fill: none; stroke: var(--at-road); stroke-width: 1.1; }
.m-r2 { fill: none; stroke: var(--at-road); stroke-width: 2.6; }
.m-r1 { fill: none; stroke: var(--at-road); stroke-width: 4.2; }
.m-rail { fill: none; stroke: var(--at-rail); stroke-width: 1.2; stroke-dasharray: 5 4; }
.m-pier { fill: none; stroke: var(--at-pier); stroke-width: 2; }
.at-map-et, .at-map-mar { position: absolute; transform: translate(-50%, -50%); font-size: clamp(.62rem, 1.05vw, .78rem); letter-spacing: .18em; text-transform: uppercase; color: var(--at-tx2); font-weight: 500; white-space: nowrap; pointer-events: none; text-shadow: 0 0 6px var(--at-land), 0 0 2px var(--at-land); }
.at-map-mar { color: var(--at-teal); font-family: var(--at-ff-acc); font-style: italic; text-transform: none; letter-spacing: .02em; font-size: clamp(.95rem, 1.6vw, 1.35rem); text-shadow: none; }
.at-map-attr { position: absolute; right: 8px; bottom: 6px; font-size: .66rem; color: var(--at-tx2); background: color-mix(in srgb, var(--at-land) 80%, transparent); padding: 2px 6px; border-radius: 6px; }
.at-pin { position: absolute; width: 30px; height: 30px; transform: translate(-50%, -50%); padding: 0; border: 0; background: transparent; cursor: pointer; display: grid; place-items: center; z-index: 2; }
.at-pin i { width: 14px; height: 14px; border-radius: 50%; background: var(--at-navy); box-shadow: 0 0 0 3px var(--at-card), 0 2px 8px rgba(13, 44, 71, .35); transition: transform .3s var(--at-ease), background-color .3s, box-shadow .3s; }
html.at-dark .at-pin i { background: var(--at-turq); box-shadow: 0 0 0 3px #0A1823, 0 2px 8px rgba(0, 0, 0, .5); }
.at-pin::before { content: ''; position: absolute; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--at-turq); opacity: 0; transform: scale(1); }
.at-pin:hover i, .at-pin:focus-visible i, .at-pin.is-hot i, .at-pin.is-on i { transform: scale(1.45); background: var(--at-teal); }
html.at-dark .at-pin.is-hot i, html.at-dark .at-pin.is-on i { background: #fff; }
.at-pin.is-hot::before, .at-pin.is-on::before { animation: at-ring 1.3s var(--at-ease-out) infinite; }
@keyframes at-ring { from { opacity: .9; transform: scale(1); } to { opacity: 0; transform: scale(2.8); } }
.at-pin.is-out { opacity: .3; }
.at-pin.is-hot, .at-pin.is-on { z-index: 4; }
.at-pin.is-static { cursor: default; }
.at-zona-halo { position: absolute; width: 22%; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%); background: radial-gradient(circle, color-mix(in srgb, var(--at-turq) 36%, transparent) 0%, transparent 70%); pointer-events: none; }
.at-pop { position: absolute; z-index: 6; width: 250px; transform: translateX(-50%); filter: drop-shadow(0 18px 30px rgba(13, 44, 71, .28)); }
.at-pop[hidden] { display: none; }
.at-pop-a { display: block; background: var(--at-card); border-radius: 16px; overflow: hidden; text-decoration: none; color: var(--at-ink); animation: at-pop .22s var(--at-ease-out); transform-origin: var(--o, 50% 100%); }
@keyframes at-pop { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
.at-pop-img { display: block; aspect-ratio: 16 / 10; background: var(--at-bg2); }
.at-pop-img img { width: 100%; height: 100%; object-fit: cover; }
.at-pop-b { display: block; padding: 12px 16px 14px; }
.at-pop-b em { display: block; font-style: normal; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--at-teal); font-weight: 500; }
.at-pop-b strong { display: block; font-weight: 500; font-size: 1.02rem; line-height: 1.3; margin: 2px 0; }
.at-pop-b small { display: block; color: var(--at-tx2); font-size: .82rem; }
.at-pop-go { display: inline-block; margin-top: 8px; font-size: .84rem; color: var(--at-navy); font-weight: 500; border-bottom: 1px solid var(--at-line2); }

/* Entorno */
/* Entorno: mosaico de cuatro (grande a la izquierda, dos arriba a la derecha y una ancha debajo), texto sobre la
   tarjeta azul marino y la foto que entra por mascara debajo del texto. */
.at-entorno { padding: clamp(64px, 7.5vw, 110px) 0; }
.at-ent-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: repeat(2, clamp(260px, 25vw, 360px)); gap: clamp(14px, 1.6vw, 22px); }
.at-ent { grid-column: span 3; position: relative; overflow: hidden; border-radius: var(--at-r); background: #0D2C47; color: #fff; isolation: isolate; display: flex; align-items: flex-end; }
.at-ent-big { grid-column: span 6; grid-row: span 2; }
.at-ent:nth-child(4) { grid-column: span 6; }
.at-reveal { display: block; position: relative; overflow: hidden; border-radius: var(--at-r); background: var(--at-bg2); }
.at-ent .at-reveal { position: absolute; inset: 0; z-index: -2; background: transparent; }
.at-ent::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(0deg, rgba(7, 26, 43, .94) 0%, rgba(7, 26, 43, .8) 42%, rgba(7, 26, 43, .35) 68%, rgba(7, 26, 43, 0) 88%); }
.at-ent-img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--at-ease-out); }
.at-js .at-reveal:not(.is-in) { clip-path: inset(100% 0 0 0 round var(--at-r)); }
.at-js .at-reveal:not(.is-in) img { transform: scale(1.12); }
.at-reveal.is-in { clip-path: inset(0 0 0 0 round var(--at-r)); transition: clip-path .85s var(--at-ease-out); }
.at-reveal.is-in img { transition: transform 1.2s var(--at-ease-out); }
.at-ent-b { padding: clamp(18px, 2.2vw, 30px); max-width: 52ch; }
.at-ent-b h3 { margin: 0 0 6px; font-weight: 400; font-size: clamp(1.25rem, 1.8vw, 1.6rem); color: #fff; letter-spacing: -.005em; }
.at-ent-big .at-ent-b h3 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); }
.at-ent-b p { margin: 0 0 12px; color: rgba(255, 255, 255, .92); font-size: .95rem; line-height: 1.5; }
.at-ent-big .at-ent-b p { font-size: 1.05rem; }
.at-ent .at-link { color: #fff; border-color: rgba(255, 255, 255, .45); }
.at-ent .at-link:hover { border-color: #fff; }
.at-ent-us { margin: 0; }

/* Blog */
.at-blog { padding: clamp(60px, 8vw, 110px) 0; border-top: 1px solid var(--at-line); }
.at-blogcard { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; text-decoration: none; color: inherit; }
.at-blogcard-img { aspect-ratio: 3 / 2; display: block; border-radius: var(--at-r); overflow: hidden; }
.at-blogcard-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--at-ease-out); }
.at-blogcard-b strong { display: block; font-weight: 300; font-size: clamp(1.6rem, 2.8vw, 2.3rem); line-height: 1.15; color: var(--at-ink); letter-spacing: -.01em; }
.at-blogcard-b > span { display: block; margin: 14px 0 20px; color: var(--at-tx2); }
.at-blogi { padding: calc(var(--at-nav-h) + 60px) 0 100px; }
.at-blogi-list { display: grid; gap: 56px; margin-top: 48px; }

/* Contacto */
.at-contacto { padding: clamp(80px, 10vw, 140px) 0; background: var(--at-bg2); text-align: center; }
.at-ct-i { display: flex; flex-direction: column; align-items: center; }
.at-ct-sym { width: 74px; margin-bottom: 26px; }
.at-contacto .at-lead { margin-left: auto; margin-right: auto; }
.at-ct-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 36px; }
/* Varios WhatsApp (.at-ct-n): una fila con cada numero y otra con telefono y correo. */
.at-ct-n + .at-ct-n { margin-top: 12px; }
.at-ct-n .at-btn span { font-weight: 400; font-variant-numeric: tabular-nums; }

/* Pie */
.at-foot { padding: 70px 0 34px; border-top: 1px solid var(--at-line); font-size: .92rem; }
.at-foot-i { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); gap: 40px; }
.at-foot-brand .at-logo { width: 150px; }
.at-foot-brand p { color: var(--at-tx2); max-width: 36ch; margin: 18px 0 0; }
.at-foot-col h2 { font-size: .76rem; letter-spacing: .2em; text-transform: uppercase; color: var(--at-teal); font-weight: 500; margin: 6px 0 14px; }
.at-foot-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.at-foot-col span { color: var(--at-tx2); font-variant-numeric: tabular-nums; margin-left: 6px; }
.at-foot-col a { text-decoration: none; }
.at-foot-col a:hover { text-decoration: underline; }
.at-foot-legal { margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--at-line); display: flex; justify-content: space-between; gap: 24px; align-items: center; flex-wrap: wrap; color: var(--at-tx2); font-size: .82rem; }
.at-foot-legal p { margin: 0; max-width: 80ch; }
.slbv { display: inline-flex; align-items: center; gap: 10px; color: var(--at-tx2); font-size: .78rem; }
.slbv-a { color: var(--at-ink); display: inline-flex; }
.slbv svg { height: 15px; width: auto; }

/* Ficha */
.at-u-hero { position: relative; min-height: min(82svh, 760px); display: flex; align-items: flex-end; color: #fff; isolation: isolate; overflow: hidden; background: #0D2C47; }
.at-u-hero-img { position: absolute; inset: 0; z-index: -1; }
.at-u-hero-img img { width: 100%; height: 100%; object-fit: cover; animation: at-settle 1.6s var(--at-ease-out) both; }
.at-u-hero-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7, 26, 43, .78) 0%, rgba(7, 26, 43, .25) 52%, rgba(7, 26, 43, .2) 100%); }
.at-u-hero-c { padding-top: 140px; padding-bottom: clamp(44px, 7vw, 76px); }
.at-back { display: inline-block; color: #fff; text-decoration: none; font-size: .9rem; margin-bottom: 26px; opacity: .92; }
.at-back:hover { opacity: 1; text-decoration: underline; }
.at-back-dark { color: var(--at-navy); }
.at-u-h1 { font-weight: 300; font-size: clamp(2.2rem, 5vw, 4.2rem); line-height: 1.05; letter-spacing: -.02em; margin: 0; max-width: 18ch; text-wrap: balance; }
.at-u-specs { margin: 18px 0 0; font-size: 1.08rem; color: rgba(255, 255, 255, .92); }
.at-u-gal { padding: clamp(40px, 6vw, 72px) 0 0; }
.at-u-mosaic { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; aspect-ratio: 2.3 / 1; }
.at-u-tile { padding: 0; border: 0; cursor: zoom-in; border-radius: var(--at-r-s); }
.at-u-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--at-ease-out); }
.at-u-tile:first-child { grid-row: span 2; }
.at-u-todas { margin-top: 18px; }
.at-lb { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(6, 18, 28, .96); color: #fff; }
.at-lb::backdrop { background: rgba(6, 18, 28, .96); }
.at-lb-i { display: flex; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.at-lb-i::-webkit-scrollbar { display: none; }
.at-lb-f { flex: 0 0 100%; margin: 0; display: grid; place-items: center; scroll-snap-align: center; padding: 64px 70px; }
.at-lb-f img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 8px; }
.at-lb-n { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); margin: 0; font-size: .85rem; letter-spacing: .1em; }
.at-lb-b, .at-lb-x { position: absolute; width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .4); background: rgba(255, 255, 255, .06); color: #fff; cursor: pointer; display: grid; place-items: center; }
.at-lb-b svg, .at-lb-x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.at-lb-prev { left: 16px; top: 50%; transform: translateY(-50%); } .at-lb-next { right: 16px; top: 50%; transform: translateY(-50%); }
.at-lb-x { right: 16px; top: 16px; }
.at-u-cols { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(32px, 5vw, 80px); padding-top: clamp(48px, 7vw, 90px); padding-bottom: clamp(48px, 7vw, 90px); align-items: start; }
.at-u-sec { padding: 0 0 clamp(36px, 5vw, 56px); margin-bottom: clamp(36px, 5vw, 56px); border-bottom: 1px solid var(--at-line); }
.at-u-sec:last-child { border-bottom: 0; margin-bottom: 0; }
.at-u-desc p { margin: 0 0 14px; max-width: 68ch; }
.at-u-desc p:first-child { font-size: 1.18rem; color: var(--at-ink); }
.at-u-datos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; margin: 0; }
.at-u-datos div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--at-line); }
.at-u-datos dt { color: var(--at-tx2); }
.at-u-datos dd { margin: 0; text-align: right; color: var(--at-ink); font-weight: 500; }
.at-u-equip { list-style: none; margin: 0; padding: 0; columns: 3 180px; column-gap: 32px; }
.at-u-equip li { break-inside: avoid; padding: 7px 0 7px 22px; position: relative; }
.at-u-equip li::before { content: ''; position: absolute; left: 0; top: 16px; width: 8px; height: 8px; border-radius: 50%; background: var(--at-mint); box-shadow: inset 0 0 0 1.5px var(--at-teal); }
.at-u-note { color: var(--at-tx2); font-size: .92rem; margin: -6px 0 18px; }
.at-map-u { position: relative; top: auto; }
.at-map-u > .at-map-attr, .at-map > .at-map-attr { position: absolute; }
.at-cal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.at-cal-m h3 { margin: 0 0 12px; font-weight: 500; font-size: 1rem; color: var(--at-ink); }
.at-cal-m h3::first-letter { text-transform: uppercase; }
.at-cal-g { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; text-align: center; font-size: .86rem; font-variant-numeric: tabular-nums; }
.at-cal-g b { font-weight: 500; color: var(--at-tx2); font-size: .72rem; letter-spacing: .08em; padding-bottom: 4px; }
.at-cal-g span { aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; color: var(--at-ink); }
.at-cal-g .is-past { color: var(--at-tx2); text-decoration: line-through; text-decoration-thickness: 1px; }   /* sin opacidad: el dia pasado se lee con contraste AA y se distingue por el tachado */
.at-cal-g .is-busy { background: color-mix(in srgb, var(--at-navy) 12%, transparent); color: var(--at-tx2); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--at-tx2) 60%, transparent); }
.at-cal-g .is-today { box-shadow: inset 0 0 0 1.5px var(--at-teal); font-weight: 600; }
.at-cal-nav { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.at-cal-nav button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--at-line2); background: transparent; color: var(--at-ink); cursor: pointer; font-size: 1rem; }
.at-cal-nav button:disabled { opacity: .35; cursor: default; }
.at-cal-ley { display: flex; gap: 18px; font-size: .84rem; color: var(--at-tx2); }
.at-cal-ley i { display: inline-block; width: 12px; height: 12px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; border: 1px solid var(--at-line2); }
.at-cal-ley .o i { background: color-mix(in srgb, var(--at-navy) 12%, transparent); }
.at-u-side { position: sticky; top: calc(var(--at-nav-h) + 16px); }
.at-consulta { background: var(--at-card); border-radius: var(--at-r); padding: 28px; box-shadow: var(--at-shadow); border: 1px solid var(--at-line); }
.at-consulta .at-h3 { font-size: 1.4rem; }
.at-consulta-f { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.at-consulta-f label { min-width: 0; }
.at-consulta-f label { display: grid; gap: 6px; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--at-tx2); font-weight: 500; }
.at-consulta-p { grid-column: 1 / -1; }
.at-consulta-f input, .at-consulta-f select { box-sizing: border-box; min-width: 0; max-width: 100%; width: 100%; height: 48px; border-radius: 12px; border: 1px solid var(--at-line2); background: var(--at-bg); color: var(--at-ink); font: inherit; font-size: 1rem; letter-spacing: 0; text-transform: none; padding: 0 12px; }
.at-consulta-b { display: grid; gap: 10px; margin-top: 18px; }
.at-consulta-b .at-btn { width: 100%; }
.at-consulta-tel { text-align: center; font-size: .9rem; color: var(--at-navy); }
.at-consulta .at-u-note { margin: 16px 0 0; font-size: .84rem; }
.at-u-mas { padding: clamp(56px, 7vw, 100px) 0; background: var(--at-bg2); }

/* Responsive */
/* Zoom de fotos al pasar el cursor: solo con raton (en tactil un :hover se queda pegado tras el toque). */
@media (hover: hover) and (pointer: fine) {
  .at-card-a:hover .at-card-img { transform: scale(1.035); }
  .at-ent:hover .at-reveal.is-in .at-ent-img { transform: scale(1.035); }
  .at-blogcard:hover .at-blogcard-img img { transform: scale(1.03); }
  .at-u-tile:hover img { transform: scale(1.04); }
}
@media (max-width: 1120px) {
  .at-ent-grid { grid-template-rows: repeat(3, clamp(240px, 36vw, 340px)); }
  .at-ent { grid-column: span 6; }
  .at-ent.at-ent-big, .at-ent:nth-child(4) { grid-column: span 12; grid-row: auto; }
  .at-nav-links { display: none; }
  .at-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .at-u-cols { grid-template-columns: minmax(0, 1fr); }
  .at-u-side { position: static; order: -1; }
}
@media (max-width: 860px) {
  :root { --at-nav-h: 64px; }
  .at-nav.is-solid { height: 60px; }
  .at-btn-nav, .at-lang-nav, .at-nav-r > .at-theme { display: none; }
  .at-burger { display: block; }
  .at-nav-logo { width: 116px; }
  .at-mapa-wrap { grid-template-columns: minmax(0, 1fr); }
  .at-map { position: relative; top: auto; order: -1; }
  .at-mlist { max-height: none; display: flex; overflow-x: auto; gap: 8px; scroll-snap-type: x mandatory; background: transparent; box-shadow: none; padding: 4px 2px 10px; }
  .at-mlist li { flex: 0 0 76%; scroll-snap-align: start; }
  .at-mlist a { background: var(--at-card); box-shadow: var(--at-shadow); }
  .at-ent-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .at-ent, .at-ent.at-ent-big, .at-ent:nth-child(4) { grid-column: auto; grid-row: auto; min-height: clamp(300px, 82vw, 420px); }
  .at-blogcard { grid-template-columns: minmax(0, 1fr); }
  .at-foot-i { grid-template-columns: minmax(0, 1fr); }
  .at-u-mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: auto; aspect-ratio: auto; }
  .at-u-tile { aspect-ratio: 4 / 3; }
  .at-u-tile:first-child { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 16 / 10; }
  .at-u-tile:nth-child(n+4) { display: none; }
  .at-cal { grid-template-columns: minmax(0, 1fr); }
  .at-u-datos { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  body.at { font-size: 16px; }
  .at-grid { grid-template-columns: minmax(0, 1fr); }
  .at-card-track { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .at-card-track::-webkit-scrollbar { display: none; }
  .at-card-img { scroll-snap-align: start; }
  .at-card-dots { opacity: 1; }
  .at-cifras { gap: 12px; }
  .at-hero-veil { background: linear-gradient(0deg, rgba(7, 26, 43, .82) 0%, rgba(7, 26, 43, .5) 45%, rgba(7, 26, 43, .15) 100%); }
  .at-scroll { display: none; }
  .at-pop { left: 10px !important; right: 10px; top: auto !important; bottom: 10px; width: auto; transform: none; }
  .at-pop-a { display: flex; align-items: stretch; }
  .at-pop-img { flex: 0 0 38%; aspect-ratio: auto; min-height: 104px; }
  .at-pop-b { padding: 10px 14px 12px; }
  .at-pop-go { margin-top: 4px; }
  .at-lb-f { padding: 60px 8px; }
  .at-lb-b { display: none; }
  .at-ct-n { flex-direction: column; align-items: stretch; width: 100%; max-width: 360px; }
  .at-ct-n .at-btn { flex-wrap: wrap; row-gap: 0; white-space: normal; padding: 8px 22px; }
}
/* Puntero tactil: sin el desplazamiento por cursor de las tarjetas. */
@media (hover: none) {
  .at-card-track { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .at-card-img { scroll-snap-align: start; }
  .at-card-dots { opacity: 1; }
}

/* Movimiento reducido: todo quieto y en su estado final. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .at-js .at-reveal:not(.is-in) { clip-path: none; }
  .at-js .at-reveal:not(.is-in) img { transform: none; }
  .at-js .at-sky:not(.is-drawn) .at-draw { stroke-dashoffset: 0; }
  .at-hero-img { transform: none; }
  .at-scroll { display: none; }
}

/* Articulo del blog dentro de la plantilla (el motor anade su propia hoja de contenido con los tokens de abajo). */
body.at-articulo { --navy: var(--at-ink); --gold: var(--at-turq); --gold2: var(--at-teal); --bg2: var(--at-bg2); --bg3: var(--at-card); --border: var(--at-line); --text2: var(--at-tx2); --text3: var(--at-tx2); --cta-on-gold: #06202E; }
body.at-articulo main.art { padding-top: calc(var(--at-nav-h) + 60px); }
body.at-articulo main.art h1 { font-family: var(--at-ff); font-weight: 300; letter-spacing: -.015em; }
body.at-articulo main.art h2.section { font-family: var(--at-ff); font-weight: 400; border-bottom-color: var(--at-mint); }

/* Entrada de marca (motion-init.js, introMarca). Estado de partida oculto SOLO con html.at-intro-on, que pone el
   script del head; si el script principal no llega, at-intro-fin lo deshace a los 2,6 s. */
.at-intro .at-l, .at-intro .at-sym { transform-box: fill-box; transform-origin: 50% 50%; }
html.at-intro-on .at-intro .at-l, html.at-intro-on .at-intro .at-sym { opacity: 0; animation: at-intro-fin 0s linear 2.6s forwards; }
@keyframes at-intro-fin { to { opacity: 1; } }