/* CIBIP · Modernisme de la pell — capa global per a tot el lloc (CA i ES)
   Actua només sobre la presentació: no toca textos, URLs, títols ni metadades.
   Desactivar: ?cibip_skin=0 a qualsevol URL (prova) o desactivar el plugin (rollback). */

body.cibip-skin {
  --sk-mist: #f6f3fa; --sk-plum: #2e2440; --sk-muted: #6e6480; --sk-hair: #e3daee;
  --sk-purple: #6a1fb5; --sk-purple-h: #5a179c; --sk-lilac: #dccff1; --sk-lilac-soft: #eee7f8;
  --sk-sage: #d3e6d9; --sk-blush: #f5dcd2; --sk-contour: #b9a3de; --sk-wa: #25d366; --sk-on-wa: #10301a;
  --sk-display: "Fraunces", Georgia, serif;
  --sk-arch: 50% 50% 22px 22px / 36% 36% 22px 22px;
  color: var(--sk-plum);
}

/* ---------- Tipografia ---------- */
body.cibip-skin main h1, body.cibip-skin main h2, body.cibip-skin main h3 {
  font-family: var(--sk-display) !important;
  font-variation-settings: "SOFT" 100, "opsz" 72;
  letter-spacing: -0.015em;
  text-wrap: balance;
}
body.cibip-skin main h1 { font-weight: 380 !important; line-height: 1.08 !important; color: var(--sk-plum) !important; letter-spacing: -0.025em; }
body.cibip-skin main h2 { font-weight: 420 !important; line-height: 1.15; color: var(--sk-plum); }
body.cibip-skin main h3 { font-weight: 480 !important; color: var(--sk-plum); }
body.cibip-skin main p, body.cibip-skin main li { font-family: "Montserrat", system-ui, sans-serif; }

/* ---------- Botons i CTA ---------- */
body.cibip-skin main :is(a.btn.primary, a.btn-purple, a.cta-btn, a.cb-btn-primary, a.cibip-cta-button, a.cibip-callbox, a.c-btn--primary, a.btn-primary, a.wp-block-button__link, a[href*="docfav.com/portal"]:not(.c-service):not([class*="card"]):not(.c-endbook__other)) {
  background: var(--sk-purple) !important; color: #fff !important;
  border: 0 !important; border-radius: 999px !important;
  box-shadow: 0 10px 22px -12px rgba(106,31,181,.7) !important;
  font-weight: 600 !important; text-decoration: none !important;
  transition: background .2s, transform .2s, box-shadow .2s;
}
body.cibip-skin main :is(a.btn.primary, a.btn-purple, a.cta-btn, a.cb-btn-primary, a.cibip-cta-button, a.cibip-callbox, a.c-btn--primary, a.btn-primary, a.wp-block-button__link):hover {
  background: var(--sk-purple-h) !important; transform: translateY(-1px);
}
body.cibip-skin main :is(a.btn.primary, a.btn-purple, a.cta-btn, a.cb-btn-primary, a.cibip-cta-button, a.cibip-callbox) * { color: #fff !important; }
/* secundaris: blanc amb contorn */
body.cibip-skin main :is(a.btn.ghost, a.cb-btn-secondary, a.btn-secondary, a[href^="tel:"].btn, a[href^="tel:"].cta-btn) {
  background: #fff !important; color: var(--sk-plum) !important;
  border: 1.5px solid var(--sk-hair) !important; border-radius: 999px !important; box-shadow: none !important;
}
body.cibip-skin main :is(a.btn.ghost, a.cb-btn-secondary, a.btn-secondary):hover { border-color: var(--sk-contour) !important; background: var(--sk-lilac-soft) !important; }
/* WhatsApp: el seu verd, text fosc llegible */
body.cibip-skin main :is(a.btn-wa, a[href*="wa.me"].btn, a[href*="wa.me"].cta-btn, a[href*="wa.me"].cibip-cta-button) {
  background: var(--sk-wa) !important; color: var(--sk-on-wa) !important; border-radius: 999px !important; border: 0 !important;
}
body.cibip-skin main a:focus-visible { outline: 3px solid var(--sk-purple); outline-offset: 3px; }

/* ---------- Hero de totes les plantilles ---------- */
body.cibip-skin .sk-hero {
  position: relative !important; isolation: isolate; overflow: hidden;
  background:
    radial-gradient(55% 80% at 92% 35%, var(--sk-lilac-soft) 0%, rgba(238,231,248,0) 70%),
    radial-gradient(35% 55% at 78% 100%, rgba(245,220,210,.5) 0%, rgba(245,220,210,0) 70%),
    #fff !important;
  color: var(--sk-plum) !important;
}
body.cibip-skin .sk-hero :is(h1, h2, p, li, span:not([class*="btn"] span)):not(a *) { color: var(--sk-plum) !important; text-shadow: none !important; }
body.cibip-skin .sk-hero p { color: #4a4060 !important; }
body.cibip-skin .sk-hero > *:not(.sk-derma):not(.sk-medal-wrap) { position: relative; z-index: 1; }
/* el camp de crestes */
.sk-derma { position: absolute; top: -10%; right: -6%; width: min(62%, 720px); height: 120%; z-index: 0; pointer-events: none; display: block; }
body.cibip-skin .sk-hero:not(.sk-derma-on) .sk-derma { display: none; }
@media (max-width: 860px) { .sk-derma { width: 100%; right: -30%; opacity: .55; } }

/* logos de capçalera de pàgina → medalló 3D */
.sk-medal {
  --rx: 0deg; --ry: 0deg; --mx: 30%; --my: 22%;
  position: relative; display: inline-grid; place-items: center; border-radius: 50%; aspect-ratio: 1;
  background: radial-gradient(circle at 35% 28%, #fff 0%, #fbf9fe 45%, #efe9f8 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 -8px 20px rgba(106,31,181,.10) inset, 0 2px 3px rgba(46,36,64,.10), 0 14px 28px -8px rgba(46,36,64,.22), 0 30px 50px -24px rgba(106,31,181,.32);
  transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d;
  transition: transform .6s cubic-bezier(.2,.7,.2,1);
  padding: 7%;
}
.sk-medal.is-tilting { transition: transform .08s linear; }
.sk-medal::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%; padding: 4px; pointer-events: none;
  background: conic-gradient(from 210deg, #fff, #dccff1, #b9a3de, #fff 30%, #e3daee 45%, #6a1fb5 58%, #dccff1 70%, #fff 82%, #b9a3de);
  -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.sk-medal::after { content: ""; position: absolute; inset: 0; border-radius: 50%; pointer-events: none; background: radial-gradient(circle at var(--mx) var(--my), rgba(255,255,255,.75), rgba(255,255,255,0) 42%); mix-blend-mode: soft-light; }
.sk-medal > img { width: 100% !important; height: auto !important; max-width: none !important; border-radius: 50% !important; transform: translateZ(26px); box-shadow: none !important; margin: 0 !important; }
.sk-float { animation: sk-float 7s ease-in-out infinite; }
@keyframes sk-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* foto del hero de l'inici → finestra en arc */
body.cibip-skin .sk-hero img.sk-arch, body.cibip-skin main img.sk-arch {
  border-radius: var(--sk-arch) !important; object-fit: cover;
  box-shadow: 0 0 0 8px #fff, 0 0 0 9px var(--sk-hair), 0 30px 50px -28px rgba(46,36,64,.45) !important;
}

/* ---------- Targetes ---------- */
body.cibip-skin main :is(a.sym, a.hub, a.eco-card, a.related-card, a.sol-card, a.path-card, a.cibip-internal-link, .card, .eco-card, .related-card) {
  border-radius: 26px !important; border: 1px solid var(--sk-hair) !important;
  background: #fff !important; box-shadow: none;
  transition: background .25s, box-shadow .25s, transform .25s, border-color .25s;
}
body.cibip-skin main :is(a.sym, a.hub, a.eco-card, a.related-card, a.sol-card, a.path-card, a.cibip-internal-link):hover {
  background: var(--sk-lilac-soft) !important; border-color: var(--sk-lilac) !important;
  box-shadow: 0 22px 40px -28px rgba(106,31,181,.45); transform: translateY(-2px);
}

/* ---------- Seccions i imatges ---------- */
body.cibip-skin main section.soft, body.cibip-skin main .soft { background: var(--sk-mist) !important; }
body.cibip-skin main .wp-block-image img, body.cibip-skin main figure img { border-radius: 22px; }
body.cibip-skin main a:not([class]) { color: var(--sk-purple); text-decoration-thickness: 1px; text-underline-offset: 3px; }
body.cibip-skin main blockquote { border-left: 0; background: var(--sk-mist); border-radius: 22px; padding: 22px 26px; font-family: var(--sk-display); font-variation-settings: "SOFT" 100; }

/* ---------- Separador «cop de fuet» ---------- */
.sk-whip { display: block; width: min(560px, 80%); height: 46px; margin: 48px auto 8px; overflow: visible; }
.sk-whip path { fill: none; stroke: var(--sk-contour, #b9a3de); stroke-width: 1.2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.sk-whip circle { fill: var(--sk-purple, #6a1fb5); }

/* ---------- Peu ---------- */
body.cibip-skin .site-footer { background: var(--sk-mist) !important; color: var(--sk-plum) !important; border-top: 0 !important; }
body.cibip-skin .site-footer a { color: var(--sk-plum) !important; }
body.cibip-skin .site-footer a:hover { color: var(--sk-purple) !important; }

@media (prefers-reduced-motion: reduce) {
  .sk-float { animation: none; }
  .sk-medal, body.cibip-skin main a { transition: none !important; }
}

/* ---------- Correccions de contrast (auditoria de 215 URLs) ---------- */
/* enllaços dins de blocs foscos o morats: hereten el color clar del bloc */
body.cibip-skin main :is(.hf, footer, .cta-box, .cb-cta, .sol-hero, [class*="cta-"], .mbar) a:not([class]) { color: inherit !important; }
body.cibip-skin main .hf a:hover { color: #fff !important; }
/* WhatsApp sempre amb el seu verd i text fosc, encara que el botó tingui classe de CTA principal */
body.cibip-skin.cibip-skin main a[href*="wa.me"]:is(.btn, .cta-btn, .cb-btn, .btn-wa, .cibip-cta-button, .cb-btn-accent),
body.cibip-skin.cibip-skin main a[href*="whatsapp"]:is(.btn, .cta-btn, .cb-btn, .btn-wa, .cibip-cta-button, .cb-btn-accent) {
  background: var(--sk-wa) !important; color: var(--sk-on-wa) !important; border: 0 !important; border-radius: 999px !important; box-shadow: none !important;
}
body.cibip-skin.cibip-skin main a[href*="wa.me"]:is(.btn, .cta-btn, .cb-btn, .btn-wa, .cibip-cta-button, .cb-btn-accent) * { color: var(--sk-on-wa) !important; }
/* botó d'accent (verd clar amb text blanc) → morat de reserva */
body.cibip-skin main a.cb-btn-accent:not([href*="wa.me"]):not([href*="whatsapp"]) { background: var(--sk-purple) !important; color: #fff !important; border-radius: 999px !important; }

/* ---------- Banda de crestes per a les pàgines sense capçalera pròpia ---------- */
.sk-band { position: relative; height: 132px; margin: 8px 0 18px; border-radius: 28px; overflow: hidden; isolation: isolate;
  background: radial-gradient(60% 120% at 85% 50%, var(--sk-lilac-soft, #eee7f8) 0%, rgba(238,231,248,0) 70%), linear-gradient(90deg, #fff, var(--sk-mist, #f6f3fa)); }
.sk-band .sk-derma { top: -40%; right: -5%; width: 70%; height: 180%; }
.sk-band:not(.sk-derma-on) .sk-derma { display: none; }
@media (max-width: 860px) { .sk-band { height: 84px; border-radius: 20px; } .sk-band .sk-derma { width: 100%; right: -20%; opacity: .7; } }

/* ---------- Menú en una sola línia a escriptori ---------- */
@media (min-width: 1240px) {
  body.cibip-skin .site-header .primary-nav a { white-space: nowrap; font-size: 14.5px; }
}
