/* ═══════════════════════════════════════
   Posturología Pro — main.css
   Paleta: crema #faf8f4 + verde salvia #6b8f71
═══════════════════════════════════════ */

:root {
    --pp-green:      #6b8f71;
    --pp-green-dk:   #4a6b4f;
    --pp-green-lt:   #e8f0e9;
    --pp-bg:         #faf8f4;
    --pp-bg2:        #f0ece4;
    --pp-white:      #ffffff;
    --pp-line:       rgba(44,44,44,.1);
    --pp-text:       #2c2c2c;
    --pp-text-dim:   #555;
    --pp-text-muted: #888;
    --font-display:  'Playfair Display', Georgia, serif;
    --font-body:     'DM Sans', sans-serif;
    --radius:        2px;
    --shadow:        0 2px 16px rgba(44,44,44,.06);
}

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }

html { scroll-behavior:smooth; font-size:16px; }

body {
    font-family: var(--font-body);
    font-weight: 300;
    color: var(--pp-text);
    background: var(--pp-bg);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}

img { max-width:100%; height:auto; display:block; }
a { color:var(--pp-green); text-decoration:none; transition:color .2s; }
a:hover { color:var(--pp-green-dk); }

/* ─── Wrap ─── */
.pp-wrap { min-height:100vh; display:flex; flex-direction:column; }

/* ─── Header ─── */
.pp-header {
    position: sticky; top:0; z-index:100;
    background: var(--pp-white);
    border-bottom: 1px solid var(--pp-line);
    backdrop-filter: blur(12px);
    transition: box-shadow .3s;
}
.pp-header.scrolled { box-shadow:0 2px 20px rgba(44,44,44,.08); }

.pp-header-inner {
    display: flex; align-items:center; justify-content:space-between;
    gap: 24px; padding: 0 48px; height: 72px;
}

.pp-logo-text {
    font-family: var(--font-display); font-size:20px; font-weight:600;
    color: var(--pp-text); letter-spacing:-.01em;
}
.pp-logo img { max-height:48px; width:auto; }

.pp-nav { display:flex; align-items:center; gap:4px; }
.pp-nav-link {
    font-size:13px; font-weight:400; color:var(--pp-text-dim);
    padding: 6px 14px; transition:color .2s;
}
.pp-nav-link:hover, .pp-nav-link.active { color:var(--pp-green); }

.pp-header-actions { display:flex; align-items:center; gap:12px; }

.pp-header-tel {
    font-size:13px; font-weight:400; color:var(--pp-text-dim);
    display:none;
}
@media (min-width:1100px) { .pp-header-tel { display:block; } }

.pp-header-perfil {
    display: inline-flex; align-items:center; gap:6px;
    font-size:13px; font-weight:400; color:var(--pp-text-dim);
    padding: 7px 14px; border:1px solid var(--pp-line);
    transition:all .2s;
}
.pp-header-perfil:hover { border-color:var(--pp-green); color:var(--pp-green-dk); }
.pp-header-perfil svg { stroke:var(--pp-green); }

.pp-nav-toggle {
    display:none; flex-direction:column; gap:5px;
    background:none; border:none; cursor:pointer; padding:4px;
}
.pp-nav-toggle span { width:24px; height:1.5px; background:var(--pp-text); display:block; transition:all .3s; }

/* Menú móvil */
.pp-mobile-menu {
    display:none; position:fixed; inset:0; z-index:200;
    background:var(--pp-white); flex-direction:column;
    padding: 48px; gap:8px;
}
.pp-mobile-menu.open { display:flex; }
.pp-mobile-menu .pp-nav-link { font-family:var(--font-display); font-size:28px; font-weight:400; color:var(--pp-text); padding:8px 0; }
.pp-mobile-close {
    position:absolute; top:24px; right:24px;
    background:none; border:none; font-size:24px; cursor:pointer; color:var(--pp-text-muted);
}

/* ─── Botones ─── */
.pp-btn-primary {
    display: inline-flex; align-items:center; gap:8px;
    background: var(--pp-green); color:#fff;
    font-family:var(--font-body); font-size:13px; font-weight:500;
    letter-spacing:.04em; padding:12px 24px; border:none;
    cursor:pointer; transition:background .2s;
}
.pp-btn-primary:hover { background:var(--pp-green-dk); color:#fff; }
.pp-btn-primary:disabled { opacity:.5; cursor:not-allowed; }

.pp-btn-outline {
    display: inline-flex; align-items:center; gap:8px;
    background:transparent; color:var(--pp-green-dk);
    font-family:var(--font-body); font-size:13px; font-weight:500;
    letter-spacing:.04em; padding:11px 24px;
    border:1.5px solid var(--pp-green);
    cursor:pointer; transition:all .2s;
}
.pp-btn-outline:hover { background:var(--pp-green); color:#fff; }
.pp-btn-full { width:100%; justify-content:center; }

/* ─── Secciones ─── */
.pp-section { padding:80px 48px; }
.pp-section-header { text-align:center; margin-bottom:56px; }
.pp-section-eyebrow {
    font-size:10px; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
    color:var(--pp-green); margin-bottom:12px;
    display:flex; align-items:center; justify-content:center; gap:12px;
}
.pp-section-eyebrow::before,
.pp-section-eyebrow::after { content:''; width:32px; height:1px; background:var(--pp-green); }
.pp-section h2 {
    font-family:var(--font-display); font-size:42px; font-weight:400;
    color:var(--pp-text); line-height:1.15; margin-bottom:16px;
}
.pp-section h2 em { font-style:italic; color:var(--pp-green); }
.pp-section-cta { text-align:center; margin-top:48px; }

/* ─── Hero ─── */
.pp-hero {
    display: grid; grid-template-columns:1fr 1fr;
    min-height: calc(100vh - 72px);
    align-items: center;
}
.pp-hero-content {
    padding: 80px 48px 80px 80px;
    display: flex; flex-direction:column; gap:28px;
}
.pp-hero-eyebrow {
    font-size:10px; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
    color:var(--pp-green); display:flex; align-items:center; gap:12px;
}
.pp-hero-eyebrow::before { content:''; width:32px; height:1px; background:var(--pp-green); }
.pp-hero-content h1 {
    font-family:var(--font-display); font-size:clamp(40px,5vw,64px);
    font-weight:400; line-height:1.1; color:var(--pp-text);
}
.pp-hero-content h1 em { font-style:italic; color:var(--pp-green); }
.pp-hero-sub { font-size:17px; font-weight:300; color:var(--pp-text-dim); max-width:480px; line-height:1.8; }
.pp-hero-btns { display:flex; gap:12px; flex-wrap:wrap; }
.pp-hero-stats { display:flex; gap:40px; padding-top:16px; border-top:1px solid var(--pp-line); flex-wrap:wrap; }
.pp-hero-stat-num { font-family:var(--font-display); font-size:32px; font-weight:600; color:var(--pp-text); line-height:1; }
.pp-hero-stat-lbl { font-size:12px; font-weight:300; color:var(--pp-text-muted); margin-top:4px; }
.pp-hero-img { background:var(--pp-bg2); height:100%; }
.pp-hero-img img { width:100%; height:100%; object-fit:cover; }
.pp-hero-img-placeholder { width:100%; height:100%; min-height:500px; background:linear-gradient(135deg,var(--pp-bg2) 0%,var(--pp-green-lt) 100%); }

/* ─── Cursos Home ─── */
.pp-cursos-home { background:var(--pp-white); }
.pp-cursos-grid {
    display: grid; grid-template-columns:repeat(3,1fr); gap:2px;
}
.pp-curso-card {
    display:flex; flex-direction:column;
    background:var(--pp-bg); transition:all .25s; overflow:hidden;
    border:1px solid transparent;
    text-decoration:none; color:inherit;
}
.pp-curso-card:hover { border-color:var(--pp-green); transform:translateY(-2px); box-shadow:var(--shadow); }
.pp-curso-icono { font-size:28px; padding:28px 28px 0; }
.pp-curso-img { aspect-ratio:16/9; overflow:hidden; }
.pp-curso-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.pp-curso-card:hover .pp-curso-img img { transform:scale(1.04); }
.pp-curso-body { padding:24px 28px; flex:1; display:flex; flex-direction:column; gap:10px; }
.pp-curso-body h3 { font-family:var(--font-display); font-size:20px; font-weight:600; color:var(--pp-text); }
.pp-curso-body p  { font-size:13px; font-weight:300; color:var(--pp-text-dim); line-height:1.7; flex:1; }
.pp-curso-meta    { display:flex; gap:16px; flex-wrap:wrap; }
.pp-curso-meta span { font-size:11px; font-weight:500; color:var(--pp-text-muted); }
.pp-curso-footer  { display:flex; justify-content:space-between; align-items:center; margin-top:4px; }
.pp-curso-disponibilidad { font-size:11px; font-weight:500; padding:3px 10px; }
.pp-curso-disponibilidad.disponible { background:var(--pp-green-lt); color:var(--pp-green-dk); }
.pp-curso-disponibilidad.lleno      { background:#fce4ec; color:#c62828; }
.pp-curso-leer { font-size:12px; font-weight:500; color:var(--pp-green); }

/* ─── Valores ─── */
.pp-valores { background:var(--pp-bg2); }
.pp-valores-content { max-width:1200px; margin:0 auto; }
.pp-valores-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-top:48px; }
.pp-valor-item { }
.pp-valor-icono { font-size:22px; color:var(--pp-green); margin-bottom:14px; }
.pp-valor-item h3 { font-family:var(--font-display); font-size:18px; font-weight:600; color:var(--pp-text); margin-bottom:10px; }
.pp-valor-item p  { font-size:13px; font-weight:300; color:var(--pp-text-dim); line-height:1.8; }

/* ─── CTA ─── */
.pp-cta-section { background:var(--pp-green); text-align:center; }
.pp-cta-content { max-width:600px; margin:0 auto; }
.pp-cta-section .pp-section-eyebrow { color:rgba(255,255,255,.7); }
.pp-cta-section .pp-section-eyebrow::before,
.pp-cta-section .pp-section-eyebrow::after { background:rgba(255,255,255,.3); }
.pp-cta-section h2 { color:#fff; font-size:38px; }
.pp-cta-section h2 em { color:rgba(255,255,255,.8); }
.pp-cta-section p  { color:rgba(255,255,255,.8); font-size:15px; }
.pp-cta-section .pp-btn-primary { background:#fff; color:var(--pp-green-dk); }
.pp-cta-section .pp-btn-primary:hover { background:var(--pp-green-lt); }
.pp-cta-section .pp-btn-outline { border-color:rgba(255,255,255,.5); color:#fff; }
.pp-cta-section .pp-btn-outline:hover { background:rgba(255,255,255,.15); color:#fff; }

/* ─── Page hero ─── */
.pp-page-hero {
    background:var(--pp-bg2);
    padding: 64px 48px;
    border-bottom:1px solid var(--pp-line);
}
.pp-page-hero-content { max-width:600px; }
.pp-page-hero h1 {
    font-family:var(--font-display); font-size:48px; font-weight:400;
    color:var(--pp-text); line-height:1.1; margin:12px 0 16px;
}
.pp-page-hero h1 em { font-style:italic; color:var(--pp-green); }
.pp-page-hero p { font-size:15px; font-weight:300; color:var(--pp-text-dim); }

/* ─── Perfil hero ─── */
.pp-perfil-hero {
    background:var(--pp-bg2); padding:48px;
    border-bottom:1px solid var(--pp-line);
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; flex-wrap:wrap;
}
.pp-perfil-hero h1 { font-family:var(--font-display); font-size:40px; font-weight:400; color:var(--pp-text); line-height:1.1; margin:8px 0 6px; }
.pp-perfil-hero h1 em { font-style:italic; color:var(--pp-green); }
.pp-perfil-hero p { font-size:13px; font-weight:300; color:var(--pp-text-muted); }
.pp-perfil-hero-actions { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }

/* ─── Tabs perfil ─── */
.pp-perfil-tabs {
    display:flex; background:var(--pp-white);
    border-bottom:1px solid var(--pp-line); padding:0 48px;
    overflow-x:auto; scrollbar-width:none;
}
.pp-perfil-tab {
    padding:16px 28px; background:none; border:none; font-size:13px; font-weight:500;
    color:var(--pp-text-muted); cursor:pointer; white-space:nowrap;
    border-bottom:2px solid transparent; transition:all .2s;
}
.pp-perfil-tab.active { color:var(--pp-green); border-bottom-color:var(--pp-green); }
.pp-perfil-tab:hover  { color:var(--pp-text); }

/* ─── Perfil body ─── */
.pp-perfil-body { padding:48px; min-height:300px; }
.pp-insc-empty { padding:48px; text-align:center; color:var(--pp-text-muted); }
.pp-citas-loading { display:flex; align-items:center; gap:12px; padding:48px; color:var(--pp-text-muted); font-size:14px; }

/* Spinner */
.pp-spinner {
    width:20px; height:20px; border-radius:50%;
    border:2px solid var(--pp-line);
    border-top-color:var(--pp-green);
    animation:pp-spin .8s linear infinite;
}
.pp-spinner-wrap { text-align:center; padding:24px; }
@keyframes pp-spin { to { transform:rotate(360deg); } }

/* ─── Tarjeta de inscripción ─── */
.pp-insc-card {
    background:var(--pp-white); border:1px solid var(--pp-line);
    padding:28px 32px; margin-bottom:12px;
    display:grid; grid-template-columns:1fr auto;
    gap:20px; align-items:start;
    transition:border-color .2s;
}
.pp-insc-card:hover { border-color:var(--pp-green); }
.pp-insc-curso { font-family:var(--font-display); font-size:22px; font-weight:600; color:var(--pp-text); margin-bottom:4px; }
.pp-insc-grupo { font-size:14px; font-weight:500; color:var(--pp-green-dk); margin-bottom:10px; }
.pp-insc-meta  { display:flex; gap:20px; flex-wrap:wrap; margin-bottom:12px; }
.pp-insc-meta-item { font-size:12px; font-weight:300; color:var(--pp-text-muted); display:flex; flex-direction:column; gap:2px; }
.pp-insc-meta-item strong { color:var(--pp-text); font-weight:500; font-size:13px; }
.pp-insc-dias  { display:flex; gap:4px; flex-wrap:wrap; margin-bottom:12px; }
.pp-insc-dia-chip { padding:3px 10px; background:var(--pp-green-lt); color:var(--pp-green-dk); font-size:11px; font-weight:500; }
.pp-insc-acciones { display:flex; flex-direction:column; gap:8px; }
.pp-insc-estado { display:inline-block; padding:3px 12px; font-size:11px; font-weight:500; letter-spacing:.06em; margin-bottom:8px; }
.pp-insc-estado.activa   { background:var(--pp-green-lt); color:var(--pp-green-dk); }
.pp-insc-estado.cancelada{ background:#fce4ec; color:#c62828; }

.pp-btn-cambiar-sesion {
    padding:8px 16px; background:none; border:1px solid var(--pp-line);
    font-size:12px; font-weight:500; color:var(--pp-green-dk);
    cursor:pointer; transition:all .2s;
}
.pp-btn-cambiar-sesion:hover { border-color:var(--pp-green); background:var(--pp-green-lt); }
.pp-btn-cancelar-insc {
    padding:8px 16px; background:none; border:1px solid rgba(198,40,40,.2);
    font-size:12px; font-weight:500; color:#c62828; cursor:pointer; transition:all .2s;
}
.pp-btn-cancelar-insc:hover { background:rgba(198,40,40,.06); }

/* ─── Auth ─── */
.pp-auth-wrap {
    display:grid; grid-template-columns:1fr 1fr;
    min-height:calc(100vh - 72px);
}
.pp-auth-brand {
    background:var(--pp-green-dk); padding:80px 64px;
    display:flex; flex-direction:column; justify-content:center;
}
.pp-auth-brand .pp-section-eyebrow { justify-content:flex-start; color:rgba(255,255,255,.6); }
.pp-auth-brand .pp-section-eyebrow::before { background:rgba(255,255,255,.3); }
.pp-auth-brand .pp-section-eyebrow::after  { display:none; }
.pp-auth-brand h2 { font-family:var(--font-display); font-size:44px; font-weight:400; color:#fff; line-height:1.15; margin:16px 0 20px; }
.pp-auth-brand h2 em { font-style:italic; color:rgba(255,255,255,.7); }
.pp-auth-brand > p  { font-size:14px; font-weight:300; color:rgba(255,255,255,.6); line-height:1.8; margin-bottom:28px; }
.pp-auth-features { list-style:none; display:flex; flex-direction:column; gap:10px; }
.pp-auth-features li { font-size:13px; color:rgba(255,255,255,.6); display:flex; align-items:center; gap:10px; }
.pp-auth-features li::before { content:''; width:16px; height:1px; background:rgba(255,255,255,.4); flex-shrink:0; }

.pp-auth-form-wrap { display:flex; align-items:center; justify-content:center; padding:48px; background:var(--pp-bg); }
.pp-auth-card { background:var(--pp-white); padding:48px; width:100%; max-width:440px; border:1px solid var(--pp-line); }
.pp-auth-card h3 { font-family:var(--font-display); font-size:28px; font-weight:400; color:var(--pp-text); margin-bottom:6px; }
.pp-auth-sub { font-size:13px; font-weight:300; color:var(--pp-text-muted); margin-bottom:28px; line-height:1.6; }
.pp-auth-footer { margin-top:24px; padding-top:20px; border-top:1px solid var(--pp-line); font-size:13px; color:var(--pp-text-muted); }

/* ─── Formularios ─── */
.pp-field { display:flex; flex-direction:column; gap:8px; margin-bottom:20px; }
.pp-field label { font-size:10px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--pp-text-muted); }
.pp-field label span { color:var(--pp-green); }
.pp-field input, .pp-field select, .pp-field textarea {
    border:none; border-bottom:1px solid var(--pp-line);
    padding:10px 0; font-family:var(--font-body); font-size:15px;
    font-weight:300; color:var(--pp-text); outline:none; background:transparent;
    transition:border-color .3s; width:100%;
}
.pp-field input:focus { border-bottom-color:var(--pp-green); }
.pp-field input::placeholder { color:rgba(44,44,44,.2); }
.pp-pw-wrap { position:relative; }
.pp-pw-toggle { position:absolute; right:0; top:50%; transform:translateY(-50%); background:none; border:none; font-size:11px; font-weight:500; color:var(--pp-green); cursor:pointer; }
.pp-form-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; }

/* Feedback */
.pp-form-feedback { font-size:13px; font-weight:300; min-height:16px; }
.pp-form-feedback.success { color:#2e7d32; }
.pp-form-feedback.error   { color:#c62828; }

/* ─── Modal ─── */
.pp-modal { position:fixed; inset:0; z-index:999; display:flex; align-items:center; justify-content:center; padding:24px; }
.pp-modal-overlay { position:absolute; inset:0; background:rgba(44,44,44,.5); backdrop-filter:blur(4px); }
.pp-modal-box { position:relative; z-index:2; background:var(--pp-white); padding:40px; width:100%; max-width:600px; max-height:90vh; overflow-y:auto; }
.pp-modal-close { position:absolute; top:16px; right:20px; background:none; border:none; font-size:18px; cursor:pointer; color:var(--pp-text-muted); }
.pp-modal-titulo { font-family:var(--font-display); font-size:24px; font-weight:600; margin-bottom:8px; }
.pp-modal-sub { font-size:13px; color:var(--pp-text-muted); margin-bottom:24px; }

/* ─── Footer ─── */
.pp-footer { background:var(--pp-text); color:rgba(255,255,255,.6); margin-top:auto; }
.pp-footer-top { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; padding:64px 48px; }
.pp-footer-logo-text { font-family:var(--font-display); font-size:20px; font-weight:600; color:#fff; margin-bottom:12px; }
.pp-footer-tagline { font-size:13px; color:rgba(255,255,255,.5); margin-bottom:8px; }
.pp-footer-since   { font-size:12px; color:rgba(255,255,255,.3); margin-bottom:20px; }
.pp-footer-social  { display:flex; gap:16px; }
.pp-social-link    { font-size:12px; font-weight:500; color:rgba(255,255,255,.5); transition:color .2s; }
.pp-social-link:hover { color:#fff; }
.pp-footer-col h4  { font-size:11px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:#fff; margin-bottom:20px; }
.pp-footer-col a, .pp-footer-col p { display:block; font-size:13px; color:rgba(255,255,255,.5); margin-bottom:8px; transition:color .2s; }
.pp-footer-col a:hover { color:#fff; }
.pp-footer-bottom { display:flex; justify-content:space-between; align-items:center; padding:20px 48px; border-top:1px solid rgba(255,255,255,.08); font-size:12px; }
.pp-footer-badge a { color:rgba(255,255,255,.3); transition:color .2s; }
.pp-footer-badge a:hover { color:#fff; }
.pp-logout-link { cursor:pointer; }

/* ─── Anim ─── */
.will-anim { opacity:0; transform:translateY(20px); transition:opacity .5s,transform .5s; }
.will-anim.in-view { opacity:1; transform:none; }

/* ─── Responsive ─── */
@media (max-width:1024px) {
    .pp-cursos-grid { grid-template-columns:repeat(2,1fr); }
    .pp-valores-grid { grid-template-columns:repeat(2,2fr); }
    .pp-footer-top { grid-template-columns:1fr 1fr; gap:32px; }
}
@media (max-width:768px) {
    .pp-header-inner { padding:0 24px; }
    .pp-nav { display:none; }
    .pp-header-tel { display:none; }
    .pp-nav-toggle { display:flex; }
    .pp-hero { grid-template-columns:1fr; }
    .pp-hero-content { padding:48px 24px; }
    .pp-hero-img { display:none; }
    .pp-section { padding:56px 24px; }
    .pp-cursos-grid { grid-template-columns:1fr; }
    .pp-valores-grid { grid-template-columns:1fr; gap:24px; }
    .pp-auth-wrap { grid-template-columns:1fr; }
    .pp-auth-brand { display:none; }
    .pp-auth-form-wrap { padding:24px; }
    .pp-auth-card { padding:32px 24px; }
    .pp-footer-top { grid-template-columns:1fr; gap:32px; padding:40px 24px; }
    .pp-footer-bottom { flex-direction:column; gap:8px; padding:16px 24px; }
    .pp-perfil-hero { padding:32px 24px; flex-direction:column; align-items:flex-start; }
    .pp-perfil-tabs { padding:0 24px; }
    .pp-perfil-body { padding:24px; }
    .pp-insc-card { grid-template-columns:1fr; }
    .pp-form-row { grid-template-columns:1fr; gap:0; }
    .pp-page-hero { padding:48px 24px; }
    .pp-page-hero h1 { font-size:36px; }
}