/* Web personal de Paula Oliver, estilo «Canva girl»: blanco y pasteles de sus colores (azul empolvado y salvia),
   Playfair en cursiva, manuscrita Allura para los antetítulos, arcos, esquinas redondas, pegatinas y destellos ✦.
   Sin negro: el texto es azul pizarra. Tema claro deliberado. */
:root{
  --blanco:#ffffff;
  --mar:#5f86a8;--mar-osc:#3d5a73;--cielo:#e5eef6;
  --olivo:#7b9474;--salvia:#e6eddf;
  --sepia:#b8916a;--arena:#faf5ef;
  --tinta:#34444f;--gris:#6c7a83;--linea:#e8ebe8;
  --display:"Playfair Display",Georgia,serif;
  --firma:"Allura","Snell Roundhand",cursive;
  --texto:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--blanco);color:var(--tinta);font:17px/1.65 var(--texto);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--mar)}
:focus-visible{outline:2px solid var(--olivo);outline-offset:3px;border-radius:4px}
.wrap{max-width:1160px;margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.06;margin:0;text-wrap:balance;color:var(--mar-osc)}
h2{font-size:clamp(32px,4.4vw,52px);letter-spacing:-.01em}
h2 em,h1 em{font-style:italic;color:var(--mar)}
h3{font-size:clamp(21px,2vw,26px)}
p{margin:0}
.eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--olivo)}
.lead{font-size:clamp(18px,1.6vw,21px);color:var(--gris);max-width:56ch}
.prosa{display:grid;gap:18px;max-width:64ch}
.prosa p{color:var(--tinta)}
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:0;padding:16px 26px;font:600 13.5px var(--texto);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:transform .2s,background .2s,color .2s}
.btn:hover{transform:translateY(-2px)}
.btn-mar{background:var(--mar);color:var(--blanco)}
.btn-mar:hover{background:var(--mar-osc)}
.btn-linea{border-color:var(--mar);color:var(--mar);background:transparent}
.btn-linea:hover{background:var(--cielo)}
.acciones{display:flex;flex-wrap:wrap;gap:12px}
.pend{display:inline-block;font:600 12.5px/1.4 var(--texto);letter-spacing:.02em;color:var(--sepia);background:var(--arena);border:1px dashed var(--sepia);border-radius:6px;padding:3px 9px;vertical-align:middle}
.borrador{background:var(--arena);color:var(--sepia);font-size:13.5px;text-align:center;padding:8px 16px}
.borrador .pend{padding:0 6px}

/* Cabecera */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--blanco);border-bottom:1px solid transparent;transition:border-color .2s}
header.scrolled{border-color:var(--linea)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:78px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--mar-osc)}
.mono{display:inline-flex;align-items:center;justify-content:center;flex:none;width:46px;height:46px;border:1px solid var(--mar);border-radius:50%;font:400 21px/1 var(--display);color:var(--mar);letter-spacing:-.04em}
.mono i{color:var(--sepia);font-style:italic;margin-left:-1px}
.marca-txt{font:400 23px/1 var(--display)}
.menu{display:flex;align-items:center;gap:clamp(16px,2.2vw,32px)}
.menu a:not(.btn){text-decoration:none;color:var(--tinta);font-weight:500;font-size:15.5px;padding-block:6px;border-bottom:1.5px solid transparent}
.menu a:not(.btn):hover,.menu a.activo{border-color:var(--olivo);color:var(--mar-osc)}
.menu .btn{padding:12px 18px;font-size:12.5px}
.idiomas{font-size:13px;color:var(--gris);letter-spacing:.06em}
.idiomas s{opacity:.55}
.burger{display:none;background:none;border:0;padding:10px;cursor:pointer}
.burger span{display:block;width:26px;height:1.5px;background:var(--mar-osc);margin:6px 0}

/* Hero de portada */
.hero{padding-block:clamp(40px,7vw,96px) clamp(56px,8vw,110px)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,6vw,90px);align-items:end}
.hero h1{font-size:clamp(64px,11vw,150px);line-height:.9;letter-spacing:-.03em;font-weight:400;margin-top:20px}
.hero h1 em{display:block;font-weight:300}
.hero .linea{font:400 clamp(22px,2.4vw,30px)/1.3 var(--display);color:var(--tinta);margin-top:30px;max-width:24ch}
.hero .linea b{font-weight:500;color:var(--mar)}
.hero .lead{margin-top:18px}
.hero .acciones{margin-top:34px}
.retrato{position:relative;aspect-ratio:4/5;max-width:100%;background:linear-gradient(180deg,var(--cielo),var(--salvia));display:grid;place-items:center;text-align:center;border:14px solid var(--blanco);outline:1px solid var(--linea);box-shadow:0 30px 50px -30px rgba(31,47,56,.45);transform:rotate(1.6deg)}
.retrato .mono{width:120px;height:120px;font-size:54px;background:var(--blanco)}
.retrato .pend{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);white-space:nowrap}
.retrato::after{content:"Palma · Mallorca";position:absolute;top:-34px;left:-38px;width:104px;height:104px;border:1.5px solid var(--sepia);border-radius:50%;display:grid;place-items:center;font:italic 500 14px/1.1 var(--display);color:var(--sepia);background:var(--blanco);transform:rotate(-14deg);padding:14px;box-shadow:0 0 0 5px var(--blanco),0 0 0 6px var(--sepia)}
.retrato.con-foto{background:#fff;overflow:visible}
.retrato.con-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.retrato-pie{margin-top:12px;font-size:13.5px;color:var(--gris)}

/* Bloque de cabecera de páginas interiores */
.cab{padding-block:clamp(44px,7vw,96px) clamp(36px,5vw,64px);border-bottom:1px solid var(--linea)}
.cab h1{font-size:clamp(46px,7vw,92px);line-height:.98;letter-spacing:-.025em;font-weight:400;margin-top:16px;max-width:16ch}
.cab .lead{margin-top:24px}

/* Secciones */
.sec{padding-block:clamp(64px,9vw,120px)}
.sec-cab{display:grid;gap:14px;margin-bottom:clamp(32px,5vw,56px);max-width:62ch}
.sec-cielo{background:var(--cielo)}
.sec-arena{background:var(--arena)}
.sec-arena .eyebrow{color:var(--sepia)}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,88px);align-items:center}
.dos>*{min-width:0}

/* Próximos eventos */
.agenda{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.cita{display:grid;grid-template-columns:auto 1fr;gap:22px;padding:28px 0;align-items:start}
.cita+.cita{border-left:1px solid var(--linea);padding-left:clamp(20px,3vw,40px)}
.fecha{font-family:var(--display);text-align:center;color:var(--mar);min-width:68px}
.fecha b{display:block;font-size:52px;font-weight:300;line-height:.9}
.fecha span{font:700 12px var(--texto);letter-spacing:.14em;text-transform:uppercase;color:var(--olivo)}
.cita h3{font-size:23px}
.cita p{color:var(--gris);font-size:15.5px;margin-top:6px}
.cita a{font-size:15px;font-weight:600}

/* Tres palabras */
.palabras{border-block:1px solid var(--linea);padding-block:clamp(22px,3vw,34px)}
.palabras p{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:6px clamp(14px,3vw,36px);font:300 italic clamp(26px,3.6vw,46px)/1.1 var(--display);color:var(--mar-osc);text-align:center}
.palabras i{font-style:normal;color:var(--sepia)}
.firma{font:400 clamp(44px,5vw,60px)/1 var(--firma);color:var(--mar);margin-top:6px}
.cita-sola{grid-template-columns:auto 1fr;border-block:1px solid var(--linea);padding-block:32px}
.cita-sola .eyebrow{margin-bottom:8px}
.nota-dcc{margin-top:22px;color:var(--gris);font-size:15.5px}

/* Facetas de portada */
.facetas{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,36px)}
.faceta{display:grid;align-content:start;gap:12px;padding-top:22px;border-top:2px solid var(--mar)}
.faceta:nth-child(2){border-color:var(--olivo)}
.faceta:nth-child(3){border-color:var(--sepia)}
.faceta:nth-child(4){border-color:var(--mar-osc)}
.faceta .num{font:italic 300 15px var(--display);color:var(--gris)}
.faceta p{color:var(--gris);font-size:15.5px}
.faceta a{font-size:15px;font-weight:600;text-decoration:none}

/* Cita grande */
.frase{padding-block:clamp(72px,10vw,140px);text-align:center}
.frase blockquote{margin:0 auto;max-width:20ch;font:300 clamp(38px,5.6vw,72px)/1.08 var(--display);color:var(--mar-osc);letter-spacing:-.02em}
.frase blockquote em{color:var(--olivo)}
.frase cite{display:block;margin-top:26px;font:600 13px var(--texto);letter-spacing:.16em;text-transform:uppercase;color:var(--gris);font-style:normal}
.recordar{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 26px;margin-top:40px;color:var(--gris);font-size:15.5px}
.recordar b{font:500 20px var(--display);color:var(--mar)}

/* Eventos hechos */
.hechos{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,32px)}
.hecho{display:grid;align-content:start;gap:12px}
.hecho img{aspect-ratio:4/5;object-fit:cover;width:100%;border-radius:4px}
.hecho .meta{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--olivo)}
.hecho h3{font-size:22px}
.hecho p{color:var(--gris);font-size:15.5px}

/* Asociación */
.dcc{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(20px,4vw,56px);align-items:center;padding:clamp(28px,4vw,48px);border:1px solid var(--linea);border-radius:6px}
.dcc img{width:150px}
.dcc p{color:var(--gris);margin-top:8px;max-width:58ch}

/* Público */
.publico{display:flex;flex-wrap:wrap;gap:10px}
.publico span{border:1px solid var(--linea);border-radius:0;padding:9px 16px;font-size:15px;background:var(--blanco)}

/* Sobre mí */
.trayecto{display:grid;gap:0;border-top:1px solid var(--linea)}
.hito{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:20px 0;border-bottom:1px solid var(--linea)}
.hito .ano{font:300 30px/1 var(--display);color:var(--mar);font-variant-numeric:tabular-nums}
.hito p{color:var(--gris);font-size:15.5px}
.hito h3{font-size:21px;margin-bottom:4px}
.libro{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,80px);align-items:center}
.libro>*{min-width:0}
.libro figure{margin:0}
.libro img{border-radius:3px;box-shadow:0 22px 40px -22px rgba(27,44,61,.45);transform:rotate(-1.5deg)}
.libro figcaption{font-size:13px;color:var(--gris);margin-top:16px}
.ficha{display:grid;grid-template-columns:auto 1fr;gap:6px 22px;margin-top:26px;font-size:15.5px}
.ficha dt{color:var(--sepia);font-weight:600}
.ficha dd{margin:0}
.archivo{display:grid;gap:18px;max-width:64ch}
.archivo h2{color:var(--tinta)}
.sello{display:inline-block;font:italic 400 18px var(--display);color:var(--sepia);border:1px solid var(--sepia);border-radius:50%;padding:22px 16px;transform:rotate(-8deg);text-align:center;line-height:1.1}

/* Servicios */
.servicios{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--linea)}
.servicio{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:30px 0;border-bottom:1px solid var(--linea)}
.servicio:nth-child(odd){padding-right:clamp(16px,3vw,40px)}
.servicio:nth-child(even){padding-left:clamp(16px,3vw,40px);border-left:1px solid var(--linea)}
.servicio .ico{width:46px;height:46px;border-radius:50%;background:var(--salvia);display:grid;place-items:center;color:var(--olivo)}
.servicio .ico svg{width:22px;height:22px}
.servicio p{color:var(--gris);font-size:15.5px;margin-top:6px}
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,28px);counter-reset:p}
.paso{display:grid;gap:10px;align-content:start}
.paso::before{counter-increment:p;content:counter(p);font:300 46px/1 var(--display);color:var(--olivo)}
.paso p{color:var(--gris);font-size:15.5px}
.repre{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px)}
.repre>*{min-width:0}
.lista{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.lista li{padding-left:26px;position:relative}
.lista li::before{content:"";position:absolute;left:0;top:.7em;width:12px;height:1.5px;background:var(--olivo)}

/* Contacto */
.contacto{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,6vw,88px);align-items:start}
.contacto>*{min-width:0}
.dato{padding:20px 0;border-bottom:1px solid var(--linea);display:grid;gap:4px}
.dato span{font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--olivo)}
.dato b{font:400 26px var(--display);color:var(--mar-osc);user-select:all}
form{display:grid;gap:16px}
.campos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:grid;gap:6px;font-size:14px;font-weight:600;color:var(--tinta)}
input,select,textarea{font:16px var(--texto);color:var(--tinta);background:var(--blanco);border:1px solid var(--linea);border-bottom:1.5px solid var(--gris);border-radius:4px;padding:12px 14px;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--mar);box-shadow:0 0 0 3px var(--cielo)}
textarea{min-height:140px;resize:vertical}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:14px;color:var(--gris)}
.check input{width:auto;margin-top:4px}
.ok{display:none;background:var(--salvia);color:var(--olivo);border-radius:6px;padding:14px 18px;font-weight:600}
.ok.visible{display:block}

/* Pie */
footer{background:var(--arena);color:var(--tinta);border-top:1px solid var(--linea);padding-block:clamp(56px,7vw,88px) 28px;margin-top:0}
.pie{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(24px,4vw,48px)}
.pie h3{font:700 12px var(--texto);letter-spacing:.16em;text-transform:uppercase;color:var(--sepia);margin-bottom:14px}
.pie a,.pie p{display:block;color:var(--tinta);text-decoration:none;font-size:15px;margin-bottom:6px}
.pie a:hover{color:var(--mar)}
.mono-claro{border-color:var(--mar);color:var(--mar)}
.mono-claro i{color:var(--sepia)}
.pie-frase{font:300 26px/1.15 var(--display)!important;margin-top:20px}
.pie-frase em{color:var(--mar)}
.pie-dcc{background:var(--blanco);border-radius:6px;padding:12px;display:inline-block!important;width:160px}
.pie-legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:48px;padding-top:20px;border-top:1px solid var(--linea);font-size:13.5px}

/* Capa «Canva girl»: antetítulos manuscritos, arcos, pastillas y pegatinas */
body{font-size:16px;font-weight:400}
.eyebrow{font:400 clamp(30px,3vw,38px)/1 var(--firma);letter-spacing:0;text-transform:none;color:var(--olivo)}
.hero .eyebrow,.cita-sola .eyebrow{font:600 12px/1.4 var(--texto);letter-spacing:.2em;text-transform:uppercase;color:var(--mar)}
.btn{border-radius:999px;letter-spacing:.12em}
.btn-mar{background:var(--mar-osc)}
.btn-linea{border-color:var(--mar-osc);color:var(--mar-osc)}
.hero{background:radial-gradient(520px 420px at 92% 18%,var(--cielo) 0 60%,transparent 61%),radial-gradient(380px 300px at 70% 98%,var(--salvia) 0 60%,transparent 61%)}
.hero h1{font-weight:400;letter-spacing:-.02em}
.hero h1 em{color:var(--olivo)}
.retrato{border-radius:999px 999px 28px 28px;border:10px solid var(--blanco);outline:0;box-shadow:0 24px 50px -28px rgba(61,90,115,.45);transform:none}
.retrato::after{content:"hola, soy Paula ✦";top:auto;bottom:34px;left:-30px;width:auto;height:auto;border:0;border-radius:999px;padding:10px 20px;font:400 30px/1 var(--firma);color:var(--mar-osc);background:var(--blanco);transform:rotate(-6deg);box-shadow:0 10px 24px -12px rgba(61,90,115,.5)}
.retrato .pend{bottom:auto;top:24px}
.retrato::before{content:"✦";position:absolute;top:16%;right:-26px;font-size:30px;color:var(--sepia)}
.palabras{background:var(--salvia);border:0}
.palabras i{color:var(--sepia)}
.palabras i::before{content:"✦";font-size:.5em;vertical-align:middle}
.palabras i{font-size:0}
.palabras i::before{font-size:18px}
.faceta{background:var(--arena);border-top:0!important;border-radius:120px 120px 22px 22px;padding:48px 24px 28px;text-align:center;justify-items:center}
.faceta:nth-child(2){background:var(--cielo)}
.faceta:nth-child(3){background:var(--salvia)}
.faceta:nth-child(4){background:var(--arena)}
.faceta .num{font:400 30px/1 var(--firma);color:var(--sepia)}
.hecho img{border-radius:999px 999px 18px 18px;border:8px solid var(--blanco);box-shadow:0 18px 36px -24px rgba(61,90,115,.5)}
.hecho .meta{color:var(--sepia)}
.publico span{border-radius:999px;background:var(--blanco);border-color:var(--blanco);box-shadow:0 6px 16px -10px rgba(61,90,115,.4)}
.cita-sola{background:var(--cielo);border:0;border-radius:28px;padding:32px clamp(22px,4vw,44px)}
.frase blockquote{font-style:italic}
.recordar b{color:var(--olivo)}
.sec-arena{background:var(--arena)}
.sec-arena .eyebrow{color:var(--sepia)}
.libro img{border-radius:12px}
.sello{border-radius:999px;background:var(--blanco);font:400 34px/1 var(--firma);padding:28px 26px;box-shadow:0 12px 30px -16px rgba(61,90,115,.5)}
.servicio .ico{background:var(--cielo);color:var(--mar-osc)}
.paso::before{font:400 52px/1 var(--firma);color:var(--sepia)}
input,select,textarea{border-radius:14px;border:1px solid var(--linea);background:var(--arena)}
.dato b{font-style:italic}
.cab{background:radial-gradient(420px 260px at 90% 30%,var(--cielo) 0 60%,transparent 61%);border-bottom:0}
footer{background:var(--salvia);border-top:0;border-radius:40px 40px 0 0}
.pie h3{color:var(--olivo)}
.mono{border-color:var(--mar-osc);color:var(--mar-osc);font-style:italic}
.mono i{color:var(--olivo)}
.borrador{border-radius:0}

/* Aparición suave: el estado de reposo es visible */
.js .rev{opacity:.001;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.js .rev.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rev{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}.btn{transition:none}}

@media (max-width:980px){
  .facetas{grid-template-columns:repeat(2,1fr)}
  .pie{grid-template-columns:1fr 1fr}
  .pasos{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .retrato::after{left:-8px}
  .burger{display:block}
  .menu{display:none;position:absolute;left:0;right:0;top:100%;background:var(--blanco);flex-direction:column;align-items:flex-start;padding:16px clamp(16px,4vw,40px) 26px;gap:12px;border-bottom:1px solid var(--linea)}
  .menu.abierto{display:flex}
  .hero-grid,.dos,.libro,.repre,.contacto{grid-template-columns:1fr}
  .retrato{position:relative;aspect-ratio:4/5;max-width:100%;background:linear-gradient(180deg,var(--cielo),var(--salvia));display:grid;place-items:center;text-align:center;border:14px solid var(--blanco);outline:1px solid var(--linea);box-shadow:0 30px 50px -30px rgba(31,47,56,.45);transform:rotate(1.6deg)}
  .agenda,.servicios{grid-template-columns:1fr}
  .cita+.cita,.servicio:nth-child(even){border-left:0;padding-left:0;border-top:1px solid var(--linea)}
  .servicio:nth-child(odd){padding-right:0}
  .hechos{grid-template-columns:1fr 1fr}
  .dcc{grid-template-columns:1fr}
}
@media (max-width:560px){
  .facetas,.hechos,.pasos,.campos,.pie{grid-template-columns:1fr}
  .hito{grid-template-columns:1fr;gap:6px}
  .marca-txt{font-size:20px}
}