:root{
  --blue:#2f7fa0;--blue2:#6fb6cf;--deep:#0d3445;--ink:#10262e;
  --muted:#667b83;--line:#dce9ed;--pale:#eef7f9;--white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fbfdfd;color:var(--ink);font-family:"DM Sans",sans-serif;overflow-x:hidden}
a{text-decoration:none;color:inherit}
.nav{height:78px;padding:0 6vw;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50;background:rgba(251,253,253,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(220,233,237,.9)}
.brand{display:flex;align-items:center;gap:10px;font-size:14px}
.brand-mark{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--deep);color:#fff;font-weight:700}
.brand-text b{color:var(--blue)}
nav{display:flex;gap:28px;align-items:center;font-size:14px}
nav a:not(.nav-cta){color:#3b5159}
.nav-cta{padding:11px 18px;border-radius:999px;background:var(--deep);color:#fff}
.menu-btn{display:none;border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px 14px}

.hero{min-height:760px;padding:70px 7vw 80px;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:4vw}
.hero h1,.section h2,.cta-section h2{font-family:"Manrope",sans-serif;letter-spacing:-.055em;line-height:1.02;margin:0}
.hero h1{font-size:clamp(52px,6.2vw,92px)}
.hero h1 span{color:var(--blue)}
.eyebrow{font-size:12px;letter-spacing:.17em;font-weight:700;color:var(--blue);margin:0 0 20px}
.lead{max-width:650px;font-size:19px;line-height:1.65;color:var(--muted);margin:28px 0}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;font-size:14px;font-weight:700;border:1px solid transparent}
.primary{background:var(--blue);color:#fff}
.ghost{background:#fff;border-color:var(--line)}
.white{background:#fff;color:var(--deep)}

.hero-visual{position:relative;min-height:590px;border-radius:40px;background:radial-gradient(circle at 50% 35%,#f8fcfd 0,#e9f5f8 45%,#dceef3 100%);overflow:hidden}
#motion-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.visual-glow{position:absolute;width:42%;aspect-ratio:1;border-radius:50%;background:#fff;filter:blur(40px);opacity:.55;left:15%;top:12%;pointer-events:none}
.portrait-chip{position:absolute;left:22px;bottom:22px;z-index:3;display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;border:1px solid rgba(255,255,255,.7);border-radius:18px;background:rgba(255,255,255,.72);backdrop-filter:blur(18px)}
.portrait-chip img{width:52px;height:52px;border-radius:14px;object-fit:cover;object-position:center 18%;background:#fff}
.portrait-chip strong,.portrait-chip span{display:block}
.portrait-chip strong{font-size:14px}.portrait-chip span{font-size:11px;color:var(--muted);margin-top:3px}

.section{padding:115px 8vw;border-top:1px solid var(--line)}
.section h2{font-size:clamp(42px,4.7vw,68px)}
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:10vw}
.copy{font-size:18px;line-height:1.78}.copy p{margin-top:0;margin-bottom:20px}.copy .strong{font-weight:600;color:var(--deep)}
.text-link{display:inline-block;color:var(--blue);font-weight:700;margin-top:8px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding-top:0;padding-bottom:90px;border-top:0}
.stat{padding:30px 34px;border-left:1px solid var(--line)}
.stat:last-child{border-right:1px solid var(--line)}
.stat strong{font-family:"Manrope";display:block;font-size:32px;letter-spacing:-.04em;color:var(--deep)}
.stat span{display:block;color:var(--muted);margin-top:8px;line-height:1.5;font-size:14px}

.services{background:var(--pale)}
.services-head{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:end}
.services-head .eyebrow{grid-column:1/-1;margin-bottom:-10px}
.services-head p:last-child{color:var(--muted);font-size:17px;line-height:1.6;max-width:500px}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:55px}
.cards article{background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.95);padding:34px;border-radius:24px;min-height:260px;transition:transform .35s ease,border-color .35s ease}
.cards article:hover{transform:translateY(-5px);border-color:#c8e3ea}
.cards article span{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--blue)}
.cards h3{font-family:"Manrope";font-size:26px;letter-spacing:-.035em;margin:70px 0 12px}
.cards p{color:var(--muted);line-height:1.65;margin:0;max-width:520px}

.location{display:grid;grid-template-columns:1fr .9fr;gap:9vw;align-items:center}
.location-copy>p:last-child{max-width:520px;color:var(--muted);font-size:17px;line-height:1.65}
.location-card{min-height:300px;border-radius:28px;padding:38px;background:linear-gradient(150deg,#f8fcfd,#eaf5f8);display:flex;flex-direction:column;justify-content:flex-end}
.location-dot{width:14px;height:14px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 10px rgba(47,127,160,.10);margin-bottom:auto}
.location-card span{color:var(--muted);font-size:14px}
.location-card strong{font-family:"Manrope";font-size:28px;margin:6px 0 6px}

.cta-section{position:relative;overflow:hidden;padding:120px 8vw;background:var(--deep);color:#fff;text-align:center}
.cta-inner{position:relative;z-index:2}
.cta-section h2{font-size:clamp(54px,6vw,86px)}
.cta-section p:not(.eyebrow){max-width:620px;margin:22px auto 30px;color:#cfe0e6;font-size:17px;line-height:1.6}
.light{color:#9fd1e0}
.cta-orb{position:absolute;width:440px;height:440px;border-radius:50%;right:-120px;top:-170px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.45),rgba(111,182,207,.18) 35%,rgba(255,255,255,0) 70%);filter:blur(2px)}

.experience{text-align:center}
.experience>div{max-width:760px;margin:auto}
.experience p:not(.eyebrow){color:var(--muted);font-size:17px;line-height:1.65;margin:22px auto 28px}
.experience small{display:block;color:#8a9aa0;margin-top:14px}
.disabled{opacity:.55;cursor:not-allowed}

footer{padding:40px 8vw;display:grid;grid-template-columns:1fr auto auto;gap:40px;align-items:center;border-top:1px solid var(--line);font-size:13px}
footer>div:first-child{display:flex;flex-direction:column;gap:4px}
footer span,footer small{color:var(--muted)}
.footer-links{display:flex;gap:20px}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1)}
.reveal.visible{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}
  .cards article{transition:none}
}
@media(max-width:900px){
  .hero{grid-template-columns:1fr;padding-top:48px}
  .hero-visual{min-height:500px}
  .split,.location{grid-template-columns:1fr;gap:48px}
  .services-head{grid-template-columns:1fr}
  .services-head p:last-child{margin-top:0}
  .stats{grid-template-columns:1fr}
  .stat,.stat:last-child{border-right:0;border-left:0;border-top:1px solid var(--line)}
  footer{grid-template-columns:1fr}
}
@media(max-width:680px){
  .nav{padding:0 5vw}
  .brand-text b{display:none}
  .menu-btn{display:block}
  nav{position:absolute;left:5vw;right:5vw;top:68px;padding:14px;background:#fff;border:1px solid var(--line);border-radius:18px;display:none;flex-direction:column;align-items:stretch;box-shadow:0 20px 50px rgba(13,52,69,.10)}
  nav.open{display:flex}
  nav a{padding:9px 8px}
  .hero{padding:45px 6vw 70px}
  .hero h1{font-size:48px}
  .lead{font-size:16px}
  .hero-visual{min-height:410px;border-radius:28px}
  .portrait-chip{left:14px;right:14px;bottom:14px}
  .section,.cta-section{padding:80px 6vw}
  .cards{grid-template-columns:1fr}
  .cards article{min-height:230px}
  .cards h3{margin-top:48px}
  .actions .btn{width:100%}
}

/* V3 — portrait-led premium direction */
.portrait-hero{
  isolation:isolate;
  background:linear-gradient(145deg,#f8fcfd 0%,#edf7f9 48%,#dceef3 100%);
}
.portrait-bg{
  position:absolute;inset:auto 7% 7% 7%;height:64%;
  border-radius:44% 44% 22% 22% / 28% 28% 18% 18%;
  background:linear-gradient(160deg,rgba(111,182,207,.20),rgba(47,127,160,.07));
  filter:blur(.2px);z-index:0;
}
.hero-photo{
  position:absolute;z-index:2;left:50%;bottom:0;transform:translateX(-50%);
  height:93%;width:auto;max-width:92%;object-fit:contain;object-position:center bottom;
  filter:drop-shadow(0 24px 28px rgba(13,52,69,.12));
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}
.portrait-hero:hover .hero-photo{transform:translateX(-50%) scale(1.012)}
.portrait-ring{
  position:absolute;border:1px solid rgba(47,127,160,.14);border-radius:50%;z-index:1;
  pointer-events:none;animation:floatRing 9s ease-in-out infinite alternate;
}
.ring-one{width:340px;height:340px;right:-80px;top:55px}
.ring-two{width:190px;height:190px;left:25px;top:90px;animation-delay:-3s}
.portrait-label{
  position:absolute;left:24px;bottom:24px;z-index:4;padding:13px 16px;
  background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.9);
  backdrop-filter:blur(18px);border-radius:17px;box-shadow:0 16px 40px rgba(13,52,69,.08)
}
.portrait-label strong,.portrait-label span{display:block}
.portrait-label strong{font-size:14px}
.portrait-label span{font-size:11px;color:var(--muted);margin-top:4px}
@keyframes floatRing{to{transform:translate3d(8px,-13px,0) rotate(7deg)}}

.btn,.nav-cta,.text-link{transition:transform .25s ease,box-shadow .25s ease,background .25s ease,opacity .25s ease}
.btn:hover,.nav-cta:hover{transform:translateY(-2px)}
.primary:hover,.nav-cta:hover{box-shadow:0 10px 28px rgba(47,127,160,.20)}
.text-link:hover{transform:translateX(3px)}

.whatsapp-float{
  position:fixed;right:22px;bottom:22px;z-index:60;display:flex;align-items:center;gap:9px;
  padding:13px 17px;border-radius:999px;background:#fff;color:var(--deep);font-weight:700;font-size:13px;
  border:1px solid var(--line);box-shadow:0 14px 40px rgba(13,52,69,.14);
  transition:transform .25s ease,box-shadow .25s ease
}
.whatsapp-float:hover{transform:translateY(-3px);box-shadow:0 18px 46px rgba(13,52,69,.18)}
.wa-dot{width:9px;height:9px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 5px rgba(47,127,160,.10)}

.nav{transition:height .3s ease,box-shadow .3s ease}
.nav.scrolled{height:66px;box-shadow:0 8px 28px rgba(13,52,69,.055)}

@media (prefers-reduced-motion:reduce){
  .portrait-ring{animation:none}
  .hero-photo,.whatsapp-float{transition:none}
}
@media(max-width:680px){
  .portrait-hero{min-height:440px}
  .hero-photo{height:88%;max-width:100%}
  .portrait-label{left:14px;bottom:14px}
  .whatsapp-float{right:14px;bottom:14px;padding:12px 14px}
  .whatsapp-float span:last-child{display:none}
}


/* V5 — On trobar-me */
.location-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:46px;
}
.location-card{
  min-height:280px;
  padding:34px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.location-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 50px rgba(13,52,69,.07);
}
.location-kicker,.soon-badge{
  font-size:11px;
  letter-spacing:.12em;
  font-weight:800;
  color:var(--blue);
}
.location-card h3{
  margin:18px 0 12px;
  font-size:clamp(25px,2.3vw,36px);
  line-height:1.05;
}
.location-card p,.location-card address{
  max-width:520px;
  color:var(--muted);
  line-height:1.65;
  font-style:normal;
}
.location-card address{margin-top:8px}
.location-card .text-link{margin-top:auto;padding-top:24px}
.location-card-soon{
  grid-column:1/-1;
  min-height:210px;
  background:linear-gradient(135deg,#eef8fa,#dceff4);
  border-color:transparent;
}
.soon-badge{
  display:inline-flex;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.72);
}
@media(max-width:780px){
  .location-grid{grid-template-columns:1fr}
  .location-card-soon{grid-column:auto}
  .location-card{min-height:auto;padding:26px}
}


/* V6 — On trobar-me: composició més compacta i editorial */
.location.section{
  display:block;
}
.location .section-head{
  max-width:900px;
}
.location .section-head h2{
  max-width:780px;
}
.location-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-top:42px;
  align-items:start;
}
.location-card{
  min-height:0;
  height:auto;
  padding:30px 30px 28px;
  border-radius:24px;
  display:block;
}
.location-card h3{
  margin:14px 0 10px;
}
.location-card p{
  margin:0 0 14px;
}
.location-card address{
  margin:0 0 14px;
  font-size:14px;
  line-height:1.55;
}
.location-card .text-link{
  margin-top:8px;
  padding-top:0;
}
.location-card-soon{
  grid-column:1/-1;
  min-height:0;
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:24px;
  align-items:center;
  padding:24px 28px;
}
.location-card-soon .soon-badge{
  grid-row:1/3;
  align-self:center;
}
.location-card-soon h3{
  margin:0 0 5px;
  font-size:24px;
}
.location-card-soon p{
  margin:0;
  max-width:none;
}
@media(max-width:780px){
  .location-grid{
    grid-template-columns:1fr;
    gap:12px;
    margin-top:30px;
  }
  .location-card{
    padding:24px;
  }
  .location-card-soon{
    grid-column:auto;
    grid-template-columns:1fr;
    gap:10px;
  }
  .location-card-soon .soon-badge{
    grid-row:auto;
    width:max-content;
  }
}

/* V9 — dinamisme premium i microinteraccions */
:root{
  --ease-premium:cubic-bezier(.22,1,.36,1);
}

/* Hero: entrada editorial per capes */
.hero-copy .eyebrow,
.hero-copy .lead,
.hero-copy .actions{
  opacity:0;
  transform:translateY(14px);
}
.hero-copy.visible .eyebrow{
  animation:heroFade .65s var(--ease-premium) .06s forwards;
}
.hero-copy.visible .lead{
  animation:heroFade .72s var(--ease-premium) .42s forwards;
}
.hero-copy.visible .actions{
  animation:heroFade .72s var(--ease-premium) .56s forwards;
}
.hero h1{
  overflow:visible;
}
.hero-line{
  display:block;
  opacity:0;
  transform:translateY(30px);
  clip-path:inset(0 0 100% 0);
}
.hero-copy.visible .hero-line{
  animation:heroLine .86s var(--ease-premium) .15s forwards;
}
.hero-copy.visible .hero-line-accent{
  animation-delay:.27s;
}
@keyframes heroLine{
  to{opacity:1;transform:translateY(0);clip-path:inset(0 0 0 0)}
}
@keyframes heroFade{
  to{opacity:1;transform:translateY(0)}
}

/* Foto: aparició més refinada, sense efectes cridaners */
.portrait-hero{
  --mx:0px;
  --my:0px;
}
.portrait-hero .portrait-bg,
.portrait-hero .portrait-ring,
.portrait-hero .portrait-label{
  transition:transform .85s var(--ease-premium),opacity .7s ease;
}
.portrait-hero.reveal:not(.visible) .portrait-bg{
  transform:scale(.96);
  opacity:0;
}
.portrait-hero.reveal:not(.visible) .portrait-label{
  transform:translateY(12px);
  opacity:0;
}
.portrait-hero.visible .portrait-bg{
  transform:translate3d(calc(var(--mx) * .20),calc(var(--my) * .20),0) scale(1);
}
.portrait-hero.visible .ring-one{
  transform:translate3d(calc(var(--mx) * .40),calc(var(--my) * .40),0);
}
.portrait-hero.visible .ring-two{
  transform:translate3d(calc(var(--mx) * -.28),calc(var(--my) * -.28),0);
}
.hero-photo{
  will-change:transform;
}

/* Reveals: menys genèrics, amb profunditat subtil */
.reveal{
  opacity:0;
  transform:translateY(28px);
  filter:blur(3px);
  transition:opacity .78s var(--ease-premium),transform .78s var(--ease-premium),filter .7s ease;
}
.reveal.visible{
  opacity:1;
  transform:none;
  filter:blur(0);
}

/* Stagger automàtic per grups */
.stats .stat:nth-child(2){transition-delay:.08s}
.stats .stat:nth-child(3){transition-delay:.16s}
.cards article:nth-child(2){transition-delay:.07s}
.cards article:nth-child(3){transition-delay:.14s}
.cards article:nth-child(4){transition-delay:.21s}
.location-grid .location-card:nth-child(2){transition-delay:.06s}
.location-grid .location-card:nth-child(3){transition-delay:.10s}
.location-grid .location-card:nth-child(4){transition-delay:.14s}
.location-grid .location-card:nth-child(5){transition-delay:.10s}

/* Targetes: resposta tàctil/premium */
.cards article,
.location-card{
  position:relative;
  overflow:hidden;
}
.cards article::after,
.location-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg,transparent 32%,rgba(255,255,255,.5) 49%,transparent 66%);
  transform:translateX(-130%);
  transition:transform .9s var(--ease-premium);
}
.cards article:hover::after,
.location-card:hover::after{
  transform:translateX(130%);
}
.cards article:hover{
  transform:translateY(-5px);
}
.cards article h3,
.location-card h3{
  transition:transform .35s var(--ease-premium);
}
.cards article:hover h3,
.location-card:hover h3{
  transform:translateY(-2px);
}

/* Botons: moviment precís */
.btn,.nav-cta{
  position:relative;
  overflow:hidden;
}
.btn::before,.nav-cta::before{
  content:"";
  position:absolute;
  width:38px;height:140%;
  top:-20%;left:-60px;
  background:rgba(255,255,255,.18);
  transform:skewX(-18deg);
  transition:left .65s var(--ease-premium);
}
.btn:hover::before,.nav-cta:hover::before{left:calc(100% + 28px)}
.btn:active,.nav-cta:active{transform:translateY(0) scale(.985)}

/* Navegació: estat actiu discret */
nav a:not(.nav-cta){
  position:relative;
  transition:color .25s ease;
}
nav a:not(.nav-cta)::after{
  content:"";
  position:absolute;
  left:0;right:100%;bottom:-7px;
  height:1px;
  background:var(--blue);
  transition:right .35s var(--ease-premium);
}
nav a:not(.nav-cta):hover,
nav a:not(.nav-cta).active{color:var(--deep)}
nav a:not(.nav-cta):hover::after,
nav a:not(.nav-cta).active::after{right:0}

/* Header amb canvi més elegant en scroll */
.nav{
  transition:height .35s var(--ease-premium),box-shadow .35s ease,background .35s ease,border-color .35s ease;
}
.nav.scrolled{
  background:rgba(251,253,253,.94);
  border-color:rgba(220,233,237,.72);
}

/* CTA flotant: només quan el CTA principal deixa de ser visible */
.whatsapp-float{
  opacity:0;
  visibility:hidden;
  transform:translateY(12px) scale(.97);
  pointer-events:none;
  transition:opacity .35s ease,visibility .35s ease,transform .45s var(--ease-premium),box-shadow .25s ease;
}
.whatsapp-float.is-visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.whatsapp-float.is-visible:hover{
  transform:translateY(-3px) scale(1);
}

/* Enllaços de text amb fletxa més viva */
.text-link{
  display:inline-block;
  transition:transform .3s var(--ease-premium),color .25s ease;
}
.text-link:hover{color:var(--deep);transform:translateX(4px)}

/* CTA blau: orb amb respiració gairebé imperceptible */
.cta-orb{
  animation:orbDrift 11s ease-in-out infinite alternate;
}
@keyframes orbDrift{
  to{transform:translate3d(-22px,18px,0) scale(1.04)}
}

@media (hover:none){
  .cards article:hover,.location-card:hover,.cards article:hover h3,.location-card:hover h3{transform:none}
  .cards article::after,.location-card::after,.btn::before,.nav-cta::before{display:none}
}

@media (prefers-reduced-motion:reduce){
  .hero-copy .eyebrow,.hero-copy .lead,.hero-copy .actions,.hero-line{opacity:1;transform:none;clip-path:none;animation:none!important}
  .reveal{filter:none}
  .cta-orb{animation:none}
  .portrait-hero .portrait-bg,.portrait-hero .portrait-ring,.portrait-hero .portrait-label{transform:none!important}
}


/* V10 — portada editorial refinada */
:root{
  --blue:#236b88;
  --blue2:#6faabd;
  --deep:#0d3445;
}

/* Proporcions més editorials i menys "landing template" */
.hero{
  min-height:calc(100vh - 78px);
  max-width:1600px;
  margin:0 auto;
  padding:64px 6.5vw 78px;
  grid-template-columns:minmax(0,1.16fr) minmax(420px,.84fr);
  gap:5.2vw;
}
.hero-copy{max-width:780px}
.hero h1{
  font-size:clamp(50px,4.75vw,72px);
  line-height:1.01;
  letter-spacing:-.052em;
  max-width:780px;
}
.hero h1 span{color:var(--deep)}
.hero-line-accent{color:var(--blue)!important}
.hero-copy .eyebrow{margin-bottom:27px}
.hero .lead{
  max-width:590px;
  margin:30px 0 31px;
  font-size:18px;
  line-height:1.62;
}
.hero .actions{gap:11px}
.hero .btn{
  min-height:50px;
  padding:0 22px;
  border-radius:14px;
}
.hero .primary{background:var(--deep)}
.hero .primary:hover{background:#16485c}
.hero .ghost{background:transparent;border-color:#cfdfe4}

/* La fotografia és el protagonista: una sola capa, sense etiqueta ni ornaments */
.hero-visual{
  min-height:590px;
  aspect-ratio:.91;
  align-self:center;
  border-radius:30px;
  background:#fff;
  border:1px solid rgba(13,52,69,.08);
  box-shadow:0 24px 70px rgba(13,52,69,.08);
  overflow:hidden;
}
.portrait-hero{
  isolation:isolate;
  background:#fff;
}
.hero-photo{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  max-width:none;
  transform:none;
  object-fit:cover;
  object-position:center 17%;
  filter:none;
  transition:transform .75s var(--ease-premium);
}
.portrait-hero:hover .hero-photo{transform:scale(1.008)}

/* Desactivem qualsevol rastre dels ornaments de versions anteriors */
.portrait-bg,.portrait-ring,.portrait-label{display:none!important}

/* Botons més precisos i menys "pill" */
.btn,.nav-cta{border-radius:14px}
.nav-cta{padding:11px 17px}

@media(max-width:1120px){
  .hero{
    grid-template-columns:minmax(0,1fr) minmax(380px,.82fr);
    gap:4vw;
  }
  .hero h1{font-size:clamp(50px,5.5vw,66px)}
  .hero-visual{min-height:520px}
}

@media(max-width:900px){
  .hero{
    grid-template-columns:1fr;
    max-width:none;
    min-height:auto;
    padding-top:54px;
    gap:52px;
  }
  .hero-copy{max-width:760px}
  .hero h1{font-size:clamp(50px,8vw,70px)}
  .hero-visual{
    width:min(100%,680px);
    min-height:0;
    aspect-ratio:1.02;
    justify-self:center;
  }
  .hero-photo{object-position:center 14%}
}

@media(max-width:680px){
  .hero{padding:42px 6vw 68px;gap:38px}
  .hero-copy .eyebrow{margin-bottom:20px}
  .hero h1{font-size:clamp(43px,12.3vw,56px);line-height:1.01}
  .hero .lead{font-size:16px;line-height:1.58;margin:24px 0 26px}
  .hero .actions{display:grid;grid-template-columns:1fr 1fr}
  .hero .actions .btn{width:100%;padding:0 14px}
  .hero-visual{border-radius:24px;aspect-ratio:.94}
}

@media(max-width:430px){
  .hero .actions{grid-template-columns:1fr}
}


/* V11 — refinement pass: editorial system, services, accessibility, mobile */
:root{--deep:#0b2d3b;--blue:#276f8d;--blue2:#76afc3;--ink:#10262e;--muted:#687a80;--line:#dce7ea;--pale:#f1f7f8;--white:#fff}
body{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#fcfdfd}
.skip-link{position:fixed;left:16px;top:10px;z-index:1000;background:var(--deep);color:#fff;padding:10px 14px;border-radius:10px;transform:translateY(-150%);transition:transform .2s}
.skip-link:focus{transform:none}
:focus-visible{outline:3px solid rgba(39,111,141,.35);outline-offset:4px}
.nav{height:76px}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:1px;line-height:1.1}
.brand-name{font-size:17px;font-weight:720;letter-spacing:-.02em;color:var(--deep)}
.brand-role{font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:650}
.brand-mark,.brand-text{display:none}
nav{gap:24px}
nav a:not(.nav-cta){position:relative}
nav a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:var(--deep);transition:right .25s ease}
nav a:not(.nav-cta):hover::after,nav a.active:not(.nav-cta)::after{right:0}
.nav-cta{border-radius:12px;padding:11px 16px}

.hero{min-height:calc(100vh - 76px);max-width:1600px;margin:auto;padding-top:58px;padding-bottom:70px}
.hero h1{letter-spacing:-.055em}
.hero-line{display:block}
.lead{max-width:610px}
.btn{border-radius:13px}
.hero-visual{overflow:hidden}
.hero-visual picture{position:absolute;inset:0}
.hero-photo{filter:none}
.portrait-hero:hover .hero-photo{transform:translateX(-50%)}
.portrait-ring,.portrait-bg,.portrait-label{display:none!important}

.section{max-width:1600px;margin-inline:auto}
.split{align-items:start}
.copy{max-width:690px}
.stats{padding-top:46px;padding-bottom:90px}
.stat{padding-top:30px;padding-bottom:30px}

.services{padding-top:120px}
.services-head{align-items:end;border-bottom:1px solid var(--line);padding-bottom:42px;margin-bottom:0}
.services-head>div{max-width:760px}
.services-head>p{max-width:500px;margin:0 0 8px auto}
.service-list{display:flex;flex-direction:column}
.service-row{display:grid;grid-template-columns:70px minmax(260px,.9fr) minmax(300px,1.15fr) auto;gap:30px;align-items:start;padding:38px 0;border-bottom:1px solid var(--line);transition:transform .25s ease,border-color .25s ease}
.service-row:hover{transform:translateX(4px);border-color:#bfd3da}
.service-number{font-size:12px;color:var(--blue);font-weight:750;letter-spacing:.08em;padding-top:6px}
.service-type{font-size:10px;letter-spacing:.13em;color:var(--blue);font-weight:800;margin:0 0 9px}
.service-row h3{font-size:clamp(24px,2vw,34px);line-height:1.08;letter-spacing:-.035em;margin:0;max-width:420px}
.service-row>p{color:var(--muted);line-height:1.7;margin:1px 0 0;max-width:560px}
.service-row .text-link{white-space:nowrap;margin-top:4px}

.location .section-head h2{max-width:840px}
.location-card{min-height:0!important;box-shadow:none!important}
.location-card:hover{transform:translateY(-2px);border-color:#bfd3da;box-shadow:0 12px 30px rgba(13,52,69,.045)!important}
.location-card-soon{display:grid;grid-template-columns:minmax(220px,.65fr) 1fr;align-items:center;gap:30px}
.location-card-soon h3{margin-bottom:0}
.location-card-soon p{margin:0}

.cta-section{position:relative;overflow:hidden}
.cta-orb{display:none!important}
.cta-inner{position:relative;z-index:1}
.cta-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.phone-link{color:rgba(255,255,255,.78);font-weight:650;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:3px}

.experience{display:none}

footer{max-width:1600px;margin:auto;grid-template-columns:1fr auto auto;padding-top:48px;padding-bottom:48px}
.footer-brand{display:flex;flex-direction:column;gap:5px}
.footer-brand strong{font-size:16px}
.footer-brand span{font-size:12px}
.footer-contact{display:flex;gap:22px}

.reveal{transform:translateY(18px);transition:opacity .65s ease,transform .65s cubic-bezier(.22,.7,.25,1)}
.cards article::before{display:none!important}
.whatsapp-float{opacity:0;visibility:hidden;transform:translateY(12px);pointer-events:none;border-radius:14px}
.whatsapp-float.is-visible{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.whatsapp-float.is-visible:hover{transform:translateY(-2px)}

@media(max-width:1050px){
  .service-row{grid-template-columns:54px 1fr 1fr}
  .service-row .text-link{grid-column:2}
}
@media(max-width:900px){
  nav{gap:16px}
  nav a[href="#cita"]:not(.nav-cta){display:none}
  .service-row{grid-template-columns:48px 1fr}
  .service-row>p,.service-row .text-link{grid-column:2}
  .service-row>p{margin-top:-10px}
}
@media(max-width:680px){
  .nav{height:68px}
  .brand-role{font-size:8px;letter-spacing:.09em}
  .menu-btn{border-radius:11px}
  nav a[href="#cita"]:not(.nav-cta){display:block}
  .hero{min-height:auto;padding-top:42px;gap:42px}
  .hero h1{font-size:clamp(44px,13vw,58px);line-height:.98}
  .hero-line-accent{margin-top:7px}
  .lead{max-width:34ch;line-height:1.6}
  .hero-visual{min-height:420px;border-radius:24px}
  .hero-photo{height:94%;max-width:110%}
  .actions{gap:10px}
  .actions .btn{width:auto;flex:1;min-width:150px;text-align:center}
  .stats{padding-top:20px}
  .services{padding-top:88px}
  .services-head{padding-bottom:30px}
  .service-row{grid-template-columns:34px 1fr;gap:16px 14px;padding:30px 0}
  .service-row h3{font-size:27px}
  .service-row>p{grid-column:1/-1;margin:0}
  .service-row .text-link{grid-column:1/-1}
  .location-card-soon{grid-template-columns:1fr;gap:10px}
  .cta-actions{align-items:flex-start;flex-direction:column}
  footer{grid-template-columns:1fr;gap:22px}
  .footer-contact{flex-direction:column;gap:10px}
  .whatsapp-float{right:14px;bottom:14px}
}
@media (prefers-reduced-motion:reduce){
  .service-row,.skip-link{transition:none}
}


/* V12 — Serveis: editorial spacing refinement */
.services-head .eyebrow{
  margin-bottom:24px;
}
.services-head{
  padding-bottom:54px;
}
.services-head>p{
  max-width:470px;
}
.service-row>p{
  max-width:520px;
}

@media(max-width:680px){
  .services-head .eyebrow{
    margin-bottom:18px;
  }
  .services-head{
    padding-bottom:38px;
  }
}


/* V13 — Serveis: alineació exacta de les descripcions */
.service-row{
  grid-template-columns:70px 480px minmax(0,1fr) auto;
}
.service-row>p{
  width:100%;
  max-width:520px;
  justify-self:start;
  margin-left:0;
}

@media(max-width:1200px){
  .service-row{
    grid-template-columns:60px minmax(300px,420px) minmax(0,1fr) auto;
  }
}
@media(max-width:1050px){
  .service-row{
    grid-template-columns:54px minmax(280px,1fr) minmax(300px,1fr);
  }
  .service-row .text-link{
    grid-column:2;
  }
}
@media(max-width:900px){
  .service-row{
    grid-template-columns:48px 1fr;
  }
  .service-row>p,.service-row .text-link{
    grid-column:2;
  }
}
@media(max-width:680px){
  .service-row{
    grid-template-columns:34px 1fr;
  }
  .service-row>p,.service-row .text-link{
    grid-column:1/-1;
  }
}


/* V14 — Sabadell: jerarquia i espai refinats */
.location-card-soon > div{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.location-card-soon .soon-badge{
  margin-bottom:16px;
}
.location-card-soon h3{
  margin:0;
}
@media(max-width:680px){
  .location-card-soon .soon-badge{
    margin-bottom:13px;
  }
}


/* V15 — Motion refinement inspirat en Apple, subtil i professional */

/* Navegació: compactació i vidre lleu */
.nav{
  transition:
    height .35s cubic-bezier(.22,.7,.25,1),
    background-color .35s ease,
    box-shadow .35s ease,
    backdrop-filter .35s ease;
}
.nav.scrolled{
  height:64px;
  background:rgba(252,253,253,.82);
  backdrop-filter:blur(18px) saturate(125%);
  -webkit-backdrop-filter:blur(18px) saturate(125%);
  box-shadow:0 1px 0 rgba(11,45,59,.07);
}

/* Hero: transformacions dirigides per variables CSS del scroll */
.hero-copy{
  transform:translate3d(0,var(--hero-copy-y,0px),0);
  opacity:var(--hero-copy-opacity,1);
  will-change:transform,opacity;
}
.hero-photo{
  transform:translateX(-50%) scale(var(--hero-scale,1));
  transition:transform .18s linear;
  will-change:transform;
}
.portrait-hero:hover .hero-photo{
  transform:translateX(-50%) scale(var(--hero-scale,1));
}

/* Sobre mi: entrada seqüencial del titular */
.split h2{
  line-height:1.02;
}
.split h2 .motion-word{
  display:block;
  opacity:0;
  transform:translateY(18px);
  color:#78919a;
  transition:
    opacity .65s ease,
    transform .65s cubic-bezier(.22,.7,.25,1),
    color .8s ease;
}
.split h2 .motion-word.is-in{
  opacity:1;
  transform:none;
  color:var(--ink);
}

/* Serveis: línies que es dibuixen i files amb entrada més fina */
.service-list{
  position:relative;
}
.service-row{
  position:relative;
  border-bottom:0;
}
.service-row::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:var(--line);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .8s cubic-bezier(.22,.7,.25,1);
}
.service-row.line-in::after{
  transform:scaleX(1);
}
.service-row:hover{
  transform:translateX(3px);
}

/* On trobar-me: profunditat mínima */
.location-card{
  will-change:transform;
  transition:
    transform .32s cubic-bezier(.22,.7,.25,1),
    border-color .32s ease,
    box-shadow .32s ease,
    background-color .5s ease;
}
.location-card:hover{
  transform:translateY(-2px);
}

/* Sabadell: jerarquia clara i animació de fons molt subtil */
.location-card-soon{
  position:relative;
  overflow:hidden;
}
.location-card-soon::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,rgba(255,255,255,.10),rgba(105,176,199,.08));
  opacity:0;
  transition:opacity .8s ease;
  pointer-events:none;
}
.location-card-soon.is-active::before{
  opacity:1;
}
.location-card-soon > *{
  position:relative;
  z-index:1;
}

/* PROPERAMENT estrictament a sobre de Sabadell */
.location-card-soon > div{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
}
.location-card-soon .soon-badge{
  display:inline-flex;
  margin:0 0 18px 0;
  align-self:flex-start;
}
.location-card-soon h3{
  margin:0;
}

/* CTA i links: microinteraccions */
.text-link span,
.btn span{
  display:inline-block;
  transition:transform .25s ease;
}
.text-link:hover span,
.btn:hover span{
  transform:translateX(4px);
}

/* Reveal global més contingut */
.reveal{
  opacity:0;
  transform:translateY(14px);
  filter:none;
  transition:
    opacity .62s ease,
    transform .62s cubic-bezier(.22,.7,.25,1);
}
.reveal.visible{
  opacity:1;
  transform:none;
}

/* Mobile: moviment encara més discret */
@media(max-width:680px){
  .nav.scrolled{
    height:60px;
  }
  .location-card-soon .soon-badge{
    margin-bottom:14px;
  }
}

/* Accessibilitat: sense moviment si l'usuari ho prefereix */
@media (prefers-reduced-motion:reduce){
  .nav,
  .hero-copy,
  .hero-photo,
  .split h2 .motion-word,
  .service-row::after,
  .location-card,
  .location-card-soon::before,
  .text-link span,
  .btn span,
  .reveal{
    transition:none!important;
    animation:none!important;
  }
  .hero-copy{
    transform:none!important;
    opacity:1!important;
  }
  .hero-photo{
    transform:translateX(-50%)!important;
  }
  .split h2 .motion-word{
    opacity:1!important;
    transform:none!important;
    color:var(--ink)!important;
  }
  .service-row::after{
    transform:scaleX(1)!important;
  }
}


/* V16 — Motion més visible + foto d'Oriol sencera */

/* HERO: foto completa, sense crop */
.hero-visual{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
}
.hero-visual picture{
  position:absolute;
  inset:0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.hero-photo{
  position:absolute!important;
  left:50%!important;
  bottom:0!important;
  top:auto!important;
  width:auto!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  transform:translateX(-50%) translateY(var(--hero-photo-y,0px)) scale(var(--hero-scale,1))!important;
  transform-origin:center bottom;
}

/* HERO: moviment més perceptible */
.hero-copy{
  transform:
    translate3d(
      var(--hero-copy-x,0px),
      var(--hero-copy-y,0px),
      0
    );
  opacity:var(--hero-copy-opacity,1);
}
.hero .eyebrow{
  transform:translateY(var(--hero-eyebrow-y,0px));
}
.hero h1{
  transform:translateY(var(--hero-title-y,0px));
}
.hero .lead{
  transform:translateY(var(--hero-lead-y,0px));
}
.hero .actions{
  transform:translateY(var(--hero-actions-y,0px));
}
.hero .eyebrow,
.hero h1,
.hero .lead,
.hero .actions{
  will-change:transform;
}

/* SOBRE MI: una entrada més marcada */
.split h2 .motion-word{
  transform:translateY(28px);
  opacity:0;
}
.split h2 .motion-word.is-in{
  transform:none;
  opacity:1;
}

/* STATS: entrada escalonada visible */
.stat{
  opacity:0;
  transform:translateY(24px);
  transition:
    opacity .7s ease,
    transform .7s cubic-bezier(.22,.7,.25,1);
}
.stat.stat-in{
  opacity:1;
  transform:none;
}

/* SERVEIS: les files es mouen una mica més */
.service-row{
  opacity:0;
  transform:translateY(26px);
  transition:
    opacity .72s ease,
    transform .72s cubic-bezier(.22,.7,.25,1);
}
.service-row.row-in{
  opacity:1;
  transform:none;
}
.service-row:hover{
  transform:translateX(5px);
}

/* ON TROBAR-ME: cards escalonades */
.location-card{
  opacity:0;
  transform:translateY(28px);
}
.location-card.card-in{
  opacity:1;
  transform:none;
}

/* DEMANA CITA: entrada amb una mica més de presència */
.cta-inner{
  opacity:0;
  transform:translateY(32px);
  transition:
    opacity .75s ease,
    transform .75s cubic-bezier(.22,.7,.25,1);
}
.cta-inner.cta-in{
  opacity:1;
  transform:none;
}

/* Navbar: una mica més evident */
.nav.scrolled{
  height:60px;
  background:rgba(252,253,253,.88);
  box-shadow:0 8px 30px rgba(11,45,59,.055),0 1px 0 rgba(11,45,59,.08);
}

/* CTA flotant amb entrada més clara */
.whatsapp-float{
  transform:translateY(18px) scale(.97);
}
.whatsapp-float.is-visible{
  transform:none;
}

/* Mobile: foto sencera també */
@media(max-width:680px){
  .hero-visual{
    min-height:455px;
  }
  .hero-photo{
    height:92%!important;
    max-width:100%!important;
  }
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  .stat,
  .service-row,
  .location-card,
  .cta-inner{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}


/* V17 — CEM Vintró: fotografia editorial integrada */
.location-card-vintro{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  gap:0;
  padding:0!important;
  overflow:hidden;
  background:#fff;
}
.vintro-media{
  position:relative;
  min-height:330px;
  overflow:hidden;
  background:#dfeaed;
}
.vintro-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(11,45,59,.03),transparent 42%);
  pointer-events:none;
}
.vintro-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.045);
  transition:transform 1.1s cubic-bezier(.22,.7,.25,1);
  will-change:transform;
}
.location-card-vintro.card-in .vintro-media img{
  transform:scale(1);
}
.vintro-content{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:34px 36px;
  min-width:0;
}
.location-card-vintro:hover .vintro-media img{
  transform:scale(1.025);
}
.location-card-vintro .text-link{
  margin-top:auto;
  padding-top:24px;
}

@media(max-width:900px){
  .location-card-vintro{
    grid-template-columns:1fr;
  }
  .vintro-media{
    min-height:280px;
  }
}
@media(max-width:680px){
  .vintro-media{
    min-height:230px;
  }
  .vintro-content{
    padding:28px 24px 30px;
  }
}
@media(prefers-reduced-motion:reduce){
  .vintro-media img{
    transform:none!important;
    transition:none!important;
  }
}

/* V18 — quatre fotografies coherents a On trobar-me */
.location-card-photo{padding:0!important;overflow:hidden;display:flex;flex-direction:column}
.location-media{width:100%;aspect-ratio:16/8.6;overflow:hidden;background:#e7eff1}
.location-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.035);transition:transform 1s cubic-bezier(.22,.7,.25,1)}
.location-card-photo.card-in .location-media img{transform:scale(1)}
.location-card-photo:hover .location-media img{transform:scale(1.022)}
.location-photo-content{display:flex;flex-direction:column;flex:1;padding:30px 32px 32px}
.location-photo-content .text-link{margin-top:auto;padding-top:22px}
.location-card-vintro{display:flex!important;flex-direction:column}
.location-card-vintro .vintro-media{min-height:0!important;aspect-ratio:16/8.6}
.location-card-vintro .vintro-content{flex:1;justify-content:flex-start;padding:30px 32px 32px}
.location-card-vintro .text-link{margin-top:auto}
.stats{display:none!important}
@media(max-width:680px){
.location-photo-content,.location-card-vintro .vintro-content{padding:25px 22px 27px}
.location-media,.location-card-vintro .vintro-media{aspect-ratio:16/10}
}
@media(prefers-reduced-motion:reduce){.location-media img{transform:none!important;transition:none!important}}


/* ==========================================================
   FINAL — refinement only, no redesign
   Base: V19
   ========================================================== */

/* Preserve the approved hero composition */
.hero{
  overflow:visible;
}
.hero-visual{
  overflow:hidden;
}
.hero-photo{
  object-fit:contain!important;
  object-position:center bottom!important;
}

/* NAV — subtle professional transformation */
.nav{
  transition:
    height .32s cubic-bezier(.22,.7,.25,1),
    background-color .32s ease,
    box-shadow .32s ease,
    backdrop-filter .32s ease;
}
.nav.scrolled{
  background:rgba(252,253,253,.90);
  -webkit-backdrop-filter:blur(16px) saturate(120%);
  backdrop-filter:blur(16px) saturate(120%);
  box-shadow:0 1px 0 rgba(11,45,59,.07);
}

/* ABOUT — visible but restrained sequential movement */
.split h2 .motion-word{
  opacity:0;
  transform:translateY(24px);
  transition:
    opacity .58s ease,
    transform .58s cubic-bezier(.22,.7,.25,1),
    color .58s ease;
}
.split h2 .motion-word.is-in{
  opacity:1;
  transform:none;
  color:var(--ink);
}

/* SERVICES — preserve alignment and add only clear reveal */
.service-row{
  transform:none!important;
}
.service-row.motion-ready{
  opacity:0;
  transform:translateY(18px)!important;
  transition:
    opacity .58s ease,
    transform .58s cubic-bezier(.22,.7,.25,1);
}
.service-row.motion-ready.row-in{
  opacity:1;
  transform:none!important;
}
.service-row::after{
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .68s cubic-bezier(.22,.7,.25,1);
}
.service-row.line-in::after{
  transform:scaleX(1);
}

/* ON TROBAR-ME — four cards remain same layout, but become perfectly uniform */
.location-grid{
  align-items:stretch;
}
.location-grid > .location-card:not(.location-card-soon){
  height:100%;
  display:flex!important;
  flex-direction:column!important;
}
.location-grid > .location-card:not(.location-card-soon) .location-media,
.location-card-vintro .vintro-media{
  aspect-ratio:16/8.6!important;
  min-height:0!important;
  flex:0 0 auto;
}
.location-grid > .location-card:not(.location-card-soon) .location-photo-content,
.location-card-vintro .vintro-content{
  flex:1;
  display:flex!important;
  flex-direction:column!important;
}
.location-grid > .location-card:not(.location-card-soon) .text-link,
.location-card-vintro .text-link{
  margin-top:auto!important;
}

/* Location entrance: only small movement */
.location-card.motion-ready{
  opacity:0;
  transform:translateY(18px)!important;
  transition:
    opacity .62s ease,
    transform .62s cubic-bezier(.22,.7,.25,1),
    border-color .28s ease,
    box-shadow .28s ease;
}
.location-card.motion-ready.card-in{
  opacity:1;
  transform:none!important;
}

/* Images: subtle but visible settle + hover */
.location-media img,
.vintro-media img{
  transform:scale(1.035);
  transition:transform .85s cubic-bezier(.22,.7,.25,1);
}
.location-card.card-in .location-media img,
.location-card-vintro.card-in .vintro-media img{
  transform:scale(1);
}
@media(hover:hover) and (pointer:fine){
  .location-card:hover .location-media img,
  .location-card-vintro:hover .vintro-media img{
    transform:scale(1.022);
  }
}

/* Sabadell hierarchy */
.location-card-soon > div{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.location-card-soon .soon-badge{
  margin-bottom:16px!important;
}
.location-card-soon h3{
  margin:0!important;
}

/* Floating CTA should never appear while main hero CTA is still visible */
.whatsapp-float{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(12px);
  transition:
    opacity .3s ease,
    transform .3s cubic-bezier(.22,.7,.25,1),
    visibility .3s;
}
.whatsapp-float.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
}

/* CTA readability: explicitly preserve contrast */
.cta-section h2,
.cta-section .eyebrow,
.cta-section .btn.white{
  opacity:1!important;
}
.cta-section h2{
  color:#fff!important;
}
.cta-section p{
  color:rgba(255,255,255,.78)!important;
}

/* Mobile — no layout surprises */
@media(max-width:680px){
  .location-grid > .location-card:not(.location-card-soon){
    height:auto;
  }
  .location-grid > .location-card:not(.location-card-soon) .location-media,
  .location-card-vintro .vintro-media{
    aspect-ratio:16/10!important;
  }
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  .split h2 .motion-word,
  .service-row.motion-ready,
  .service-row::after,
  .location-card.motion-ready,
  .location-media img,
  .vintro-media img,
  .whatsapp-float{
    transition:none!important;
    animation:none!important;
  }
  .split h2 .motion-word,
  .service-row.motion-ready,
  .location-card.motion-ready{
    opacity:1!important;
    transform:none!important;
  }
  .service-row::after{
    transform:scaleX(1)!important;
  }
  .location-media img,
  .vintro-media img{
    transform:none!important;
  }
}


/* Mobile reliability fix — CEM Vintró image */
.vintro-media img{display:block;width:100%;height:100%;object-fit:cover;}
@media(max-width:680px){
  .location-card-vintro .vintro-media{display:block!important;position:relative!important;width:100%!important;min-height:220px!important;aspect-ratio:16/10!important;overflow:hidden!important;}
  .location-card-vintro .vintro-media img{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important;}
}

/* FIX MOBILE — retrat d'Oriol sense marge blanc superior */
@media(max-width:680px){
  .portrait-hero .hero-photo{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
    transform:scale(1.24);
    transform-origin:50% 18%;
  }
  .portrait-hero:hover .hero-photo{transform:scale(1.24)}
}

/* ==========================================================
   INTERACTIVE MOTION LAYER — premium, subtle, lightweight
   ========================================================== */
.hero{isolation:isolate;position:relative}
.hero-copy,.hero-visual{position:relative;z-index:2}
.hero-motion-scene{
  --px:0px;--py:0px;--sy:0px;
  position:absolute;z-index:0;pointer-events:none;
  width:min(520px,42vw);aspect-ratio:1;
  left:43%;top:49%;opacity:.58;
  transform:translate3d(calc(-50% + var(--px)),calc(-50% + var(--py) + var(--sy)),0);
  transition:opacity .35s ease;
}
.motion-core{position:absolute;inset:16%;border-radius:50%;transform-style:preserve-3d;animation:motionCoreRotate 34s linear infinite}
.motion-links{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 8px 20px rgba(18,79,103,.05))}
.motion-links path{fill:none;stroke:rgba(44,115,145,.18);stroke-width:1.2;stroke-linecap:round;stroke-dasharray:3 8;vector-effect:non-scaling-stroke}
.motion-node{position:absolute;width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.92);border:1px solid rgba(37,109,138,.34);box-shadow:0 8px 24px rgba(25,78,99,.12);animation:nodeFloat 6.8s ease-in-out infinite}
.node-a{left:19%;top:48%}.node-b{left:34%;top:24%;animation-delay:-1.3s}.node-c{right:22%;top:31%;animation-delay:-2.9s}.node-d{right:17%;bottom:26%;animation-delay:-4.1s}.node-e{left:38%;bottom:18%;animation-delay:-5.2s}
.motion-orbit{position:absolute;border-radius:50%;border:1px solid rgba(55,123,151,.14);transform-style:preserve-3d}
.motion-orbit span{position:absolute;width:9px;height:9px;border-radius:50%;background:rgba(47,127,160,.36);box-shadow:0 0 0 8px rgba(47,127,160,.045)}
.orbit-one{inset:5%;transform:rotateX(68deg) rotateZ(8deg);animation:orbitSlow 28s linear infinite}.orbit-one span{top:8%;left:65%}
.orbit-two{inset:24%;transform:rotateY(64deg) rotateZ(-14deg);animation:orbitSlowReverse 39s linear infinite}.orbit-two span{bottom:3%;left:42%}
.motion-halo{position:absolute;border-radius:50%;filter:blur(1px);animation:haloFloat 7.4s ease-in-out infinite}
.halo-a{width:28%;height:28%;right:1%;top:18%;background:radial-gradient(circle,rgba(101,170,194,.10),rgba(101,170,194,0) 72%)}
.halo-b{width:35%;height:35%;left:3%;bottom:5%;background:radial-gradient(circle,rgba(18,80,104,.07),rgba(18,80,104,0) 72%);animation-delay:-3.3s}
@keyframes motionCoreRotate{to{transform:rotate(360deg)}}
@keyframes orbitSlow{to{transform:rotateX(68deg) rotateZ(368deg)}}
@keyframes orbitSlowReverse{to{transform:rotateY(64deg) rotateZ(-374deg)}}
@keyframes nodeFloat{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes haloFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-9px,0) scale(1.04)}}

/* Desktop depth: separate layers, never enough to disturb layout */
@media(hover:hover) and (pointer:fine) and (min-width:901px){
  .hero-visual{transform:translate3d(var(--portrait-x,0px),var(--portrait-y,0px),0);transition:transform .55s cubic-bezier(.22,.7,.25,1)}
  .service-row.row-in,.location-card.card-in{will-change:transform;transform:perspective(1100px) translateY(var(--lift,0px)) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg))!important;transition:transform .38s cubic-bezier(.22,.7,.25,1),box-shadow .38s ease,border-color .28s ease}
  .service-row.row-in:hover{--lift:-3px}
  .location-card.card-in:hover{--lift:-6px;box-shadow:0 22px 54px rgba(13,52,69,.085)}
}

/* Buttons: physical but quiet */
.btn,.nav-cta{will-change:transform}
.btn span,.nav-cta span{display:inline-block;transition:transform .3s cubic-bezier(.22,.7,.25,1)}
@media(hover:hover) and (pointer:fine){
  .btn:hover,.nav-cta:hover{transform:translateY(-2px) scale(1.012)}
  .btn:hover span,.nav-cta:hover span{transform:translateX(4px)}
}
.btn:active,.nav-cta:active{transform:translateY(0) scale(.975)!important;transition-duration:.1s}

/* Gentle staged reveal; JS supplies --reveal-delay */
.reveal{transition-delay:var(--reveal-delay,0ms)}

/* Mobile: keep the scene as a static-feeling ambient detail, no pointer parallax */
@media(max-width:900px){
  .hero-motion-scene{width:min(430px,86vw);left:64%;top:59%;opacity:.34;--px:0px!important;--py:0px!important;--sy:0px!important}
}
@media(max-width:680px){
  .hero-motion-scene{width:340px;left:76%;top:55%;opacity:.25}
  .motion-node{width:9px;height:9px}
}

@media(prefers-reduced-motion:reduce){
  .hero-motion-scene{transform:translate(-50%,-50%)!important}
  .motion-core,.motion-orbit,.motion-node,.motion-halo{animation:none!important}
  .hero-visual,.service-row.row-in,.location-card.card-in{transform:none!important;transition:none!important}
  .reveal{transition-delay:0ms!important}
}

/* V12 — CTA "Parlem del teu cas": fons cinètic inspirat en fisioteràpia */
.cta-section{
  isolation:isolate;
  min-height:620px;
  display:grid;
  place-items:center;
}
.cta-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 16% 72%,rgba(87,171,196,.10),transparent 28%),
    radial-gradient(circle at 83% 33%,rgba(131,196,211,.08),transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.018),transparent 35%);
}
.physio-motion-bg{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
  opacity:.9;
}
.physio-kinetic-lines{
  position:absolute;
  inset:-6% -2%;
  width:104%;
  height:112%;
  overflow:visible;
  opacity:.34;
  animation:physioWaveFloat 10s ease-in-out infinite alternate;
}
.physio-kinetic-lines .fiber{
  fill:none;
  stroke:rgba(157,216,231,.30);
  stroke-width:1.15;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
  stroke-dasharray:2 7;
  animation:fiberTravel 28s linear infinite;
}
.physio-kinetic-lines .fiber-b{opacity:.52;animation-duration:34s;animation-direction:reverse}
.physio-kinetic-lines .fiber-c{opacity:.35;animation-duration:40s}

.joint{
  position:absolute;
  width:270px;
  aspect-ratio:1;
  opacity:.32;
  filter:drop-shadow(0 0 18px rgba(117,197,218,.08));
  animation:jointFloat 8s ease-in-out infinite alternate;
}
.joint-knee{left:-42px;bottom:14px;transform:rotate(-16deg)}
.joint-shoulder{right:1.5%;top:10%;width:230px;transform:rotate(22deg);animation-duration:10s;animation-direction:alternate-reverse}
.joint-ring{
  position:absolute;
  border:1px solid rgba(157,216,231,.32);
  border-radius:50%;
  inset:23%;
}
.joint-ring.ring-b{inset:34%;border-style:dashed;animation:jointRotate 32s linear infinite}
.joint-ring.ring-a{animation:jointRotateReverse 38s linear infinite}
.joint-node{position:absolute;border-radius:50%;background:rgba(198,233,241,.56);box-shadow:0 0 0 8px rgba(155,216,231,.035)}
.node-main{width:21px;height:21px;left:calc(50% - 10px);top:calc(50% - 10px)}
.node-one{width:10px;height:10px;left:21%;top:31%}
.node-two{width:8px;height:8px;right:20%;bottom:27%}
.joint-bone{
  position:absolute;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(165,220,233,.48),transparent);
  transform-origin:left center;
}
.bone-one{width:112px;left:21%;top:34%;transform:rotate(34deg)}
.bone-two{width:98px;left:49%;top:51%;transform:rotate(49deg)}

.motion-particle{position:absolute;width:4px;height:4px;border-radius:50%;background:rgba(188,230,239,.60);box-shadow:0 0 15px rgba(162,221,234,.45);animation:particleDrift 7s ease-in-out infinite alternate}
.motion-particle.p1{left:17%;top:25%;animation-delay:-2s}
.motion-particle.p2{left:32%;bottom:18%;width:3px;height:3px;animation-duration:9s}
.motion-particle.p3{right:28%;top:24%;width:3px;height:3px;animation-delay:-4s}
.motion-particle.p4{right:13%;bottom:24%;animation-duration:11s}

.cta-inner{z-index:3}
.cta-section .cta-inner::after{
  content:"";
  display:block;
  width:82px;
  height:1px;
  margin:34px auto -34px;
  background:linear-gradient(90deg,transparent,rgba(187,226,236,.45),transparent);
}

@keyframes fiberTravel{to{stroke-dashoffset:-180}}
@keyframes physioWaveFloat{to{transform:translate3d(0,-12px,0) scale(1.015)}}
@keyframes jointFloat{to{translate:0 -12px;rotate:3deg}}
@keyframes jointRotate{to{transform:rotate(360deg)}}
@keyframes jointRotateReverse{to{transform:rotate(-360deg)}}
@keyframes particleDrift{to{transform:translate3d(8px,-14px,0);opacity:.45}}

@media(max-width:760px){
  .cta-section{min-height:auto}
  .physio-kinetic-lines{opacity:.26;animation-duration:14s}
  .joint{opacity:.18;transform:scale(.76)}
  .joint-knee{left:-90px;bottom:-8px}
  .joint-shoulder{right:-70px;top:5%}
  .motion-particle{opacity:.5}
}
@media(prefers-reduced-motion:reduce){
  .physio-kinetic-lines,.physio-kinetic-lines .fiber,.joint,.joint-ring,.motion-particle{animation:none!important}
}

/* ==========================================================
   V13 — BIOMECHANICAL MOTION: more visible, still premium
   ========================================================== */
.hero-motion-scene{
  width:min(680px,50vw);
  left:46%;
  top:51%;
  opacity:.72;
}
.hero-kinetic-chain{
  position:absolute;
  inset:-9% -16%;
  width:132%;
  height:118%;
  overflow:visible;
  filter:drop-shadow(0 14px 35px rgba(26,98,126,.07));
  animation:chainBreathe 9s ease-in-out infinite alternate;
}
.chain-path{
  fill:none;
  stroke:rgba(39,117,149,.25);
  stroke-width:1.35;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
}
.chain-b{stroke:rgba(75,143,169,.13);stroke-dasharray:5 11;animation:chainDash 22s linear infinite}
.chain-a{stroke-dasharray:2 8;animation:chainDash 15s linear infinite reverse}
.chain-joint{
  fill:rgba(255,255,255,.94);
  stroke:rgba(31,107,138,.35);
  stroke-width:1.4;
  transform-box:fill-box;
  transform-origin:center;
  animation:jointPulse 5.8s ease-in-out infinite;
}
.chain-joint.j2{animation-delay:-1.4s}.chain-joint.j3{animation-delay:-2.8s}.chain-joint.j4{animation-delay:-4.1s}.chain-joint.j5{animation-delay:-5s}
.chain-tracer{fill:rgba(62,143,174,.48);filter:drop-shadow(0 0 7px rgba(62,143,174,.22))}
.tracer-a{offset-path:path('M95 430 C165 318 255 344 320 260 S478 120 598 205 S674 408 621 480');animation:traceMove 11s linear infinite}
.tracer-b{offset-path:path('M118 463 C188 390 250 402 328 340 S468 254 581 306 S659 430 626 516');animation:traceMove 16s linear infinite reverse;opacity:.7}
@keyframes chainDash{to{stroke-dashoffset:-190}}
@keyframes chainBreathe{to{transform:translate3d(0,-10px,0) rotate(.7deg) scale(1.015)}}
@keyframes jointPulse{0%,100%{transform:scale(.9);opacity:.55}50%{transform:scale(1.18);opacity:1}}
@keyframes traceMove{to{offset-distance:100%}}

/* CTA: make the body-motion concept unmistakable without overpowering the copy */
.physio-motion-bg{opacity:1}
.physio-kinetic-lines{opacity:.5;animation-duration:7.5s}
.physio-kinetic-lines .fiber{stroke:rgba(157,216,231,.42);stroke-width:1.35;animation-duration:16s}
.physio-kinetic-lines .fiber-b{animation-duration:21s}
.physio-kinetic-lines .fiber-c{animation-duration:27s}
.joint{opacity:.46;animation-duration:6.4s}
.joint-knee{width:310px;left:-28px;bottom:-5px}
.joint-shoulder{width:275px;right:1%;top:4%}
.joint-ring.ring-b{animation-duration:19s}
.joint-ring.ring-a{animation-duration:26s}
.motion-particle{width:5px;height:5px;animation-duration:5.8s}
.cta-section::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 10%,rgba(126,203,222,.035) 35%,transparent 58%);
  transform:translateX(-35%);
  animation:ctaSweep 12s ease-in-out infinite;
}
@keyframes ctaSweep{0%,20%{transform:translateX(-38%)}65%,100%{transform:translateX(38%)}}

@media(max-width:900px){
  .hero-motion-scene{width:min(520px,104vw);left:66%;top:58%;opacity:.48}
  .hero-kinetic-chain{inset:-2% -18%;width:138%;height:112%}
}
@media(max-width:680px){
  .hero-motion-scene{width:430px;left:73%;top:57%;opacity:.38}
  .hero-kinetic-chain{opacity:.75}
  .physio-kinetic-lines{opacity:.34;animation-duration:10s}
  .joint{opacity:.25}
  .motion-particle{opacity:.65}
}
@media(prefers-reduced-motion:reduce){
  .hero-kinetic-chain,.chain-path,.chain-joint,.chain-tracer,.cta-section::after{animation:none!important}
}

/* ==========================================================
   V14 — HERO BIOMECHANICS: premium clinical movement system
   ========================================================== */
.hero-motion-scene{
  width:min(760px,54vw);
  left:48%;
  top:50%;
  opacity:.82;
  mix-blend-mode:multiply;
}
.hero-motion-scene::before{
  content:"";
  position:absolute;
  inset:-8%;
  border-radius:50%;
  pointer-events:none;
  background:
    radial-gradient(circle at 73% 28%,rgba(93,164,188,.095),transparent 21%),
    radial-gradient(circle at 28% 74%,rgba(30,105,137,.055),transparent 22%);
  animation:biomechAmbient 17s ease-in-out infinite alternate;
}
.hero-kinetic-chain{
  inset:-10% -18%;
  width:138%;
  height:122%;
  opacity:.96;
  filter:drop-shadow(0 18px 34px rgba(25,86,108,.055));
  animation:biomechChainDrift 14s ease-in-out infinite alternate;
}
.chain-path{
  stroke-width:1.2;
}
.chain-a{stroke:rgba(31,107,138,.22);stroke-dasharray:2 10;animation-duration:21s}
.chain-b{stroke:rgba(77,142,166,.11);stroke-dasharray:5 14;animation-duration:31s}
.chain-joint{stroke:rgba(28,100,130,.33);fill:rgba(252,254,255,.9)}
.chain-joint.j1,.chain-joint.j5{opacity:.72}
.chain-tracer{opacity:.66}
.tracer-a{animation-duration:16s}.tracer-b{animation-duration:23s}

/* ROM = range-of-motion arcs. Deliberately partial, like clinical biomechanics diagrams. */
.rom-arc{transform-box:fill-box;transform-origin:center;opacity:.72}
.rom-arc path{fill:none;stroke:rgba(41,120,151,.19);stroke-width:1.15;stroke-linecap:round;stroke-dasharray:5 10;vector-effect:non-scaling-stroke}
.rom-arc circle{fill:rgba(51,130,160,.34)}
.rom-shoulder{animation:romSweep 33s linear infinite}
.rom-knee{animation:romSweepReverse 41s linear infinite}

/* Subtle force-transfer trajectory: a visual cue for kinetic-chain load transfer. */
.force-route{opacity:.48}
.force-route path{fill:none;stroke:rgba(65,137,163,.16);stroke-width:1;stroke-linecap:round;stroke-dasharray:1 13;vector-effect:non-scaling-stroke;animation:forceDash 26s linear infinite}
.force-dot{fill:rgba(44,126,158,.34);offset-path:path('M138 177 C236 120 325 135 396 198 S520 326 665 326');animation:forceTravel 18s linear infinite;filter:drop-shadow(0 0 8px rgba(47,130,160,.16))}

/* Keep the reading zone calmer. The scene fades before it competes with the copy. */
.hero-safe-zone{
  position:absolute;
  z-index:4;
  left:-19%;
  top:11%;
  width:58%;
  height:78%;
  pointer-events:none;
  background:radial-gradient(ellipse at 42% 48%,rgba(252,253,253,.93) 0%,rgba(252,253,253,.72) 42%,rgba(252,253,253,.2) 72%,transparent 100%);
  filter:blur(14px);
  opacity:.88;
}

/* A calmer secondary orbit language: not tech, more joint-axis / goniometry. */
.motion-orbit{border-color:rgba(52,120,146,.10)}
.orbit-one{animation-duration:37s;opacity:.72}
.orbit-two{animation-duration:49s;opacity:.58}
.motion-orbit span{width:7px;height:7px;background:rgba(49,125,155,.27);box-shadow:0 0 0 7px rgba(47,127,160,.026)}
.motion-core{animation-duration:46s;opacity:.68}
.motion-links path{stroke:rgba(44,115,145,.115);stroke-dasharray:2 11}
.motion-node{width:10px;height:10px;animation-duration:8.8s;opacity:.82}
.node-b{animation-duration:10.6s}.node-c{animation-duration:12.2s}.node-d{animation-duration:9.7s}.node-e{animation-duration:11.4s}

@keyframes biomechAmbient{to{transform:translate3d(7px,-8px,0) scale(1.025)}}
@keyframes biomechChainDrift{0%{transform:translate3d(-3px,3px,0) rotate(-.35deg) scale(.995)}100%{transform:translate3d(8px,-7px,0) rotate(.55deg) scale(1.012)}}
@keyframes romSweep{to{transform:rotate(360deg)}}
@keyframes romSweepReverse{to{transform:rotate(-360deg)}}
@keyframes forceDash{to{stroke-dashoffset:-210}}
@keyframes forceTravel{to{offset-distance:100%}}

@media(hover:hover) and (pointer:fine) and (min-width:901px){
  .hero-motion-scene{will-change:transform}
  .hero-kinetic-chain{transform:translate3d(var(--bio-x,0px),var(--bio-y,0px),0)}
  .motion-core{translate:calc(var(--core-x,0px)) calc(var(--core-y,0px))}
}

@media(max-width:900px){
  .hero-motion-scene{width:min(600px,112vw);left:67%;top:57%;opacity:.58;mix-blend-mode:normal}
  .hero-safe-zone{left:-30%;top:6%;width:70%;height:68%;opacity:.92}
  .force-route{opacity:.34}
  .rom-arc{opacity:.50}
}
@media(max-width:680px){
  .hero-motion-scene{width:470px;left:74%;top:55%;opacity:.44}
  .hero-kinetic-chain{width:136%;height:114%;inset:-3% -20%}
  .hero-safe-zone{left:-42%;top:0;width:82%;height:62%;filter:blur(10px)}
  .motion-core,.orbit-two{display:none}
  .rom-knee{display:none}
  .chain-b{opacity:.45}
}
@media(prefers-reduced-motion:reduce){
  .hero-motion-scene::before,.rom-arc,.force-route path,.force-dot,.hero-kinetic-chain{animation:none!important}
}

/* V15 — Sobre mi editorial premium + biomecànica subtil */
.about-section{
  position:relative;
  grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr);
  gap:clamp(72px,9vw,150px);
  padding-top:clamp(96px,9vw,145px);
  padding-bottom:clamp(96px,9vw,145px);
  overflow:hidden;
}
.about-section::after{
  content:"";
  position:absolute;
  width:560px;
  height:560px;
  right:-260px;
  bottom:-330px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(76,151,176,.055),rgba(76,151,176,0) 68%);
  pointer-events:none;
}
.about-intro{position:relative;min-width:0;padding-top:2px}
.about-title-wrap{position:relative;isolation:isolate;max-width:520px;margin-top:14px}
.about-title-wrap h2{position:relative;z-index:2;font-size:clamp(54px,5.1vw,78px);line-height:1.08;letter-spacing:-.06em}
.about-title-wrap .motion-word:nth-child(3){color:var(--deep)}
.about-biomech{
  position:absolute;
  z-index:1;
  width:min(520px,120%);
  height:auto;
  left:-92px;
  top:-86px;
  overflow:visible;
  pointer-events:none;
  opacity:.9;
}
.about-path{fill:none;stroke:var(--blue);stroke-width:1.15;stroke-linecap:round;opacity:.11;vector-effect:non-scaling-stroke}
.about-path.path-secondary{opacity:.065;stroke-dasharray:5 12}
.about-joint{fill:#fff;stroke:var(--blue);stroke-width:1.2;opacity:.17;transform-box:fill-box;transform-origin:center}
.about-rom{fill:none;stroke:var(--blue);stroke-width:1.1;opacity:.12;transform-origin:410px 207px;animation:aboutRotate 34s linear infinite}
.about-rom circle{fill:var(--blue);stroke:none}
.aj1{animation:aboutFloatA 8.5s ease-in-out infinite}
.aj2{animation:aboutPulse 7s ease-in-out infinite}
.aj3{animation:aboutFloatB 10.5s ease-in-out infinite}
.about-connector{width:min(250px,72%);height:1px;margin-top:42px;background:rgba(13,52,69,.1);overflow:hidden;position:relative}
.about-connector span{position:absolute;inset:0;background:linear-gradient(90deg,var(--blue),rgba(76,151,176,.15));transform:scaleX(0);transform-origin:left center}
.about-intro.visible .about-connector span{animation:aboutDraw 1.15s var(--ease-premium) .6s forwards}
.about-copy{max-width:650px;font-size:clamp(18px,1.55vw,22px);line-height:1.68;padding-top:6px}
.about-copy p{margin-bottom:30px}
.about-conclusion{position:relative;margin-top:38px!important;padding:4px 0 4px 24px;font-size:clamp(19px,1.55vw,22px);line-height:1.58}
.about-conclusion::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--blue);transform:scaleY(0);transform-origin:top}
.about-copy.visible .about-conclusion::before{animation:aboutLineIn .75s var(--ease-premium) .45s forwards}
.about-link{margin-top:10px;font-size:18px}
.about-link span{display:inline-block}

@keyframes aboutRotate{to{transform:rotate(360deg)}}
@keyframes aboutFloatA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(5px,-7px,0)}}
@keyframes aboutFloatB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-5px,6px,0)}}
@keyframes aboutPulse{0%,100%{transform:scale(1);opacity:.14}50%{transform:scale(1.12);opacity:.22}}
@keyframes aboutDraw{to{transform:scaleX(1)}}
@keyframes aboutLineIn{to{transform:scaleY(1)}}

@media (max-width:900px){
  .about-section{grid-template-columns:1fr;gap:52px}
  .about-title-wrap{max-width:470px}
  .about-biomech{width:460px;left:-110px;top:-85px;opacity:.72}
  .about-copy{max-width:700px;padding-top:0}
  .about-connector{width:190px;margin-top:30px}
}
@media (max-width:560px){
  .about-section{gap:38px;padding-top:78px;padding-bottom:78px}
  .about-title-wrap h2{font-size:clamp(48px,15vw,64px);line-height:1.02}
  .about-biomech{width:360px;left:-100px;top:-74px;opacity:.48}
  .about-path.path-secondary,.about-rom{display:none}
  .about-connector{width:130px;margin-top:24px}
  .about-copy{font-size:18px;line-height:1.68}
  .about-copy p{margin-bottom:24px}
  .about-conclusion{padding-left:18px;margin-top:30px!important}
}
@media (prefers-reduced-motion:reduce){
  .about-rom,.about-joint{animation:none!important}
  .about-connector span,.about-conclusion::before{animation:none!important;transform:none!important}
}
.about-copy > p,.about-copy > .about-link{transition:opacity .7s var(--ease-premium),transform .7s var(--ease-premium)}
@media (prefers-reduced-motion:no-preference){
  .about-copy:not(.visible) > p,.about-copy:not(.visible) > .about-link{opacity:0;transform:translateY(12px)}
  .about-copy.visible > p:nth-child(1){transition-delay:.06s}
  .about-copy.visible > p:nth-child(2){transition-delay:.18s}
  .about-copy.visible > p:nth-child(3){transition-delay:.30s}
  .about-copy.visible > .about-link{transition-delay:.43s}
}

/* V19 — Sobre mi: corredor biomecànic premium i animat */
.about-runner-wrap{
  min-height:470px;
  max-width:620px;
  overflow:visible;
  isolation:isolate;
}
.about-runner-wrap h2{
  position:relative;
  z-index:6;
  max-width:430px;
  text-shadow:0 1px 0 rgba(255,255,255,.92);
}
.runner-motion{
  position:absolute;
  z-index:2;
  width:min(470px,82%);
  right:-8px;
  bottom:-42px;
  aspect-ratio:570/585;
  pointer-events:none;
  transform-origin:55% 62%;
  animation:runnerBody 5.6s cubic-bezier(.45,0,.55,1) infinite;
  will-change:transform;
}
.runner-motion img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  user-select:none;
  -webkit-user-drag:none;
}
.runner-main{
  opacity:.72;
  filter:saturate(.76) contrast(.96);
}
.runner-ghost{
  opacity:.08;
  filter:blur(.7px) saturate(.75);
  mix-blend-mode:multiply;
}
.runner-ghost-a{animation:runnerGhostA 7.8s ease-in-out infinite}
.runner-ghost-b{animation:runnerGhostB 10.2s ease-in-out infinite}
.runner-sweep{
  position:absolute;
  left:-9%;
  width:58%;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(43,126,156,0),rgba(43,126,156,.22),rgba(43,126,156,0));
  transform-origin:left center;
  opacity:.55;
}
.sweep-a{bottom:22%;animation:runnerSweep 8.8s ease-in-out infinite}
.sweep-b{bottom:48%;width:44%;opacity:.22;animation:runnerSweep 12.4s ease-in-out -3s infinite}
.about-intro.visible .runner-motion{
  animation:runnerEnter 1.05s cubic-bezier(.22,1,.36,1) both,runnerBody 5.6s 1.05s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes runnerEnter{
  from{opacity:0;transform:translate3d(-24px,10px,0) scale(.975)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes runnerBody{
  0%,100%{transform:translate3d(0,1px,0) rotate(-.18deg) scale(1)}
  50%{transform:translate3d(5px,-5px,0) rotate(.28deg) scale(1.008)}
}
@keyframes runnerGhostA{
  0%,100%{transform:translate3d(-1px,1px,0);opacity:.035}
  50%{transform:translate3d(-13px,3px,0);opacity:.105}
}
@keyframes runnerGhostB{
  0%,100%{transform:translate3d(-3px,0,0);opacity:.025}
  50%{transform:translate3d(-20px,6px,0);opacity:.07}
}
@keyframes runnerSweep{
  0%,100%{transform:translate3d(-5px,0,0) scaleX(.78);opacity:.12}
  50%{transform:translate3d(18px,-2px,0) scaleX(1.08);opacity:.55}
}
/* anul·la la decoració abstracta antiga */
.about-biomech{display:none!important}

@media (min-width:901px){
  .about-section{grid-template-columns:minmax(530px,.92fr) minmax(460px,1.08fr);gap:clamp(72px,7vw,118px)}
  .about-copy{position:relative;z-index:8;background:linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.88) 12%,rgba(255,255,255,0) 44px)}
}
@media (max-width:900px){
  .about-runner-wrap{min-height:520px;max-width:600px}
  .runner-motion{width:min(455px,78vw);right:0;bottom:-36px}
}
@media (max-width:560px){
  .about-runner-wrap{min-height:500px;max-width:100%}
  .runner-motion{width:min(390px,94vw);right:-14px;bottom:-18px;opacity:.88}
  .runner-main{opacity:.62}
  .runner-ghost-b{display:none}
  .runner-sweep{opacity:.22}
}
@media (prefers-reduced-motion:reduce){
  .runner-motion,.runner-ghost,.runner-sweep{animation:none!important}
}

/* V20 — corredor amb moviment més visible però elegant */
@media (prefers-reduced-motion:no-preference){
  .runner-motion{
    animation:runnerBodyV20 4.2s cubic-bezier(.45,0,.55,1) infinite;
  }
  .about-intro.visible .runner-motion{
    animation:runnerEnterV20 1s cubic-bezier(.22,1,.36,1) both,
              runnerBodyV20 4.2s 1s cubic-bezier(.45,0,.55,1) infinite;
  }
  .runner-main{
    animation:runnerPulseV20 4.2s ease-in-out infinite;
  }
  .runner-ghost-a{
    animation:runnerGhostAV20 4.2s ease-in-out infinite;
  }
  .runner-ghost-b{
    animation:runnerGhostBV20 5.6s ease-in-out -.9s infinite;
  }
  .sweep-a{
    animation:runnerSweepV20 5.2s ease-in-out infinite;
  }
  .sweep-b{
    animation:runnerSweepV20 7.4s ease-in-out -2s infinite;
  }
}

@keyframes runnerEnterV20{
  from{opacity:0;transform:translate3d(-34px,12px,0) scale(.965)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes runnerBodyV20{
  0%,100%{transform:translate3d(-4px,3px,0) rotate(-.35deg) scale(1)}
  28%{transform:translate3d(5px,-4px,0) rotate(.12deg) scale(1.008)}
  55%{transform:translate3d(13px,-8px,0) rotate(.48deg) scale(1.015)}
  78%{transform:translate3d(4px,-2px,0) rotate(.08deg) scale(1.006)}
}
@keyframes runnerPulseV20{
  0%,100%{filter:saturate(.76) contrast(.96);opacity:.72}
  50%{filter:saturate(.82) contrast(1.01);opacity:.78}
}
@keyframes runnerGhostAV20{
  0%,100%{transform:translate3d(-4px,3px,0) scale(.995);opacity:.025}
  55%{transform:translate3d(-23px,8px,0) scale(.985);opacity:.12}
}
@keyframes runnerGhostBV20{
  0%,100%{transform:translate3d(-8px,5px,0) scale(.99);opacity:.018}
  50%{transform:translate3d(-36px,12px,0) scale(.975);opacity:.075}
}
@keyframes runnerSweepV20{
  0%,100%{transform:translate3d(-18px,2px,0) scaleX(.68);opacity:.08}
  50%{transform:translate3d(30px,-4px,0) scaleX(1.22);opacity:.62}
}

@media (max-width:560px) and (prefers-reduced-motion:no-preference){
  .runner-motion{animation-duration:4.8s}
  .runner-ghost-a{animation-duration:4.8s}
}


/* V21 — carrera biomecànica: cicle visible de braços i cames */
.runner-limb{
  z-index:3;
  opacity:.72;
  filter:saturate(.76) contrast(.96);
  transform-box:border-box;
  will-change:transform;
}
/* Cada capa mostra només una extremitat de la mateixa il·lustració, de manera que
   la figura conserva exactament el mateix estil però les extremitats poden articular-se. */
.runner-arm-front{clip-path:polygon(57% 20%,100% 18%,100% 54%,61% 48%);transform-origin:61% 31%}
.runner-arm-back{clip-path:polygon(13% 25%,62% 20%,59% 47%,5% 49%);transform-origin:56% 31%}
.runner-leg-front{clip-path:polygon(48% 49%,96% 48%,91% 100%,46% 100%);transform-origin:57% 58%}
.runner-leg-back{clip-path:polygon(8% 48%,60% 48%,58% 100%,0 100%);transform-origin:52% 58%}

@media (prefers-reduced-motion:no-preference){
  .runner-motion,
  .about-intro.visible .runner-motion{
    animation:runnerRunBody 1.55s cubic-bezier(.45,0,.55,1) infinite;
  }
  .about-intro.visible .runner-motion{
    animation:runnerEnterV21 .75s cubic-bezier(.22,1,.36,1) both,
              runnerRunBody 1.55s .75s cubic-bezier(.45,0,.55,1) infinite;
  }
  .runner-main{animation:runnerCoreV21 1.55s ease-in-out infinite;opacity:.54}
  .runner-arm-front{animation:armFrontV21 1.55s ease-in-out infinite}
  .runner-arm-back{animation:armBackV21 1.55s ease-in-out infinite}
  .runner-leg-front{animation:legFrontV21 1.55s ease-in-out infinite}
  .runner-leg-back{animation:legBackV21 1.55s ease-in-out infinite}
  .runner-ghost-a{animation:runnerGhostAV21 1.55s ease-in-out infinite}
  .runner-ghost-b{animation:runnerGhostBV21 1.55s ease-in-out -.775s infinite}
  .sweep-a{animation:runnerSweepV21 2.2s ease-in-out infinite}
  .sweep-b{animation:runnerSweepV21 3.1s ease-in-out -1s infinite}
}
@keyframes runnerEnterV21{
  from{opacity:0;transform:translate3d(-30px,8px,0) scale(.975)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes runnerRunBody{
  0%,100%{transform:translate3d(-3px,3px,0) rotate(-.5deg)}
  25%{transform:translate3d(3px,-6px,0) rotate(.25deg)}
  50%{transform:translate3d(9px,2px,0) rotate(-.2deg)}
  75%{transform:translate3d(3px,-7px,0) rotate(.35deg)}
}
@keyframes runnerCoreV21{
  0%,100%{transform:translateY(1px);opacity:.56}
  25%,75%{transform:translateY(-2px);opacity:.62}
  50%{transform:translateY(1px);opacity:.56}
}
@keyframes armFrontV21{
  0%,100%{transform:rotate(-4deg) translate3d(-1px,1px,0)}
  50%{transform:rotate(6deg) translate3d(3px,-2px,0)}
}
@keyframes armBackV21{
  0%,100%{transform:rotate(5deg) translate3d(1px,-1px,0)}
  50%{transform:rotate(-6deg) translate3d(-3px,2px,0)}
}
@keyframes legFrontV21{
  0%,100%{transform:rotate(-3deg) translate3d(-1px,1px,0)}
  50%{transform:rotate(5deg) translate3d(4px,-3px,0)}
}
@keyframes legBackV21{
  0%,100%{transform:rotate(4deg) translate3d(1px,-1px,0)}
  50%{transform:rotate(-5deg) translate3d(-5px,3px,0)}
}
@keyframes runnerGhostAV21{
  0%,100%{transform:translate3d(-7px,5px,0);opacity:.035}
  50%{transform:translate3d(-27px,8px,0);opacity:.11}
}
@keyframes runnerGhostBV21{
  0%,100%{transform:translate3d(-13px,7px,0);opacity:.02}
  50%{transform:translate3d(-42px,12px,0);opacity:.07}
}
@keyframes runnerSweepV21{
  0%{transform:translate3d(-28px,3px,0) scaleX(.55);opacity:.05}
  50%{transform:translate3d(24px,-3px,0) scaleX(1.28);opacity:.56}
  100%{transform:translate3d(45px,-5px,0) scaleX(.72);opacity:.08}
}
@media (max-width:560px) and (prefers-reduced-motion:no-preference){
  .runner-motion,.about-intro.visible .runner-motion{animation-duration:1.8s}
  .runner-limb,.runner-main,.runner-ghost-a,.runner-ghost-b{animation-duration:1.8s}
}
@media (prefers-reduced-motion:reduce){.runner-limb{animation:none!important}}

/* V22 — moviment elegant: sensació de cursa sense deformar la figura */
.runner-limb{display:none!important}
@media (prefers-reduced-motion:no-preference){
  .runner-motion,
  .about-intro.visible .runner-motion{
    animation:runnerStrideV22 2.65s cubic-bezier(.45,0,.55,1) infinite!important;
  }
  .about-intro.visible .runner-motion{
    animation:runnerEnterV22 .9s cubic-bezier(.22,1,.36,1) both,
              runnerStrideV22 2.65s .9s cubic-bezier(.45,0,.55,1) infinite!important;
  }
  .runner-main{
    opacity:.58;
    animation:runnerBreathV22 2.65s ease-in-out infinite!important;
    filter:saturate(.78) contrast(.94);
  }
  .runner-ghost{mix-blend-mode:multiply;filter:saturate(.55) blur(.35px)}
  .runner-ghost-a{opacity:.075;animation:runnerEchoAV22 2.65s cubic-bezier(.45,0,.55,1) infinite!important}
  .runner-ghost-b{opacity:.04;animation:runnerEchoBV22 2.65s cubic-bezier(.45,0,.55,1) -.22s infinite!important}
  .runner-sweep{height:1px;background:linear-gradient(90deg,transparent,rgba(30,113,145,.18),transparent);filter:none}
  .sweep-a{animation:runnerSweepElegantV22 5.8s ease-in-out infinite!important}
  .sweep-b{animation:runnerSweepElegantV22 7.4s ease-in-out -2.1s infinite!important}
}
@keyframes runnerEnterV22{
  from{opacity:0;transform:translate3d(-22px,8px,0) scale(.985)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes runnerStrideV22{
  0%,100%{transform:translate3d(-3px,1px,0) rotate(-.22deg)}
  24%{transform:translate3d(2px,-3px,0) rotate(.12deg)}
  50%{transform:translate3d(5px,0,0) rotate(.24deg)}
  76%{transform:translate3d(1px,-2px,0) rotate(-.08deg)}
}
@keyframes runnerBreathV22{
  0%,100%{transform:scale(1);filter:saturate(.78) contrast(.94)}
  50%{transform:scale(1.006);filter:saturate(.82) contrast(.96)}
}
@keyframes runnerEchoAV22{
  0%,100%{transform:translate3d(-18px,3px,0) scale(.997);opacity:.025}
  35%{transform:translate3d(-10px,-1px,0) scale(1);opacity:.08}
  70%{transform:translate3d(-24px,2px,0) scale(.994);opacity:.035}
}
@keyframes runnerEchoBV22{
  0%,100%{transform:translate3d(-30px,5px,0) scale(.992);opacity:.015}
  45%{transform:translate3d(-18px,1px,0) scale(.997);opacity:.045}
}
@keyframes runnerSweepElegantV22{
  0%,100%{transform:translateX(-8px) scaleX(.82);opacity:.05}
  50%{transform:translateX(12px) scaleX(1.06);opacity:.18}
}
@media (max-width:760px) and (prefers-reduced-motion:no-preference){
  .runner-motion,.about-intro.visible .runner-motion{animation-duration:3.1s!important}
  .runner-main,.runner-ghost-a,.runner-ghost-b{animation-duration:3.1s!important}
}

/* V23 — alineació global + secció de ressenyes */
:root{--page-gutter:8vw}
.nav{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
.hero,.section,.cta-section,footer{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
.hero-copy,.about-intro,.about-copy,.services-head,.service-list,.reviews-head,.reviews-shell,.section-head,.location-grid,.cta-inner{min-width:0}

.reviews-section{padding-top:112px;padding-bottom:112px;background:#f8fbfc}
.reviews-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:7vw;align-items:end;padding-bottom:42px;border-bottom:1px solid var(--line)}
.reviews-head>div{max-width:760px}
.reviews-head>p{max-width:510px;margin:0 0 8px auto;color:var(--muted);font-size:17px;line-height:1.7}
.reviews-shell{position:relative;min-height:300px;margin-top:34px;border:1px solid #dbe8ec;border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(239,247,249,.88));overflow:hidden;display:flex;align-items:center;padding:48px 56px}
.reviews-mark{position:absolute;right:52px;top:18px;font-family:"Manrope",sans-serif;font-size:170px;line-height:1;color:#dbe9ed;opacity:.7;user-select:none}
.reviews-empty{position:relative;z-index:2;max-width:650px}
.reviews-badge{display:inline-flex;align-items:center;min-height:28px;padding:0 11px;border-radius:999px;border:1px solid #ccdde3;background:rgba(255,255,255,.76);font-size:10px;letter-spacing:.14em;font-weight:800;color:var(--blue)}
.reviews-empty h3{font-family:"Manrope",sans-serif;font-size:clamp(34px,4vw,54px);letter-spacing:-.045em;line-height:1.05;margin:18px 0 12px;color:var(--deep)}
.reviews-empty p{max-width:600px;margin:0;color:var(--muted);font-size:16px;line-height:1.72}
.reviews-lines{position:absolute;right:0;bottom:0;width:42%;height:100%;opacity:.42;pointer-events:none}
.reviews-lines span{position:absolute;right:-7%;width:95%;height:1px;background:linear-gradient(90deg,transparent,#87aebc,transparent);transform-origin:right center}
.reviews-lines span:nth-child(1){bottom:30%;transform:rotate(-14deg)}
.reviews-lines span:nth-child(2){bottom:43%;transform:rotate(-8deg)}
.reviews-lines span:nth-child(3){bottom:56%;transform:rotate(-2deg)}

@media(max-width:900px){
  .reviews-head{grid-template-columns:1fr;gap:22px;align-items:start}
  .reviews-head>p{margin:0;max-width:620px}
}
@media(max-width:680px){
  :root{--page-gutter:6vw}
  .nav{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
  .hero,.section,.cta-section,footer{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
  .reviews-section{padding-top:80px;padding-bottom:80px}
  .reviews-head{padding-bottom:30px}
  .reviews-shell{min-height:260px;margin-top:26px;padding:34px 26px;border-radius:22px}
  .reviews-mark{font-size:118px;right:20px;top:18px}
  .reviews-lines{width:58%;opacity:.28}
}

/* V24 · Ressenyes amb enviament */
.reviews-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:34px}
.review-card{min-height:260px;border:1px solid #dbe8ec;border-radius:26px;padding:30px;background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(244,249,250,.9));display:flex;flex-direction:column;justify-content:space-between;transition:transform .55s cubic-bezier(.22,1,.36,1),border-color .4s ease,box-shadow .4s ease}
.review-card-soft{background:linear-gradient(145deg,#eef6f7,#f8fbfb)}
.review-card:hover{transform:translateY(-4px);border-color:#c5dce2;box-shadow:0 18px 45px rgba(22,65,78,.07)}
.review-top{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.review-stars{font-size:18px;letter-spacing:3px;color:#2a6475}
.review-status{font-size:10px;font-weight:800;letter-spacing:.13em;color:#6b838b}
.review-quote{font-family:"Manrope",sans-serif;font-size:clamp(20px,2.1vw,27px);line-height:1.35;letter-spacing:-.025em;color:var(--deep);margin:32px 0}
.review-author{display:flex;flex-direction:column;gap:4px;color:var(--muted);font-size:13px}
.review-author strong{color:var(--deep);font-size:14px}
.review-submit{margin-top:22px;border-radius:28px;background:var(--deep);color:#fff;padding:clamp(30px,5vw,58px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(34px,7vw,90px);align-items:start;overflow:hidden;position:relative}
.review-submit:before{content:"";position:absolute;width:280px;height:280px;border:1px solid rgba(255,255,255,.08);border-radius:50%;right:-90px;top:-120px;box-shadow:0 0 0 45px rgba(255,255,255,.025),0 0 0 90px rgba(255,255,255,.015)}
.review-submit-copy,.review-form{position:relative;z-index:1;min-width:0}
.review-submit h3{font-family:"Manrope",sans-serif;font-size:clamp(34px,4vw,56px);letter-spacing:-.05em;line-height:1.03;margin:18px 0 16px}
.review-submit-copy>p{color:rgba(255,255,255,.72);line-height:1.65;max-width:540px}
.review-privacy{font-size:13px!important;color:rgba(255,255,255,.52)!important;margin-top:18px}
.review-form{display:grid;gap:18px}
.review-field{display:grid;gap:8px}
.review-field label,.review-rating legend{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.review-field input,.review-field textarea{width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);color:#fff;border-radius:14px;padding:14px 15px;font:inherit;outline:none;transition:border-color .25s ease,background .25s ease}
.review-field textarea{resize:vertical;min-height:130px}
.review-field input::placeholder,.review-field textarea::placeholder{color:rgba(255,255,255,.38)}
.review-field input:focus,.review-field textarea:focus{border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.1)}
.review-rating{border:0;padding:0;margin:0;display:grid;gap:8px}
.star-input{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:5px;width:max-content}
.star-input input{position:absolute;opacity:0;pointer-events:none}
.star-input label{font-size:31px;line-height:1;color:rgba(255,255,255,.22);cursor:pointer;transition:color .2s ease,transform .2s ease}
.star-input label:hover,.star-input label:hover~label,.star-input input:checked~label{color:#fff}
.star-input label:hover{transform:translateY(-2px)}
.review-consent{display:flex;align-items:flex-start;gap:11px;color:rgba(255,255,255,.66);font-size:13px;line-height:1.45;cursor:pointer}
.review-consent input{margin-top:3px;accent-color:#fff}
.review-send{justify-self:start;border:0;cursor:pointer}
.review-form-note{min-height:18px;margin:0;color:rgba(255,255,255,.72);font-size:12px}
@media(max-width:900px){.reviews-grid,.review-submit{grid-template-columns:1fr}.review-submit{gap:32px}.review-card{min-height:230px}}
@media(max-width:560px){.reviews-grid{gap:14px;margin-top:26px}.review-card{padding:22px;border-radius:21px}.review-quote{font-size:20px;margin:25px 0}.review-submit{padding:28px 22px;border-radius:22px}.review-submit h3{font-size:35px}.review-send{width:100%;justify-content:center}.star-input label{font-size:29px}}
\n\n/* V26 · Tarifes + ordre editorial final */\n.pricing-section{padding-top:112px;padding-bottom:112px;background:#fff}\n.pricing-head{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(280px,.88fr);gap:7vw;align-items:end;padding-bottom:42px;border-bottom:1px solid var(--line)}\n.pricing-head>div{max-width:780px}\n.pricing-head h2{margin-bottom:0}\n.pricing-head>p{max-width:520px;margin:0 0 8px auto;color:var(--muted);font-size:17px;line-height:1.7}\n.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:34px}\n.price-card{position:relative;display:flex;flex-direction:column;min-height:320px;padding:32px;border:1px solid #dbe6e9;border-radius:26px;background:#fbfdfd;overflow:hidden;transition:transform .55s cubic-bezier(.22,1,.36,1),border-color .4s ease,box-shadow .4s ease}\n.price-card:after{content:"";position:absolute;width:180px;height:180px;border:1px solid rgba(41,111,132,.09);border-radius:50%;right:-84px;top:-84px;box-shadow:0 0 0 34px rgba(41,111,132,.025)}\n.price-card-featured{background:linear-gradient(145deg,#0d3445,#143f50);border-color:#0d3445;color:#fff}\n.price-card-featured:after{border-color:rgba(255,255,255,.12);box-shadow:0 0 0 34px rgba(255,255,255,.025)}\n.price-card:hover{transform:translateY(-5px);border-color:#bfd4da;box-shadow:0 18px 46px rgba(22,65,78,.07)}\n.price-card-featured:hover{border-color:#0d3445}\n.price-card-top{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}\n.price-kicker{font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--blue)}\n.price-card-featured .price-kicker{color:rgba(255,255,255,.72)}\n.price-badge{font-size:9px;letter-spacing:.12em;font-weight:800;border:1px solid rgba(255,255,255,.24);border-radius:999px;padding:7px 9px;color:#fff}\n.price-card h3{position:relative;z-index:1;font-family:"Manrope",sans-serif;font-size:clamp(27px,3vw,39px);letter-spacing:-.04em;line-height:1.06;margin:30px 0 14px;color:var(--deep)}\n.price-card-featured h3{color:#fff}\n.price-desc{position:relative;z-index:1;color:var(--muted);line-height:1.65;max-width:560px;margin:0 0 28px}\n.price-card-featured .price-desc{color:rgba(255,255,255,.68)}\n.price-line{position:relative;z-index:1;display:flex;align-items:baseline;gap:12px;margin-top:auto;padding-top:24px;border-top:1px solid #dde7ea}\n.price-card-featured .price-line{border-color:rgba(255,255,255,.14)}\n.price-line strong{font-family:"Manrope",sans-serif;font-size:clamp(42px,5vw,66px);letter-spacing:-.06em;line-height:1;color:var(--deep)}\n.price-card-featured .price-line strong{color:#fff}\n.price-line span{font-size:13px;color:var(--muted)}\n.price-card-featured .price-line span{color:rgba(255,255,255,.58)}\n.price-card .text-link{position:relative;z-index:1;margin-top:24px;align-self:flex-start}\n.price-card-featured .text-link{color:#fff}\n.pricing-note{max-width:760px;margin:22px 0 0;color:var(--muted);font-size:13px;line-height:1.6}\n@media(max-width:900px){.pricing-head{grid-template-columns:1fr;gap:22px;align-items:start}.pricing-head>p{margin:0}.pricing-grid{grid-template-columns:1fr 1fr}}\n@media(max-width:680px){.pricing-section{padding-top:80px;padding-bottom:80px}.pricing-head{padding-bottom:30px}.pricing-grid{grid-template-columns:1fr;gap:14px;margin-top:26px}.price-card{min-height:0;padding:25px 22px;border-radius:22px}.price-card h3{margin-top:24px}.price-line strong{font-size:48px}}\n
/* V27 · Taula de tarifes editorial */
.rates-table{margin-top:34px;border-top:1px solid #cad9de;border-bottom:1px solid #cad9de}
.rates-row{display:grid;grid-template-columns:minmax(0,1.7fr) .55fr .48fr .65fr;gap:24px;align-items:center;padding:25px 10px;border-top:1px solid #e0e9ec;transition:background .35s ease,transform .35s ease}
.rates-row:first-child{border-top:0}.rates-head{padding-top:13px;padding-bottom:13px;color:#6c7e85;font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.rates-row:not(.rates-head):hover{background:#f7fafb;transform:translateX(3px)}
.rates-row>div:first-child{display:flex;flex-direction:column;align-items:flex-start;gap:5px}.rate-kicker{font-size:9px;font-weight:800;letter-spacing:.13em;color:var(--blue)}
.rates-row strong{font-family:"Manrope",sans-serif;font-size:clamp(20px,2vw,28px);letter-spacing:-.035em;color:var(--deep)}.rates-row small{font-size:13px;line-height:1.5;color:var(--muted)}
.rate-duration{font-size:14px;color:#60747c}.rate-price{font-family:"Manrope",sans-serif;font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.055em;color:var(--deep)}
.rates-row .text-link{justify-self:end;white-space:nowrap}.rates-featured{background:linear-gradient(90deg,rgba(41,111,132,.055),transparent 60%)}
.rates-extras{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}.rates-extras>div{display:flex;gap:16px;padding:22px 24px;border:1px solid #dce7ea;border-radius:18px;background:#fbfdfd}.rate-extra-icon{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:50%;background:#eaf3f5;color:var(--blue);font-weight:800}.rates-extras strong{display:block;margin-bottom:5px;color:var(--deep)}.rates-extras p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}
@media(max-width:800px){.rates-head{display:none}.rates-row{grid-template-columns:1fr auto;gap:13px 18px;padding:24px 4px}.rates-row>div:first-child{grid-column:1/-1}.rate-duration{align-self:end}.rate-price{text-align:right}.rates-row .text-link{grid-column:1/-1;justify-self:start;margin-top:2px}.rates-extras{grid-template-columns:1fr}}

/* V28 · Tarifes simplificades */
.pricing-head-simple{display:block;max-width:none;padding-bottom:28px}
.pricing-head-simple h2{margin:0}
@media(max-width:680px){.pricing-head-simple{padding-bottom:24px}}

/* V30 — accions de tarifes */
.rate-actions{display:flex!important;flex-direction:column!important;align-items:flex-end!important;gap:7px!important;justify-self:end}
.rate-actions .text-link{justify-self:auto!important}
@media(max-width:800px){.rate-actions{grid-column:1/-1;align-items:flex-start!important;justify-self:start;margin-top:2px}}