/* =========================================================== Politicas de inscripcion y ensenanza (politicas-academia.html) ----------------------------------------------------------- Pagina legal de la Academia de Leidy. Los tokens (--apx-*, --font-*, --ease) vienen de styles/main.css; aqui solo lo propio. El aura de Leidy: fondos blancos, tinta #2C1810, negro cafe #17110E, rosa esmalte #B97A6E / #8C5549, titulos #A0645A, rosado sobre oscuro #D6B39A y crema #F3EAE0. Botones en negro cafe. Sin rayitas decorativas: solo cajas con borde fino y puntos. Contrastes (minimo legible 4,5:1; letra grande 3:1): - Texto #5A4A41 sobre blanco: 8,6. Version #7A6A61: 5,6. - Etiquetas y numeros del indice #8C5549 sobre blanco: 5,9. - Numeros de los apartados #A0645A: solo letra grande (4,4). - Sobre negro cafe: crema #F3EAE0 15,7; #CBBCAE 10; #D6B39A 9,6. Modo incrustado (?embed=1, para abrirla dentro del aula): la clase .pol-embed la pone scripts/politicas.js en antes de pintar. =========================================================== */ .pol-pagina { background: #fff; } /* hidden manda siempre, aunque la pieza tenga su propio display. */ .pol-pagina [hidden] { display: none !important; } /* Como en las demas legales: sin aviso de cookies ni franja del curso encima del texto (main.js solo las salta en aviso-legal, privacidad y cookies). */ .pol-pagina .cookie-banner, .pol-pagina .aprende-tira-seccion { display: none !important; } /* Saltar al contenido: solo aparece con el teclado. */ .pol-saltar { position: absolute; left: 16px; top: -120px; z-index: 100; padding: 0.7rem 1.1rem; border-radius: 999px; background: var(--apx-espresso); color: var(--apx-crema); font-size: 0.85rem; font-weight: 600; } .pol-saltar:focus { top: 12px; } /* Al saltar a un apartado el foco va a el (scripts/politicas.js): sin marco. */ #contenido:focus, .pol [tabindex="-1"]:focus { outline: none; } /* Los saltos a los apartados los hace scripts/politicas.js, suaves salvo con movimiento reducido. Lo demas, al momento: al entrar con #devoluciones en la direccion, el salto suave de main.css se calculaba antes de que llegaran las fuentes y los datos del titular y se quedaba cientos de px corto. */ html, html:focus-within { scroll-behavior: auto; } /* ---------- Columna de lectura ---------- */ .pol { width: min(44rem, 100% - 32px); margin-inline: auto; padding: clamp(6.6rem, 13vw, 8.6rem) 0 clamp(3.5rem, 8vw, 5.5rem); color: var(--apx-texto); } /* ---------- Cabecera ---------- */ .pol-kicker { margin: 0 0 1.1rem; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.3em; text-transform: uppercase; color: var(--apx-acento-oscuro); } .pol-cabecera h1 { font-size: clamp(2.2rem, 6.4vw, 3.35rem); line-height: 1.08; letter-spacing: -0.015em; color: var(--apx-tinta); } .pol-cabecera h1 em { font-weight: 400; color: var(--apx-acento-titulo); } .pol-entradilla { margin: 1.3rem 0 0; font-size: clamp(1.02rem, 2.3vw, 1.13rem); line-height: 1.7; color: var(--apx-texto); } .pol-version { display: inline-block; margin: 1.4rem 0 0; padding: 0.5rem 1.05rem; border: 1px solid var(--apx-linea); border-radius: 999px; font-size: 0.8rem; font-weight: 500; line-height: 1.45; color: var(--apx-acento-oscuro); } /* ---------- Lo esencial ---------- */ .pol-esencial { margin-top: clamp(2.2rem, 5.5vw, 3rem); padding: clamp(1.6rem, 4.6vw, 2.6rem); border-radius: 22px; background: var(--apx-espresso); color: var(--apx-crema-suave); box-shadow: 0 26px 60px -34px rgba(23, 17, 14, 0.6); } .pol-esencial__kicker { margin: 0 0 1.25rem; font-family: var(--font-sans); font-size: 0.7rem; font-weight: 600; letter-spacing: 0.32em; text-transform: uppercase; line-height: 1.4; color: var(--apx-acento-claro); } .pol-esencial__lista { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; counter-reset: esencial; } .pol-esencial__lista li { counter-increment: esencial; display: grid; grid-template-columns: 1.7rem 1fr; gap: 0 0.7rem; font-size: 1rem; line-height: 1.65; } .pol-esencial__lista li::before { content: counter(esencial); font-family: var(--font-serif); font-style: italic; font-size: 1.25rem; line-height: 1.3; color: var(--apx-acento-claro); } .pol-esencial__lista .pol-esencial__clausula { padding-bottom: 0.35rem; font-size: clamp(1.08rem, 2.7vw, 1.24rem); line-height: 1.55; color: var(--apx-crema); } .pol-esencial__lista .pol-esencial__clausula::before { font-size: 1.45rem; line-height: 1.1; } .pol-esencial__clausula strong { font-weight: 700; color: var(--apx-crema); } .pol-esencial__pie { margin: 1.5rem 0 0; font-size: 0.88rem; color: var(--apx-crema-suave); } .pol-esencial__pie a { color: var(--apx-acento-claro); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; } .pol-esencial__pie a:hover { color: var(--apx-crema); } /* ---------- Indice ---------- */ .pol-indice { margin-top: clamp(2rem, 5vw, 2.8rem); padding: clamp(1.4rem, 4vw, 2.1rem) clamp(1.2rem, 4vw, 2.2rem); border: 1px solid var(--apx-linea); border-radius: 22px; background: #fff; scroll-margin-top: 96px; } .pol-indice__titulo { margin: 0 0 0.9rem; font-size: clamp(1.3rem, 3.2vw, 1.55rem); color: var(--apx-tinta); } .pol-indice__lista { display: grid; grid-template-columns: 1fr; gap: 0 2rem; margin: 0; padding: 0; list-style: none; } @media (min-width: 720px) { .pol-indice__lista { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(7, auto); grid-auto-flow: column; } } .pol-indice__lista a { display: flex; align-items: baseline; gap: 0.75rem; padding: 0.45rem 0.25rem; border-radius: 10px; font-size: 0.95rem; font-weight: 500; line-height: 1.4; color: var(--apx-tinta); transition: color .2s var(--ease); } .pol-indice__lista a:hover { color: var(--apx-acento-oscuro); } .pol-indice__num { flex: 0 0 1.5rem; text-align: right; font-family: var(--font-serif); font-style: italic; font-size: 1.05rem; color: var(--apx-acento-oscuro); } /* ---------- Apartados ---------- */ .pol-apartado { margin-top: clamp(2.8rem, 7vw, 4rem); scroll-margin-top: 96px; } .pol-apartado h2 { display: flex; align-items: baseline; gap: 0.7rem; margin: 0 0 1.1rem; font-size: clamp(1.45rem, 3.8vw, 1.85rem); line-height: 1.2; color: var(--apx-tinta); } .pol-num { flex: 0 0 auto; font-style: italic; font-weight: 400; color: var(--apx-acento-titulo); } .pol-apartado h3 { margin: 1.7rem 0 0.5rem; font-family: var(--font-sans); font-size: 1.01rem; font-weight: 600; letter-spacing: 0; color: var(--apx-tinta); } .pol-apartado p, .pol-apartado li { font-size: 1.02rem; line-height: 1.75; color: var(--apx-texto); } .pol-apartado p { margin: 0 0 1rem; } .pol-apartado strong { font-weight: 600; color: var(--apx-tinta); } .pol-apartado ul { display: grid; gap: 0.55rem; margin: 0 0 1.15rem; padding: 0; list-style: none; } .pol-apartado ul li { position: relative; padding-left: 1.35rem; } .pol-apartado ul li::before { content: ''; position: absolute; left: 0.2rem; top: 0.74em; width: 6px; height: 6px; border-radius: 50%; background: var(--apx-acento); } .pol-apartado a:not(.pol-boton) { color: var(--apx-acento-oscuro); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; } .pol-apartado a:not(.pol-boton):hover { color: var(--apx-tinta); } .pol-nowrap { white-space: nowrap; } /* ---------- Titular (apartado 1) ---------- */ .pol-titular { margin: 1.4rem 0; padding: clamp(1.1rem, 3.5vw, 1.5rem) clamp(1.2rem, 3.5vw, 1.7rem); border: 1px solid var(--apx-linea); border-radius: 18px; } .pol-apartado .pol-titular__kicker, .pol-apartado .pol-clausula__kicker, .pol-apartado .pol-peticion__etiqueta { margin: 0 0 0.6rem; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.28em; text-transform: uppercase; line-height: 1.4; color: var(--apx-acento-oscuro); } .pol-apartado .pol-titular__marca { margin: 0; font-size: 1.04rem; color: var(--apx-tinta); } .pol-titular__datos { display: grid; gap: 0.6rem; margin: 0; } .pol-titular__marca:not([hidden]) + .pol-titular__datos { margin-top: 0.8rem; } .pol-titular__fila { display: grid; grid-template-columns: 10.5rem 1fr; gap: 0.15rem 1rem; align-items: baseline; } .pol-titular__fila dt { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--apx-acento-oscuro); } .pol-titular__fila dd { margin: 0; font-size: 1rem; line-height: 1.5; color: var(--apx-tinta); overflow-wrap: anywhere; } .pol-apartado .pol-titular__fila dd a { font-weight: 500; } @media (max-width: 540px) { .pol-titular__fila { grid-template-columns: 1fr; } } /* ---------- La regla de los 14 dias (apartado 5) ---------- */ .pol-clausula { margin: 0 0 1.6rem; padding: clamp(1.2rem, 3.6vw, 1.6rem) clamp(1.2rem, 3.6vw, 1.8rem); border: 1px solid var(--apx-acento); border-radius: 18px; background: #fff; } .pol-apartado .pol-clausula__texto { margin: 0; font-size: clamp(1.05rem, 2.5vw, 1.15rem); line-height: 1.6; color: var(--apx-tinta); } .pol-clausula__texto strong { font-weight: 700; } /* ---------- Como hacer tu peticion ---------- */ .pol-peticion { margin: 1.5rem 0 1.9rem; padding: clamp(1.2rem, 3.6vw, 1.7rem); border: 1px solid var(--apx-linea); border-radius: 18px; } .pol-apartado .pol-peticion__titulo { margin: 0 0 1.1rem; font-family: var(--font-serif); font-size: 1.22rem; font-weight: 600; line-height: 1.3; color: var(--apx-tinta); } .pol-peticion__vias { display: grid; gap: 1.4rem 2rem; } @media (min-width: 640px) { .pol-peticion__vias { grid-template-columns: 1.25fr 1fr; } } .pol-apartado .pol-peticion__via p:not(.pol-peticion__etiqueta) { margin: 0 0 1rem; font-size: 0.97rem; line-height: 1.65; } /* ---------- Boton (negro cafe, como toda la web) ---------- */ .pol-boton { display: inline-flex; align-items: center; justify-content: center; gap: 0.55rem; min-height: 48px; padding: 0.8rem 1.5rem; border-radius: 999px; background: var(--apx-espresso); color: var(--apx-crema); font-size: 0.92rem; font-weight: 600; letter-spacing: 0.01em; text-align: center; transition: background-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease); box-shadow: 0 12px 28px -16px rgba(23, 17, 14, 0.7); } .pol-boton svg { flex: 0 0 auto; } .pol-boton:hover { background: var(--apx-tinta); color: #fff; transform: translateY(-1px); } /* ---------- Cierre ---------- */ .pol-cierre { margin-top: clamp(3.2rem, 8vw, 4.6rem); padding: clamp(1.8rem, 5vw, 2.6rem) clamp(1.2rem, 4vw, 2rem); border: 1px solid var(--apx-linea); border-radius: 22px; text-align: center; } .pol-cierre__titulo { margin: 0 0 0.5rem; font-family: var(--font-serif); font-size: clamp(1.3rem, 3.4vw, 1.6rem); font-weight: 600; line-height: 1.25; color: var(--apx-tinta); } .pol-cierre__texto { margin: 0 0 1.4rem; color: var(--apx-texto); } .pol-cierre__version { margin: 1.5rem 0 0; font-size: 0.8rem; color: #7A6A61; } /* ---------- Volver al indice (flotante) ---------- */ .pol-subir { position: fixed; right: 16px; bottom: calc(16px + var(--safe-bottom)); z-index: 40; display: inline-flex; align-items: center; gap: 0.4rem; min-height: 44px; padding: 0.6rem 1.05rem; border-radius: 999px; background: var(--apx-espresso); color: var(--apx-crema); font-size: 0.82rem; font-weight: 600; box-shadow: 0 12px 30px -12px rgba(23, 17, 14, 0.55); opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s; } .pol-subir.es-visible { opacity: 1; visibility: visible; transform: none; } .pol-subir:hover { background: var(--apx-tinta); } /* ---------- Movil ---------- */ @media (max-width: 768px) { /* main.css deja 80 px abajo para la barra de Agendar, que aqui no hay. */ .pol-pagina { padding-bottom: 0; } } @media (max-width: 480px) { /* La etiqueta de arriba en dos lineas limpias, sin el punto colgando. */ .pol-kicker__sep { display: none; } .pol-kicker__dos { display: block; margin-top: 0.35rem; } .pol-version { border-radius: 14px; } .pol-esencial { border-radius: 18px; } .pol-indice, .pol-cierre { border-radius: 18px; } .pol-peticion .pol-boton, .pol-cierre .pol-boton { width: 100%; } } /* ---------- Modo incrustado (?embed=1) ---------- */ .pol-embed .nav, .pol-embed .nav__mobile, .pol-embed .footer, .pol-embed .mobile-cta, .pol-embed .wa-float, .pol-embed .pol-saltar { display: none !important; } .pol-embed .pol-pagina { padding-bottom: 0; } .pol-embed .pol { padding-top: clamp(1.6rem, 5vw, 2.6rem); padding-bottom: clamp(2rem, 6vw, 3rem); } .pol-embed .pol-apartado, .pol-embed .pol-indice { scroll-margin-top: 16px; } /* ---------- Impresion ---------- */ @media print { .nav, .nav__mobile, .footer, .pol-subir, .pol-saltar, .pol-boton { display: none !important; } .pol { width: auto; padding: 0; } .pol-esencial { background: #fff; color: var(--apx-tinta); border: 1px solid var(--apx-tinta); box-shadow: none; } .pol-esencial__kicker, .pol-esencial__lista li::before, .pol-esencial__clausula, .pol-esencial__clausula strong, .pol-esencial__pie, .pol-esencial__pie a { color: var(--apx-tinta) !important; } .pol-clausula, .pol-titular, .pol-peticion { break-inside: avoid-page; } /* Chrome deja en blanco las listas en rejilla al imprimir: en papel, bloques. */ .pol-apartado ul, .pol-titular__datos, .pol-peticion__vias { display: block; } .pol-apartado ul li { margin: 0 0 0.5rem; } .pol-titular__fila { margin: 0 0 0.45rem; } .pol-peticion__via { margin: 0 0 0.8rem; } h2, h3 { break-after: avoid; } }