/*
Theme Name: Método PHI
Theme URI: https://www.metodophi.es/
Author: @byEliDaCamara
Author URI: https://instagram.com/byelidacamara
Description: Tema a medida para Método PHI — Medicina Tradicional China y Acupuntura (María Piedad Hernández Bilbao). Incluye plantillas para Inicio, Medicina Tradicional China, Método PHI, Formación, María Piedad, Blog, Contacto y páginas legales. Al activarlo crea las páginas y la portada automáticamente.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: Propietaria
Text Domain: metodo-phi
*/

/* ==========================================================================
   MÉTODO PHI — sistema de diseño compartido
   ========================================================================== */

:root{
  --olive: #8F865A;
  --olive-deep: #766C53;
  --olive-ink: #414A2E;      /* verde militar — sustituye el marrón oscuro */
  --ink: #414A2E;
  --ink-soft: #5C6647;
  --khaki: #D6CD99;
  --khaki-pale: #EDE8CF;
  --white: #FFFFFF;
  --tan: #867752;
  --coral: #BF675C;
  --coral-soft: #D69790;
  --paper: #FAF8F1;
  --line: #DDD4B8;

  --display: 'Montserrat', sans-serif;
  --body: 'Montserrat', sans-serif;
  --script: 'Caveat', cursive;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

::selection{ background:var(--olive); color:var(--white); }
a{ color:inherit; }
img{ max-width:100%; display:block; }
h1,h2,h3,h4{ font-family:var(--display); }
ul{ list-style:none; }

.wrap{ max-width:1100px; margin:0 auto; padding:0 32px; }
.wrap--narrow{ max-width:820px; }

.eyebrow{
  font-family:var(--body); font-weight:700; font-size:12px;
  letter-spacing:0.16em; text-transform:uppercase; color:var(--olive);
}

.script-accent{ font-family:var(--script); font-weight:600; font-style:normal; }

.reveal{
  opacity:0; transform:translateY(28px);
  transition:opacity 0.9s cubic-bezier(.22,.61,.36,1), transform 0.9s cubic-bezier(.22,.61,.36,1);
}
.reveal.is-visible{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } html{ scroll-behavior:auto; } }

/* ---------- NAV ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 32px; background:rgba(250,248,241,0.92); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav-brand{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-brand img{ width:32px; height:32px; }
.nav-brand span{ font-weight:700; font-size:14.5px; letter-spacing:0.04em; color:var(--ink); }
.nav-links{ display:flex; align-items:center; gap:28px; }
.nav-links a{
  font-size:12.5px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase;
  text-decoration:none; color:var(--ink-soft); transition:color 0.25s ease;
}
.nav-links a:hover, .nav-links a[aria-current="page"]{ color:var(--olive); }
.nav-cta{
  font-family:var(--body); font-weight:700; font-size:12px; letter-spacing:0.05em;
  text-transform:uppercase; color:var(--white); text-decoration:none;
  background:var(--ink); padding:11px 20px; border-radius:2px; transition:background 0.3s ease;
}
.nav-cta:hover{ background:var(--coral); }
.nav-toggle{ display:none; }
@media (max-width:860px){
  .nav-links{ display:none; }
  .nav-toggle{ display:block; }
}

/* ---------- PAGE HERO (interior pages) ---------- */
.page-hero{
  padding:150px 32px 80px; text-align:center;
  background:
    radial-gradient(ellipse 60% 50% at 88% 6%, rgba(191,103,92,0.07), transparent 60%),
    radial-gradient(ellipse 70% 60% at 6% 96%, rgba(143,134,90,0.13), transparent 65%),
    var(--paper);
}
.page-hero .eyebrow{ justify-content:center; }
.page-hero h1{
  font-weight:800; font-size:clamp(34px, 5.6vw, 58px); line-height:1.05;
  letter-spacing:-0.01em; color:var(--ink); margin-top:16px; max-width:820px; margin-left:auto; margin-right:auto;
}
.page-hero .lead{
  font-size:clamp(16px, 1.8vw, 19px); color:var(--ink-soft); max-width:600px;
  margin:22px auto 0; font-weight:400;
}
.page-hero .cta-row{ margin-top:34px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

.btn{
  display:inline-flex; align-items:center; gap:10px; padding:15px 28px;
  text-decoration:none; font-weight:600; font-size:13px; letter-spacing:0.05em;
  text-transform:uppercase; border-radius:2px; transition:background 0.3s ease, transform 0.3s ease;
}
.btn--solid{ background:var(--ink); color:var(--white); }
.btn--solid:hover{ background:var(--coral); transform:translateX(4px); }
.btn--outline{ border:1.5px solid var(--olive); color:var(--olive-ink); }
.btn--outline:hover{ background:var(--khaki-pale); }

/* ---------- SECTIONS ---------- */
section{ padding:110px 32px; }
.section--white{ background:var(--white); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section--khaki{ background:var(--khaki-pale); }
.section--dark{ background:var(--olive-deep); color:var(--white); text-align:center; }
.section--dark .eyebrow{ color:var(--coral-soft); }
.section--dark p{ color:#EDE6D2; }

h2.section-title{
  font-weight:700; font-size:clamp(28px, 4.2vw, 42px); color:var(--ink); line-height:1.15;
}
.section-lead{ font-size:16px; color:var(--ink-soft); max-width:620px; margin-top:16px; }

/* ---------- PHOTO FRAME (placeholder for real photography) ---------- */
.photo-frame{
  position:relative; border-radius:2px; overflow:hidden;
  background:
    linear-gradient(135deg, rgba(143,134,90,0.18), rgba(191,103,92,0.12)),
    repeating-linear-gradient(45deg, rgba(65,74,46,0.05) 0 2px, transparent 2px 14px);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; text-align:center;
  min-height:260px;
}
.photo-frame .cap{
  font-size:12.5px; color:var(--ink-soft); font-style:italic; max-width:220px; padding:20px;
  line-height:1.5;
}
.photo-frame .cap::before{ content:'◎ '; color:var(--olive); font-style:normal; }

.photo-frame{ aspect-ratio:4/5; min-height:0 !important; }
.photo-frame img{
  width:100%; height:100%; object-fit:cover; object-position:center 15%;
  filter:saturate(0.92) contrast(1.02);
}
.photo-frame svg{ width:100%; height:100%; display:block; }
.photo-frame--contain{ aspect-ratio:4/5 !important; }
.photo-frame--contain img{ object-fit:contain; }
.tool--tier1 .photo-frame{ aspect-ratio:4/5; }
@media (max-width:760px){ .photo-frame{ aspect-ratio:16/10; } }

/* ---------- RESPONSIVE FIX: any 30/70 photo+text split stacks on mobile, photo first ---------- */
@media (max-width:760px){
  .wrap[style*="grid-template-columns:30% 1fr"],
  .wrap[style*="grid-template-columns:1fr 30%"]{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }
  .wrap[style*="grid-template-columns:1fr 30%"] .photo-frame{ order:-1; }
}

/* ---------- TWO-PATH CARDS (home) ---------- */
.paths{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
.path-card{ background:var(--white); padding:52px 44px; }
.path-card .eyebrow{ margin-bottom:16px; }
.path-card h3{ font-size:26px; font-weight:700; color:var(--ink); }
.path-card p{ font-size:15px; color:var(--ink-soft); margin-top:14px; max-width:400px; }
.path-card .btn{ margin-top:28px; }
@media (max-width:800px){ .paths{ grid-template-columns:1fr; } }

/* ---------- TIERED TOOLS (Nivel 1 hierarchy) ---------- */
.tools-tiered{ margin-top:56px; display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line); }

.tool--tier1{
  background:var(--ink); color:var(--white); padding:56px 48px;
  display:grid; grid-template-columns:30% 1fr; gap:40px; align-items:center;
}
.tool--tier1 .photo-frame{ min-height:220px; background:linear-gradient(135deg, rgba(214,205,153,0.25), rgba(191,103,92,0.18)); border-color:rgba(255,255,255,0.2); }
.tool--tier1 .photo-frame .cap{ color:#EDE6D2; }
.tool--tier1 .tag{ font-size:11.5px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--coral-soft); }
.tool--tier1 h3{ font-size:clamp(26px,3.4vw,36px); font-weight:800; margin-top:10px; }
.tool--tier1 p{ font-size:15.5px; color:#E6E1CE; margin-top:14px; max-width:520px; }
@media (max-width:760px){ .tool--tier1{ grid-template-columns:1fr; } }

.tools-tier2{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); }
.tool--tier2{ background:var(--khaki-pale); padding:36px 32px; }
.tool--tier2 h4{ font-size:19px; font-weight:700; color:var(--ink); }
.tool--tier2 p{ font-size:14px; color:var(--ink-soft); margin-top:10px; }
@media (max-width:640px){ .tools-tier2{ grid-template-columns:1fr; } }

.tools-tier3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); }
.tool--tier3{ background:var(--paper); padding:26px 24px; }
.tool--tier3 h5{ font-size:15px; font-weight:700; color:var(--ink); }
.tool--tier3 p{ font-size:13px; color:var(--ink-soft); margin-top:6px; }
@media (max-width:700px){ .tools-tier3{ grid-template-columns:1fr; } }

/* ---------- CONCEPT ACCORDION (Qi, Yin-Yang, etc.) ---------- */
.concept{ border-bottom:1px solid var(--line); }
.concept summary{
  cursor:pointer; padding:22px 4px; font-size:17px; font-weight:700; color:var(--ink);
  display:flex; justify-content:space-between; align-items:center; list-style:none; gap:16px;
}
.concept summary > span{ display:flex; align-items:center; gap:16px; flex:1; }
.concept-icon{ width:40px; height:40px; flex-shrink:0; }
@media (max-width:520px){ .concept-icon{ width:32px; height:32px; } }

/* ---------- CARD ICONS (reusable small symbolic icons for grid cards) ---------- */
.card-icon{ width:34px; height:34px; display:block; margin-bottom:14px; }
.card-icon--sm{ width:26px; height:26px; margin-bottom:10px; }
.icon-inline{ width:18px; height:18px; flex-shrink:0; display:inline-block; }

/* ---------- OBJECTS STRIP (illustrated close-ups) ---------- */
.objects-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.objects-strip img{ width:100%; aspect-ratio:4/5; object-fit:cover; display:block; }
@media (max-width:760px){ .objects-strip{ grid-template-columns:repeat(2,1fr); } }
.concept summary::-webkit-details-marker{ display:none; }
.concept summary::after{ content:'+'; font-size:22px; color:var(--olive); font-weight:400; transition:transform 0.3s ease; }
.concept[open] summary::after{ transform:rotate(45deg); }
.concept .concept-body{ padding:0 4px 28px; font-size:15px; color:var(--ink-soft); max-width:700px; }

/* ---------- FAQ (native details/summary, accessible) ---------- */
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{
  cursor:pointer; padding:24px 4px; font-size:16px; font-weight:600; color:var(--ink);
  display:flex; justify-content:space-between; align-items:center; gap:16px; list-style:none;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:'+'; font-size:20px; color:var(--olive); flex-shrink:0; transition:transform 0.3s ease; }
.faq-item[open] summary::after{ transform:rotate(45deg); }
.faq-item .faq-body{ padding:0 4px 24px; font-size:14.5px; color:var(--ink-soft); max-width:680px; }

/* ---------- ENTITY / FOOTER ---------- */
.entity-line{
  font-size:12px; color:var(--ink-soft); text-align:center; letter-spacing:0.02em;
  padding:28px 32px; border-top:1px solid var(--line); background:var(--white);
}
.entity-line a{ color:var(--olive-ink); text-decoration:underline; text-underline-offset:3px; }

footer{ background:var(--ink); color:rgba(250,248,241,0.55); text-align:center; padding:30px 32px; font-size:11px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; }
footer .script-accent{ color:rgba(250,248,241,0.75); font-size:13px; text-transform:none; letter-spacing:0; }
.footer-legal{ margin-bottom:14px; text-transform:none; letter-spacing:0.02em; font-size:12px; }
.footer-legal a{ color:rgba(250,248,241,0.75); text-decoration:underline; text-underline-offset:3px; }
.footer-legal a:hover{ color:var(--khaki); }
.footer-main{ margin-bottom:10px; }
.footer-credit{ margin-top:14px; text-transform:none; letter-spacing:0.02em; font-size:10.5px; color:rgba(250,248,241,0.35); }
.footer-credit a{ color:rgba(250,248,241,0.5); text-decoration:underline; text-underline-offset:2px; }

/* ---------- CONTACT FORM ---------- */
.contact-form{ max-width:520px; margin:48px auto 0; display:flex; flex-direction:column; gap:18px; text-align:left; }
.contact-form label{ font-size:12px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--khaki); display:block; margin-bottom:8px; }
.contact-form input, .contact-form select, .contact-form textarea{
  width:100%; padding:13px 14px; border:1px solid rgba(255,255,255,0.3); background:rgba(255,255,255,0.06);
  color:var(--white); font-family:var(--body); font-size:14.5px; border-radius:2px;
}
.contact-form input::placeholder, .contact-form textarea::placeholder{ color:rgba(255,255,255,0.4); }
.contact-form button{
  margin-top:6px; padding:15px 28px; background:var(--coral); color:var(--white); border:none;
  font-weight:700; font-size:13px; letter-spacing:0.05em; text-transform:uppercase; cursor:pointer;
  border-radius:2px; transition:background 0.3s ease;
}
.contact-form button:hover{ background:#A85A50; }

.locations{ display:flex; flex-wrap:wrap; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:56px; max-width:760px; margin-left:auto; margin-right:auto; }
.location{ flex:1; background:var(--olive-deep); padding:26px; }
.location h4{ font-size:15px; font-weight:700; color:var(--khaki); }
.location p{ font-size:13px; color:#E6E1CE; margin-top:6px; }

.placeholder-note{ margin-top:48px; font-size:11px; font-weight:600; letter-spacing:0.06em; color:rgba(255,255,255,0.45); text-transform:uppercase; }

/* ---------- CONSENT BLOCK (RGPD) ---------- */
.consent-block{
  margin-top:6px; padding-top:22px; border-top:1px solid rgba(255,255,255,0.15);
  display:flex; flex-direction:column; gap:12px;
}
.consent-title{ font-size:12px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--khaki); }
.consent-check{ display:flex; align-items:flex-start; gap:10px; font-size:13px; color:#EDE6D2; line-height:1.4; cursor:pointer; }
.consent-check input[type="checkbox"]{
  width:16px; height:16px; flex-shrink:0; margin-top:2px; accent-color:var(--coral); cursor:pointer;
}
.consent-check a{ color:var(--khaki); text-decoration:underline; text-underline-offset:2px; }
.consent-legal{
  font-size:10.5px; line-height:1.6; color:rgba(255,255,255,0.45); margin-top:4px; max-height:110px;
  overflow-y:auto; padding:12px; background:rgba(255,255,255,0.04); border-radius:2px;
}
.consent-legal a{ color:rgba(255,255,255,0.6); }

/* ---------- WHATSAPP FLOAT ---------- */
.whatsapp-float{
  position:fixed; bottom:24px; right:24px; z-index:60;
  width:56px; height:56px; border-radius:50%; background:var(--ink);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(65,74,46,0.35); transition:transform 0.25s ease, box-shadow 0.25s ease, background 0.3s ease;
  text-decoration:none;
}
.whatsapp-float:hover{ background:var(--coral); transform:scale(1.08); box-shadow:0 8px 22px rgba(191,103,92,0.4); }
.whatsapp-float svg{ width:26px; height:26px; }
.whatsapp-inline{
  display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:13px;
  color:var(--olive-ink); text-decoration:none; border-bottom:1px solid var(--olive); padding-bottom:2px;
}
.whatsapp-inline svg{ width:16px; height:16px; flex-shrink:0; }
@media (max-width:640px){ .whatsapp-float{ width:50px; height:50px; bottom:18px; right:18px; } .whatsapp-float svg{ width:22px; height:22px; } }

/* ---------- BLOG ---------- */
.blog-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:48px; }
.blog-card{ background:var(--white); padding:36px 32px; }
.blog-card .eyebrow{ margin-bottom:10px; }
.blog-card h3{ font-size:19px; font-weight:700; color:var(--ink-soft); }
.blog-card p{ font-size:14px; color:var(--ink-soft); margin-top:10px; opacity:0.75; }
.blog-empty{ text-align:center; padding:60px 32px; border:1px dashed var(--line); margin-top:48px; }
.blog-empty p{ font-size:15px; color:var(--ink-soft); max-width:420px; margin:0 auto; }
@media (max-width:700px){ .blog-grid{ grid-template-columns:1fr; } }

/* ---------- LEGAL PAGES ---------- */
.legal-body h2{ font-size:20px; font-weight:700; color:var(--ink); margin-top:36px; margin-bottom:12px; }
.legal-body h2:first-child{ margin-top:0; }
.legal-body p{ font-size:14.5px; color:var(--ink-soft); margin-top:10px; line-height:1.75; }
.legal-body a{ color:var(--olive-ink); text-decoration:underline; }
.legal-updated{ font-size:12px; color:var(--ink-soft); font-style:italic; margin-top:8px; }

/* ==========================================================================
   AÑADIDOS PARA WORDPRESS
   ========================================================================== */

/* Barra de administración de WP */
body.admin-bar .nav{ top:32px; }
@media (max-width:782px){ body.admin-bar .nav{ top:46px; } }

/* Menú de WordPress (wp_nav_menu genera <ul><li>) */
.nav-links ul{ display:flex; align-items:center; gap:28px; }
.nav-links li{ list-style:none; }
.nav-links .current-menu-item > a{ color:var(--olive); }

/* Menú móvil */
.nav-toggle{
  background:none; border:0; cursor:pointer; padding:8px; margin-left:auto; margin-right:12px;
  width:40px; height:40px; position:relative;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  position:absolute; left:9px; width:22px; height:2px; background:var(--ink); content:''; transition:transform .25s ease, opacity .25s ease;
}
.nav-toggle span{ top:19px; }
.nav-toggle span::before{ left:0; top:-7px; }
.nav-toggle span::after{ left:0; top:7px; }
.nav.is-open .nav-toggle span{ background:transparent; }
.nav.is-open .nav-toggle span::before{ transform:translateY(7px) rotate(45deg); }
.nav.is-open .nav-toggle span::after{ transform:translateY(-7px) rotate(-45deg); }
@media (max-width:860px){
  .nav.is-open .nav-links{
    display:flex; position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:flex-start;
    background:var(--paper); border-bottom:1px solid var(--line); padding:20px 32px 28px; gap:18px;
  }
  .nav.is-open .nav-links ul{ flex-direction:column; align-items:flex-start; gap:18px; }
  .nav-cta{ padding:10px 14px; font-size:11px; }
}
@media (max-width:420px){ .nav-brand span{ display:none; } }

/* Grids en línea: apilar en móvil (no existía en el original) */
@media (max-width:760px){
  .wrap[style*="repeat(3,1fr)"], .wrap[style*="grid-template-columns:1fr 1fr"],
  div[style*="grid-template-columns:1fr 1fr"]{ grid-template-columns:1fr !important; }
  .wrap[style*="grid-column:1 / -1"]{ grid-column:auto; }
}

/* Blog: tarjetas enlazadas y entrada individual */
.blog-card a{ text-decoration:none; }
.blog-card a:hover h3{ color:var(--olive); }
.blog-card .blog-thumb{ margin:-36px -32px 22px; aspect-ratio:16/9; overflow:hidden; }
.blog-card .blog-thumb img{ width:100%; height:100%; object-fit:cover; }
.blog-card .read-more{ display:inline-block; margin-top:16px; font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--olive-ink); }
.pagination{ margin-top:40px; display:flex; justify-content:center; gap:10px; }
.pagination .page-numbers{ padding:8px 14px; border:1px solid var(--line); text-decoration:none; font-size:13px; font-weight:600; }
.pagination .current{ background:var(--ink); color:var(--white); border-color:var(--ink); }

.entry-content{ font-size:16px; color:var(--ink-soft); line-height:1.8; }
.entry-content > * + *{ margin-top:1.1em; }
.entry-content h2{ font-size:26px; font-weight:700; color:var(--ink); margin-top:1.8em; }
.entry-content h3{ font-size:20px; font-weight:700; color:var(--ink); margin-top:1.5em; }
.entry-content a{ color:var(--olive-ink); text-decoration:underline; }
.entry-content ul, .entry-content ol{ padding-left:1.4em; }
.entry-content ul{ list-style:disc; }
.entry-content blockquote{ border-left:3px solid var(--coral); padding-left:18px; font-style:italic; }
.entry-content img{ height:auto; border-radius:2px; }
.entry-featured{ margin-bottom:36px; border:1px solid var(--line); }
.screen-reader-text{ position:absolute !important; clip:rect(1px,1px,1px,1px); width:1px; height:1px; overflow:hidden; }

/* Formularios: mensajes y antispam */
.phi-hp{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-msg{ max-width:520px; margin:0 auto 24px; padding:18px 22px; border-radius:2px; font-size:14.5px; line-height:1.5; text-align:left; }
.form-msg--ok{ background:#E6EBD9; color:#414A2E; border-left:4px solid #8F865A; }
.form-msg--error{ background:#F6E3E0; color:#7A3A32; border-left:4px solid var(--coral); }
.form-msg a{ color:inherit; text-decoration:underline; }
.section--dark .form-msg{ margin-top:32px; margin-bottom:-16px; }