/*
Theme Name: Aulanar
Theme URI: https://www.matefis.com
Author: Visualtec
Description: Tema a medida para Aulanar (formació i coach personal, Andorra). Textos, logo y foto editables desde Apariencia → Personalizar.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: aulanar
*/
/* Layout: cuaderno de matemáticas — fondo cuadriculado, un acento tinta, secciones anchas con texto a ~65ch */
:root{
  --bg:#f7f8f4; --paper:#ffffff; --fg:#1d2430; --muted:#5b6474;
  --grid:rgba(29,36,48,.07); --line:#d9dcd3;
  --ink:#2a63b8; --ink-soft:#e4edf9; --chalk:#f2c14e;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:10px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#12161d; --paper:#1a2029; --fg:#eef1f5; --muted:#a4adbc;
  --grid:rgba(238,241,245,.06); --line:#2b3340;
  --ink:#7ea0ff; --ink-soft:#1f2b4a; --chalk:#f2c14e; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#12161d; --paper:#1a2029; --fg:#eef1f5; --muted:#a4adbc;
  --grid:rgba(238,241,245,.06); --line:#2b3340;
  --ink:#7ea0ff; --ink-soft:#1f2b4a; --chalk:#f2c14e; color-scheme:dark}

*{box-sizing:border-box}
body{margin:0;background:var(--bg) ;color:var(--fg);font-family:var(--body);font-size:17px;line-height:1.6;
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:28px 28px}
a{color:var(--ink)}
h1,h2,h3{font-family:var(--display);line-height:1.1;text-wrap:balance;margin:0}
h1{font-size:clamp(2.2rem,6vw,4.2rem);font-weight:600}
h2{font-size:clamp(1.7rem,3.5vw,2.5rem);font-weight:600}
h3{font-size:1.2rem;font-weight:600}
p{margin:0}
.wrap{max-width:1120px;margin-inline:auto;padding-inline:20px}
.eyebrow{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--ink)}
.lede{color:var(--muted);max-width:62ch}
section{padding-block:72px}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.3rem;border-radius:999px;font-weight:600;text-decoration:none;border:2px solid var(--ink);transition:transform .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--ink);color:#fff}
.btn-ghost{color:var(--ink);background:transparent}
:focus-visible{outline:3px solid var(--chalk);outline-offset:2px}

/* header */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px}
.logo{display:flex;align-items:center;text-decoration:none}
.logo img{height:64px;width:auto;display:block;border-radius:6px}
.nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav ul a{color:var(--fg);text-decoration:none;font-weight:500;font-size:.95rem}
.nav ul a:hover{color:var(--ink)}
@media (max-width:760px){.nav ul{display:none}}

/* hero */
.hero{padding-block:80px 64px}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}}
.hero h1 em{font-style:italic;color:var(--ink)}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-facts{display:flex;gap:28px;flex-wrap:wrap;margin-top:36px;color:var(--muted);font-size:.95rem}
.hero-facts b{display:block;color:var(--fg);font-family:var(--display);font-size:1.5rem}
.board{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:0 20px 50px -30px rgba(0,0,0,.35);min-width:0}
.board .eyebrow{color:var(--muted)}
.board .formula{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.2rem);margin-top:10px;line-height:1.3}
.board ul{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.board li{display:flex;gap:10px;align-items:baseline}
.board li::before{content:"+";color:var(--ink);font-weight:700;font-family:var(--display)}

/* services */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:36px}
@media (max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.cards{grid-template-columns:1fr}}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:10px;min-width:0}
.card .sym{font-family:var(--display);font-size:1.9rem;color:var(--ink);line-height:1}
.card p{color:var(--muted);font-size:.97rem}
.card .tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:8px}
.tag{font-size:.75rem;padding:.2rem .6rem;border-radius:999px;background:var(--ink-soft);color:var(--ink);font-weight:600}

/* modalidades */
.modes{background:var(--paper);border-block:1px solid var(--line)}
.modes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px}
@media (max-width:760px){.modes-grid{grid-template-columns:1fr}}
.mode{border-top:3px solid var(--ink);padding-top:16px;min-width:0}
.mode p{color:var(--muted);margin-top:6px}

/* técnicas de estudio */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:32px}
@media (max-width:760px){.quotes{grid-template-columns:1fr}}
.quote{font-family:var(--display);font-style:italic;font-size:1.25rem;padding:18px 20px;border-left:3px solid var(--chalk);background:var(--paper);border-radius:0 var(--r) var(--r) 0;min-width:0}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.step{min-width:0}
.step b{display:block;font-family:var(--display);color:var(--ink);font-size:1.6rem;font-variant-numeric:tabular-nums}
.step p{color:var(--muted);font-size:.95rem;margin-top:4px}

/* condiciones */
.terms{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media (max-width:760px){.terms{grid-template-columns:1fr}}
.checks{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px}
.checks li{display:flex;gap:12px;align-items:flex-start}
.checks li::before{content:"✓";flex:0 0 26px;height:26px;display:grid;place-items:center;border-radius:50%;background:var(--ink);color:#fff;font-size:.85rem;font-weight:700}

/* about */
.about{background:var(--paper);border-block:1px solid var(--line)}
.about-grid{display:grid;grid-template-columns:1fr;gap:36px;align-items:center}
.about-grid .portrait{grid-row:1}
@media (max-width:760px){.about-grid{grid-template-columns:1fr}}
.portrait{width:100%;max-width:100%;height:auto;border-radius:var(--r);border:1px solid var(--line);display:block;box-shadow:0 20px 50px -30px rgba(0,0,0,.35)}
.about p{margin-top:14px;color:var(--muted)}
.about .sig{margin-top:22px;font-family:var(--display);font-style:italic;font-size:1.15rem;color:var(--fg)}

/* contacto */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:32px}
@media (max-width:760px){.contact-grid{grid-template-columns:1fr}}
.info{display:grid;gap:18px}
.info dl{margin:0;display:grid;gap:14px}
.info dt{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.info dd{margin:0;font-size:1.15rem;font-weight:600}
.info dd a{color:var(--fg);text-decoration:none}
.info dd a:hover{color:var(--ink)}
.copy{font:inherit;font-size:.8rem;margin-left:8px;padding:.15rem .6rem;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--fg);cursor:pointer}
.note{font-size:.85rem;color:var(--muted)}

footer{border-top:1px solid var(--line);padding-block:28px;color:var(--muted);font-size:.9rem}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}