/* COMMUNION SERIES — V5 */
:root{
  --sky:#b7d9ec;
  --sky2:#dcecf4;
  --orange:#f15111;
  --paper:#fbfbf7;
  --ink:#26393f;
  --soft:#efe7dc;
  --line:rgba(38,57,63,.16);
  --max:1440px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.5;
}
a{color:inherit}
.site-header{
  position:sticky;top:0;z-index:30;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:start;
  gap:2rem;
  padding:1.4rem 4vw 1rem;
  background:rgba(251,251,247,.93);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.brand{
  color:var(--orange);
  text-decoration:none;
  font-family:Arial,Helvetica,sans-serif;
  font-size:1.02rem;
  line-height:.92;
  letter-spacing:-.035em;
}
.nav{
  justify-self:center;
  display:flex;
  gap:2rem;
  padding-top:.3rem;
  font-size:.78rem;
  text-transform:uppercase;
}
.nav a{text-decoration:none}
.nav a:hover{color:var(--orange)}
.lang-switch{
  display:flex;gap:.5rem;align-items:center;
  color:var(--orange);
  font-size:.78rem;
  padding-top:.3rem;
}
.lang-btn{
  border:0;background:none;padding:0;
  font:inherit;color:inherit;cursor:pointer;
}
.lang-btn.active{text-decoration:underline;text-underline-offset:.3rem}

.hero{
  position:relative;
  overflow:hidden;
  min-height:78vh;
  background:var(--sky);
  display:flex;
  align-items:center;
  padding:8rem max(4vw,calc((100vw - var(--max))/2 + 4vw)) 6rem;
}
.hero-copy{position:relative;z-index:4;max-width:610px}
h1,h2,h3{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
  line-height:.98;
}
h1{
  margin:0 0 1.7rem;
  font-size:clamp(3.8rem,6.5vw,7.6rem);
  letter-spacing:-.055em;
}
h2{
  margin:0 0 1.3rem;
  font-size:clamp(2.7rem,4.6vw,5.3rem);
  letter-spacing:-.045em;
}
h3{font-size:1.55rem;margin:2rem 0 .6rem}
.lead{font-size:clamp(1.05rem,1.5vw,1.35rem);max-width:560px}
.hero-meta{
  color:var(--orange);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.3rem,2vw,2rem);
  margin-top:1.2rem;
}
.hero-figure{
  position:absolute;
  z-index:1;
  background:rgba(251,251,247,.92);
  filter:blur(.2px);
}
.figure-a{
  width:36vw;height:48vw;
  right:25vw;bottom:-11vw;
  border-radius:45% 55% 55% 45% / 30% 38% 62% 70%;
  transform:rotate(-15deg);
}
.figure-b{
  width:34vw;height:29vw;
  right:-4vw;top:8vw;
  border-radius:58% 42% 48% 52% / 42% 48% 52% 58%;
  transform:rotate(10deg);
}
.hero-sun{
  position:absolute;right:17vw;top:7vw;
  width:7.5vw;height:7.5vw;min-width:72px;min-height:72px;
  background:var(--orange);border-radius:50%;z-index:2;
}
.floating-words{
  position:absolute;inset:0;z-index:5;pointer-events:none;
}
.fw{
  position:absolute;
  color:var(--orange);
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:clamp(1.7rem,3vw,3.4rem);
  animation:drift 8s ease-in-out infinite;
}
.fw1{right:42vw;bottom:2.5rem}
.fw2{right:25vw;bottom:5rem;animation-delay:1.5s}
.fw3{right:5vw;bottom:2.5rem;animation-delay:3s}
@keyframes drift{
  0%,100%{transform:translate(0,0) rotate(0deg)}
  25%{transform:translate(10px,-8px) rotate(-1deg)}
  50%{transform:translate(-5px,7px) rotate(.7deg)}
  75%{transform:translate(7px,-2px) rotate(-.4deg)}
}

.section{
  max-width:var(--max);
  margin:auto;
  padding:6.5rem 4vw;
}
.kicker{
  color:var(--orange);
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:.78rem;
  margin:0 0 1.1rem;
}
.philosophy{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:4rem;
  align-items:start;
}
.philosophy-copy p{max-width:690px;font-size:1.05rem}
.philosophy-art{
  min-height:360px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,#c6b9a5,#efe6d7 45%,#b8ab98);
}
.philosophy-art .shadow{
  position:absolute;inset:-20%;
  background:
    radial-gradient(ellipse at 35% 25%,rgba(70,60,45,.28),transparent 26%),
    radial-gradient(ellipse at 70% 35%,rgba(70,60,45,.24),transparent 22%),
    radial-gradient(ellipse at 55% 75%,rgba(70,60,45,.22),transparent 24%);
  filter:blur(20px);
  transform:rotate(-10deg);
}
.art-words{
  position:absolute;right:2.5rem;bottom:2rem;
  color:var(--orange);
  font-size:1.1rem;
  line-height:1.35;
  letter-spacing:.1em;
}
.practice-strip{grid-column:1/-1;margin-top:1rem}
.practice-title{
  color:var(--orange);
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:.78rem;
  margin:0 0 .5rem;
}
.practice-words{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.5rem,2.5vw,2.6rem);
  line-height:1.6;
}

.offers{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.offer{
  min-height:470px;
  padding:4rem 4.5vw;
  position:relative;
  overflow:hidden;
}
.offer-online{background:#f7eee4}
.offer-bern{background:var(--sky2)}
.offer p{max-width:600px;position:relative;z-index:2}
.offer h2{font-size:clamp(2.8rem,4.5vw,5.1rem);position:relative;z-index:2}
.pill{
  display:inline-block;
  margin-top:1.3rem;
  background:var(--orange);
  color:white;
  padding:.9rem 1.45rem;
  border-radius:999px;
  text-decoration:none;
  text-transform:uppercase;
  font-size:.77rem;
  letter-spacing:.05em;
  position:relative;z-index:3;
}
.blob{position:absolute;border-radius:50%;opacity:.7}
.blob-orange{width:220px;height:220px;background:#f7ae6d;right:-50px;bottom:-70px}
.blob-blue{width:240px;height:290px;background:#8fc4e4;right:-70px;bottom:-80px;transform:rotate(-22deg)}

.about{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:5rem;
  align-items:start;
}
.about-photo{
  min-height:640px;
  background:var(--sky);
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
}
.about-photo:before,.about-photo:after{
  content:"";position:absolute;background:rgba(251,251,247,.82);border-radius:50%;
}
.about-photo:before{width:68%;height:45%;left:-12%;top:10%}
.about-photo:after{width:62%;height:50%;right:-10%;bottom:7%}
.about-photo span{position:relative;z-index:2;color:var(--orange);font-size:.75rem;letter-spacing:.15em}
.about-copy>p{max-width:700px}
details{margin-top:2rem;border-top:1px solid var(--line)}
summary{
  cursor:pointer;list-style:none;
  padding:1.25rem 0;
  border-bottom:1px solid var(--line);
  color:var(--orange);
}
summary::-webkit-details-marker{display:none}
.details-content{padding:1rem 0 2rem}
.details-content p{max-width:760px}
.timeline{
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;
  margin-top:2.5rem;padding-top:1rem;border-top:1px solid var(--line);
}

.location-contact{
  max-width:none;
  display:grid;
  grid-template-columns:.85fr 1.1fr .85fr;
  gap:2rem;
  align-items:stretch;
  border-top:1px solid var(--line);
}
.location-copy,.contact-copy{padding:2rem 0}
.location-copy h2{color:var(--orange);font-size:clamp(4.5rem,7vw,8.5rem)}
.address{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.8rem,2.6vw,3rem);
  margin:.5rem 0;
}
.outline-btn{
  display:inline-block;
  margin-top:1.4rem;
  padding:.8rem 1.2rem;
  border:1px solid var(--orange);
  border-radius:999px;
  color:var(--orange);
  text-decoration:none;
  text-transform:uppercase;
  font-size:.74rem;
}
.map-wrap{min-height:420px}
.map-wrap iframe{width:100%;height:100%;min-height:420px;border:0;filter:saturate(.75) contrast(.95)}
.contact-copy{padding-left:1rem}
.contact-copy h2{color:var(--orange)}
.contact-list{display:flex;flex-direction:column;gap:1rem;margin-top:1.2rem}
.contact-list a{text-decoration:none}
.contact-list .wa{color:var(--orange)}

footer{
  max-width:var(--max);
  margin:auto;
  padding:1.4rem 4vw 2rem;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  gap:2rem;
  align-items:center;
  font-size:.83rem;
}
footer span:nth-child(2){justify-self:center}
footer .footer-phrase{
  color:var(--orange);
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:1rem;
}

@media(max-width:1000px){
  .nav{display:none}
  .site-header{grid-template-columns:auto 1fr auto}
  .hero{min-height:75vh}
  .figure-a{right:8vw;width:52vw;height:60vw}
  .figure-b{right:-10vw;width:48vw;height:42vw}
  .fw1{right:55vw}.fw2{right:30vw}.fw3{right:4vw}
  .philosophy,.about,.location-contact{grid-template-columns:1fr}
  .location-copy,.contact-copy{padding:0}
  .map-wrap{min-height:360px}
  footer{grid-template-columns:1fr 1fr;gap:1rem}
  footer span:nth-child(2){justify-self:start}
}
@media(max-width:760px){
  .brand{font-size:.95rem}
  .site-header{padding-top:1rem}
  .hero{padding-top:6rem;padding-bottom:8rem}
  .hero-copy{max-width:90%}
  .hero-sun{right:10vw;top:18vw}
  .figure-a{right:-10vw;width:72vw;height:88vw}
  .figure-b{right:-22vw;top:24vw;width:62vw;height:54vw}
  .fw{font-size:1.5rem}
  .fw1{left:8vw;right:auto;bottom:2rem}
  .fw2{left:39vw;right:auto;bottom:4rem}
  .fw3{right:4vw;bottom:2rem}
  .section{padding:4.5rem 5vw}
  .philosophy{gap:2rem}
  .offers{grid-template-columns:1fr}
  .offer{min-height:420px}
  .about{gap:2.5rem}
  .about-photo{min-height:480px}
  .timeline{grid-template-columns:1fr}
  .location-contact{padding-top:4.5rem;padding-bottom:4.5rem}
  footer{grid-template-columns:1fr;font-size:.8rem}
  footer span:nth-child(2){justify-self:start}
}
@media(prefers-reduced-motion:reduce){
  .fw{animation:none!important}
}


/* V5.2 — movimiento refinado de las palabras naranjas */
.fw{
  animation-duration:7.5s;
  animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
  will-change:transform;
}
.fw1{animation-delay:0s}
.fw2{animation-delay:1.35s}
.fw3{animation-delay:2.7s}

@keyframes drift{
  0%,100%{transform:translate3d(0,0,0) rotate(0deg)}
  20%{transform:translate3d(7px,-8px,0) rotate(-0.8deg)}
  45%{transform:translate3d(-5px,5px,0) rotate(0.5deg)}
  70%{transform:translate3d(8px,3px,0) rotate(-0.4deg)}
  88%{transform:translate3d(-2px,-4px,0) rotate(0.25deg)}
}


/* V5.3 — palabras naranjas con apariencia manuscrita */
.fw{
  font-family:"Segoe Print","Bradley Hand","Brush Script MT","Comic Sans MS",cursive;
  font-style:normal;
  font-weight:400;
  letter-spacing:.015em;
  text-transform:none;
  line-height:1;
  transform-origin:center;
}

.fw1{
  rotate:-5deg;
}

.fw2{
  rotate:3deg;
}

.fw3{
  rotate:-2deg;
}

/* Un poco más de gesto orgánico, como una anotación hecha a mano */
@keyframes drift{
  0%,100%{transform:translate3d(0,0,0) rotate(0deg)}
  20%{transform:translate3d(8px,-9px,0) rotate(-1.2deg)}
  45%{transform:translate3d(-6px,5px,0) rotate(.8deg)}
  70%{transform:translate3d(9px,3px,0) rotate(-.7deg)}
  88%{transform:translate3d(-3px,-5px,0) rotate(.45deg)}
}


/* V5.4 — iconos de contacto al pie */
.footer-social{
  grid-column:1/-1;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:1.1rem;
  padding-top:1.15rem;
  margin-top:.35rem;
  border-top:1px solid var(--line);
}
.footer-social a{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid var(--orange);
  border-radius:50%;
  color:var(--orange);
  text-decoration:none;
  transition:transform .25s ease, background-color .25s ease, color .25s ease;
}
.footer-social a:hover{
  transform:translateY(-3px);
  background:var(--orange);
  color:var(--paper);
}
.contact-icon{
  font-family:Arial,Helvetica,sans-serif;
  font-size:1.08rem;
  line-height:1;
}
.whatsapp-icon{
  font-size:1.45rem;
  line-height:.7;
}
.instagram-icon{
  font-size:1.45rem;
}
@media(max-width:760px){
  .footer-social{
    justify-content:flex-start;
    gap:.85rem;
    padding-top:1rem;
  }
}


/* V5.5 — ajustes solicitados */
.brand{
  font-size:.86rem !important;
  line-height:.94;
  letter-spacing:-.02em;
}

/* Iconos junto a los datos de contacto */
.contact-list-inline{
  gap:.85rem;
}
.contact-list-inline a{
  display:flex;
  align-items:center;
  gap:.7rem;
  width:fit-content;
}
.inline-icon{
  flex:0 0 auto;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid var(--orange);
  border-radius:50%;
  color:var(--orange);
  font-family:Arial,Helvetica,sans-serif;
  font-size:.78rem;
  line-height:1;
}
.contact-list-inline a:hover .inline-icon{
  background:var(--orange);
  color:var(--paper);
}

/* El bloque de iconos independiente del footer ya no se muestra */
.footer-social{display:none!important}

@media(max-width:760px){
  .brand{font-size:.82rem !important}
}


/* V5.6 — ajustes solicitados */
/* Las palabras móviles vuelven a la tipografía anterior: serif, ligera y elegante. */
.fw{
  font-family:Georgia,"Times New Roman",serif !important;
  font-style:italic !important;
  font-weight:400;
  letter-spacing:0;
  text-transform:none;
}

/* Palabras que acompañan la práctica en naranja */
.practice-words-orange{
  color:var(--orange);
}


/* V5.7 — imágenes, Yoga en español, testimonios y formulario */
.language-badge{
  display:inline-block;
  margin-top:1rem;
  padding:.5rem .8rem;
  border:1px solid var(--orange);
  border-radius:999px;
  color:var(--orange);
  font-size:.72rem;
  letter-spacing:.11em;
  font-weight:600;
}

.bern-highlight{font-weight:600}
.bern-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.75rem;
  margin-top:2rem;
  position:relative;
  z-index:2;
}
.bern-gallery figure{margin:0;overflow:hidden;min-height:210px}
.bern-gallery img{
  display:block;width:100%;height:100%;min-height:210px;
  object-fit:cover;
}

.about-photo{background:#eee7df;display:block}
.about-photo:before,.about-photo:after,.about-photo span{display:none!important}
.about-photo img{
  width:100%;height:100%;min-height:640px;
  object-fit:cover;
  object-position:center center;
  display:block;
  filter:saturate(.88) contrast(.97);
}

.testimonials{
  border-top:1px solid var(--line);
  background:var(--paper);
  min-height:320px;
}
.testimonials h2{
  max-width:760px;
  color:var(--orange);
}
.testimonial-space{
  margin-top:2rem;
  min-height:80px;
  border-top:1px solid var(--line);
}

.contact-form-wrap{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:140px 1fr;
  margin-top:2rem;
  border-top:1px solid var(--line);
  background:#f5f2ef;
}
.contact-form-title{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(2.7rem,4.5vw,5rem);
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2rem 1rem;
}
.contact-form{
  background:var(--paper);
  padding:3rem 5vw;
  display:flex;
  flex-direction:column;
  gap:1.6rem;
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.contact-form label{display:flex;flex-direction:column;gap:.55rem;font-size:.92rem}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea{
  border:0;
  border-bottom:1px solid var(--ink);
  background:transparent;
  padding:.45rem 0;
  font:inherit;
  color:var(--ink);
  outline:none;
}
.contact-form textarea{resize:vertical;min-height:130px}
.privacy-check{
  flex-direction:row!important;
  align-items:flex-start;
  gap:.75rem!important;
}
.privacy-check input{margin-top:.15rem;width:18px;height:18px}
.contact-form button{
  width:fit-content;
  min-width:210px;
  padding:.9rem 1.4rem;
  border:0;
  background:var(--ink);
  color:white;
  cursor:pointer;
  font:inherit;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.form-note{font-size:.75rem;opacity:.65;max-width:600px}

@media(max-width:760px){
  .bern-gallery{grid-template-columns:1fr}
  .bern-gallery figure,.bern-gallery img{min-height:230px}
  .about-photo img{min-height:480px}
  .contact-form-wrap{grid-template-columns:1fr}
  .contact-form-title{
    writing-mode:horizontal-tb;
    transform:none;
    justify-content:flex-start;
    font-size:2.4rem;
    padding:1.5rem 5vw .5rem;
  }
  .contact-form{padding:2rem 5vw 3rem}
  .form-row{grid-template-columns:1fr}
}


/* V5.8 — ajustes visuales */

/* La foto temporal del salón fue retirada. */
.bern-gallery{display:none!important}

/* Sobre Ana: foto ORIGINAL con corrección tonal sutil, sin alterar el rostro. */
.about-photo{
  min-height:620px;
  overflow:hidden;
  background:#e9e1d7;
}
.about-photo img{
  width:100%;
  height:100%;
  min-height:620px;
  object-fit:cover;
  object-position:50% 43%;
  display:block;
  filter:sepia(.12) saturate(.78) contrast(.96) brightness(1.035);
}

/* Aare como fondo de toda la ubicación final. */
.location-contact{
  position:relative;
  isolation:isolate;
  background:
    linear-gradient(rgba(251,252,249,.77),rgba(251,252,249,.77)),
    url("assets/aare-bern.png") center 48% / cover no-repeat;
  padding-top:5rem;
  padding-bottom:5rem;
}
.location-contact::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(251,252,249,.32),rgba(251,252,249,.10));
}
.location-copy,.contact-copy{
  background:rgba(251,252,249,.72);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  padding:2rem;
  border-radius:22px;
}
.map-wrap{
  min-height:420px;
  overflow:hidden;
  border-radius:22px;
  box-shadow:0 18px 50px rgba(41,50,56,.12);
}
.map-wrap iframe{min-height:420px}

/* Formulario moderno: ancho completo, horizontal, liviano y centrado. */
.contact-form-wrap{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:minmax(220px,.72fr) minmax(0,1.5fr);
  gap:clamp(2rem,5vw,5rem);
  align-items:start;
  margin-top:3rem;
  padding:clamp(1.6rem,3vw,3rem);
  border:1px solid rgba(255,255,255,.65);
  border-radius:28px;
  background:rgba(251,252,249,.90);
  box-shadow:0 22px 70px rgba(41,50,56,.14);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.contact-form-intro{padding:.3rem 0}
.contact-form-intro h2{
  margin:.15rem 0 1rem;
  color:var(--orange);
  font-size:clamp(2.6rem,4vw,4.8rem);
}
.contact-form-intro p{max-width:430px}
.contact-form{
  padding:0;
  background:transparent;
  display:flex;
  flex-direction:column;
  gap:1.15rem;
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.contact-form label{gap:.45rem;font-size:.78rem;letter-spacing:.03em}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid rgba(41,50,56,.14);
  border-radius:14px;
  background:rgba(255,255,255,.82);
  padding:.9rem 1rem;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.contact-form textarea{min-height:130px}
.contact-form input:focus,.contact-form textarea:focus{
  border-color:var(--orange);
  box-shadow:0 0 0 3px rgba(241,81,17,.10);
  background:#fff;
}
.form-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  margin-top:.25rem;
}
.privacy-check{
  flex-direction:row!important;
  align-items:center!important;
  max-width:470px;
  font-size:.72rem!important;
}
.contact-form button{
  flex:0 0 auto;
  min-width:160px;
  border-radius:999px;
  background:var(--orange);
  padding:.9rem 1.5rem;
  transition:transform .2s ease, opacity .2s ease;
}
.contact-form button:hover{transform:translateY(-2px)}
.form-note{display:none!important}

@media(max-width:900px){
  .contact-form-wrap{grid-template-columns:1fr}
}
@media(max-width:760px){
  .about-photo,.about-photo img{min-height:500px}
  .about-photo img{object-position:50% 40%}
  .location-contact{background-position:56% center}
  .location-copy,.contact-copy{padding:1.4rem}
  .contact-form-wrap{padding:1.4rem;border-radius:20px}
  .form-row{grid-template-columns:1fr}
  .form-bottom{align-items:flex-start;flex-direction:column}
  .contact-form button{width:100%}
}


/* V5.9 — fotografías reales */
.about-photo{
  display:block!important;
  position:relative;
  min-height:620px!important;
  overflow:hidden;
  background:#e9e1d7;
}
.about-photo img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:620px!important;
  object-fit:cover!important;
  object-position:50% 44%!important;
  filter:none!important;
}

/* Foto real de Yoga junto al Aare */
.bern-real-photo{
  margin:1.8rem 0 1.5rem;
  overflow:hidden;
  border-radius:20px;
  aspect-ratio:4/3;
}
.bern-real-photo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
}

/* Ubicación: foto REAL del Aare como fondo */
.location-contact{
  background:
    linear-gradient(rgba(251,252,249,.76),rgba(251,252,249,.76)),
    url("assets/aare-real.jpg") center center / cover no-repeat!important;
}

@media(max-width:760px){
  .about-photo,.about-photo img{min-height:500px!important}
  .about-photo img{object-position:50% 42%!important}
  .bern-real-photo{aspect-ratio:3/4}
  .bern-real-photo img{object-position:center center}
  .location-contact{background-position:55% center!important}
}


/* V5.10 — agua, retrato, ubicación e iconos */

/* Hero: textura fotográfica del agua del Aare, suave para conservar legibilidad. */
.hero{
  background:
    linear-gradient(rgba(220,236,244,.74),rgba(220,236,244,.72)),
    url("assets/hero-water.jpg") center center / cover no-repeat!important;
}
.hero-figure{opacity:.40}
.hero-sun{opacity:.88}

/* Retrato más contenido y con más aire. */
.about{
  align-items:center;
}
.about-photo{
  min-height:0!important;
  width:82%;
  max-width:430px;
  justify-self:center;
  aspect-ratio:4/5;
  border-radius:24px;
}
.about-photo img{
  min-height:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:50% 43%!important;
  filter:none!important;
}

/* Ubicación */
.walk-distance{
  margin:.25rem 0 1.25rem;
  font-size:.9rem;
  font-weight:600;
}
.location-contact{
  background:
    linear-gradient(rgba(251,252,249,.72),rgba(251,252,249,.72)),
    url("assets/aare-real.jpg") center center / cover no-repeat!important;
}

/* Logos sociales correctos */
.inline-icon{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:24px!important;
  height:24px!important;
  border:0!important;
  border-radius:0!important;
  font-size:0!important;
  color:var(--ink);
}
.social-svg{
  width:21px;
  height:21px;
  display:block;
  fill:currentColor;
}
.contact-list-inline a:hover .social-svg{fill:var(--orange)}

@media(max-width:760px){
  .about-photo{
    width:min(82%,360px);
    max-width:360px;
    aspect-ratio:4/5;
  }
  .about-photo img{min-height:0!important}
  .hero{background-position:center center!important}
}


/* V5.11 — portada más clara + foto aprobada de Ana */

/* El agua queda como textura muy suave; el mensaje vuelve a dominar. */
.hero{
  background:
    linear-gradient(rgba(220,236,244,.91),rgba(220,236,244,.94)),
    url("assets/hero-water.jpg") center center / cover no-repeat!important;
}
.hero-figure{opacity:.18!important}
.hero-sun{opacity:.70!important}

.hero-main-title{
  max-width:900px;
  margin-bottom:.7rem!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:clamp(3.2rem,7.5vw,7.4rem)!important;
  line-height:.86!important;
  letter-spacing:-.055em!important;
  font-weight:700!important;
  color:var(--orange)!important;
  text-transform:uppercase;
}
.hero-main-title span{
  color:var(--ink);
  font-weight:500;
}
.hero-schedule{
  margin:1rem 0 0;
  font-size:.83rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--ink);
}

/* Foto aprobada: más pequeña y con aire alrededor. */
.about-photo{
  width:76%!important;
  max-width:390px!important;
  aspect-ratio:4/5!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
.about-photo img{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  object-fit:cover!important;
  object-position:50% 46%!important;
  filter:none!important;
}

@media(max-width:760px){
  .hero{
    background:
      linear-gradient(rgba(220,236,244,.94),rgba(220,236,244,.96)),
      url("assets/hero-water.jpg") center center / cover no-repeat!important;
  }
  .hero-main-title{
    font-size:clamp(2.8rem,14vw,4.8rem)!important;
    line-height:.88!important;
  }
  .hero-schedule{
    max-width:310px;
    line-height:1.6;
  }
  .about-photo{
    width:min(78%,340px)!important;
  }
}


/* V5.12 — ajustes finales de portada, reservas y contacto */
.hero-main-title{
  text-transform:none!important;
  font-weight:500!important;
  letter-spacing:-.045em!important;
}
.hero-main-title::first-line{
  /* casing is controlled in HTML; keep typography natural */
}
.hero-main-title span{
  display:inline-block;
  margin-top:.5rem;
  font-size:.34em!important;
  line-height:1.1!important;
  letter-spacing:.01em!important;
  font-weight:400!important;
  text-transform:none!important;
}
.reserve-class{
  display:table!important;
  margin-top:1.7rem!important;
}
.contact-svg{
  width:22px;
  height:22px;
  display:inline-block;
  vertical-align:middle;
  margin-right:.65rem;
  fill:currentColor;
  flex:0 0 auto;
}
.contact-card a,
.contact-item a,
.contact-links a{
  text-decoration:none;
}
@media(max-width:760px){
  .hero-main-title span{
    font-size:.38em!important;
  }
}


/* V5.13 — recuperar la tipografía editorial original de portada */
.hero-main-title{
  font-family:Georgia,"Times New Roman",serif!important;
  font-weight:400!important;
  letter-spacing:-.055em!important;
  text-transform:none!important;
}
.hero-main-title span{
  font-family:Georgia,"Times New Roman",serif!important;
  font-weight:400!important;
  font-size:.34em!important;
  letter-spacing:-.02em!important;
}


/* V5.14 — cierre de diseño */
.hero{
  background:
    linear-gradient(rgba(220,236,244,.945),rgba(220,236,244,.955)),
    url("assets/hero-water.jpg") center center / cover no-repeat!important;
}
.hero-main-title{
  max-width:1000px!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(3.5rem,8vw,7.8rem)!important;
  line-height:.88!important;
  font-weight:400!important;
  letter-spacing:-.06em!important;
  color:var(--orange)!important;
}
.hero-main-title span{
  display:inline-block!important;
  max-width:720px;
  margin-top:.72rem!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:.30em!important;
  line-height:1.05!important;
  font-weight:400!important;
  letter-spacing:-.025em!important;
  color:var(--ink)!important;
}
.hero-schedule{
  margin-top:1.35rem!important;
  font-size:.78rem!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
  font-weight:600!important;
}
/* Recuperamos el carácter limpio pedido para las palabras móviles. */
.fw{
  font-family:Arial,Helvetica,sans-serif!important;
  font-style:normal!important;
  font-weight:600!important;
  text-transform:uppercase!important;
  letter-spacing:.10em!important;
  font-size:clamp(.85rem,1.55vw,1.35rem)!important;
}
.practice-words-orange{
  font-family:Arial,Helvetica,sans-serif!important;
  text-transform:uppercase!important;
  letter-spacing:.075em!important;
  font-weight:600!important;
}
.bern-cta{
  margin-top:1.7rem!important;
  background:var(--orange)!important;
  color:var(--paper)!important;
  border-color:var(--orange)!important;
}
.bern-cta:hover{transform:translateY(-2px)}
.bern-panorama{
  position:relative;
  width:min(1180px,calc(100% - 3rem));
  margin:1.5rem auto 6rem;
  border-radius:28px;
  overflow:hidden;
  aspect-ratio:16/7;
  background:var(--blue-soft);
}
.bern-panorama img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.bern-panorama::after{
  content:"";position:absolute;inset:0;
  background:rgba(220,236,244,.08);pointer-events:none;
}
.bern-panorama figcaption{
  position:absolute;left:1.2rem;bottom:1rem;
  padding:.45rem .7rem;border-radius:999px;
  background:rgba(251,252,249,.86);
  font:600 .7rem/1 Arial,Helvetica,sans-serif;
  letter-spacing:.11em;text-transform:uppercase;color:var(--ink);
}
.contact-list-inline a{
  display:inline-flex!important;
  align-items:center!important;
  gap:.6rem!important;
}
.contact-list-inline .inline-icon{margin:0!important}
.contact-list-inline .social-svg{width:20px;height:20px}
.timeline-v14 p{line-height:1.55}
@media(max-width:760px){
  .hero-main-title{font-size:clamp(3rem,15vw,5rem)!important}
  .hero-main-title span{font-size:.34em!important;max-width:310px}
  .hero-schedule{line-height:1.6!important;max-width:320px}
  .bern-panorama{width:calc(100% - 1.5rem);margin:1rem auto 4rem;aspect-ratio:4/3;border-radius:20px}
  .bern-panorama img{object-position:center center}
}


/* V5.15 FINAL — refinamiento tipográfico y fotografía de Berna */

/* Palabras móviles: volvemos a una serif ligera, delicada y orgánica. */
.fw{
  font-family:Georgia,"Times New Roman",serif!important;
  font-style:italic!important;
  font-weight:400!important;
  text-transform:none!important;
  letter-spacing:.015em!important;
  font-size:clamp(1.35rem,2.25vw,2.45rem)!important;
  opacity:.88;
}

/* Las cinco palabras respiran a lo ancho completo de la sección. */
.practice-strip{
  width:100%;
}
.practice-words-orange{
  width:100%!important;
  display:flex!important;
  justify-content:space-between!important;
  align-items:baseline!important;
  gap:1.25rem!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-style:italic!important;
  font-weight:400!important;
  text-transform:none!important;
  letter-spacing:.005em!important;
  font-size:clamp(1.25rem,2vw,2rem)!important;
  line-height:1.25!important;
  color:var(--orange)!important;
  white-space:nowrap;
}
.practice-words-orange span{display:block}

/* La foto de Berna ocupa el antiguo espacio gráfico de Movimiento / Respiración / Encuentro / Energía. */
.philosophy-art{
  min-height:390px!important;
  background:
    linear-gradient(rgba(41,50,56,.08),rgba(41,50,56,.22)),
    url("assets/bern-philosophy.png") center center / cover no-repeat!important;
  border-radius:26px;
}
.philosophy-art .shadow{display:none!important}
.art-words{
  right:2rem!important;
  bottom:1.8rem!important;
  color:var(--paper)!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(.92rem,1.35vw,1.18rem)!important;
  font-weight:400!important;
  line-height:1.75!important;
  letter-spacing:.12em!important;
  text-shadow:0 1px 14px rgba(20,28,30,.34);
}

/* Perfil de Ana: más pequeño, con más aire alrededor. */
.about-photo{
  width:66%!important;
  max-width:335px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  aspect-ratio:4/5!important;
}
.about-photo img{
  min-height:0!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:50% 46%!important;
}

@media(max-width:900px){
  .practice-words-orange{
    white-space:normal;
    flex-wrap:wrap;
    justify-content:flex-start!important;
    column-gap:2.1rem!important;
    row-gap:.55rem!important;
  }
}
@media(max-width:760px){
  .fw{font-size:clamp(1.15rem,5.4vw,1.65rem)!important}
  .philosophy-art{min-height:320px!important;border-radius:20px}
  .art-words{right:1.2rem!important;bottom:1.1rem!important;font-size:.82rem!important}
  .practice-words-orange{
    font-size:1.18rem!important;
    gap:.45rem 1.5rem!important;
  }
  .about-photo{
    width:min(70%,300px)!important;
    max-width:300px!important;
  }
}


/* V5.16 FINAL — últimos ajustes */

/* La textura real del agua se percibe más, conservando una capa clara
   detrás del texto para mantener la lectura. */
.hero{
  background:
    linear-gradient(90deg,
      rgba(220,236,244,.82) 0%,
      rgba(220,236,244,.74) 48%,
      rgba(220,236,244,.62) 100%),
    url("assets/hero-water.jpg") center center / cover no-repeat !important;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,
    rgba(251,252,249,.18) 0%,
    rgba(251,252,249,.08) 46%,
    rgba(251,252,249,0) 72%);
}
.hero > *{
  position:relative;
  z-index:1;
}

/* Foto de Ana: más pequeña y con la forma orgánica ovalada de la identidad. */
.about-photo{
  width:min(68%,350px)!important;
  max-width:350px!important;
  aspect-ratio:4/5!important;
  border-radius:48% 52% 44% 56% / 55% 43% 57% 45%!important;
  overflow:hidden!important;
  position:relative!important;
  margin-inline:auto!important;
}
.about-photo::after{
  content:"";
  position:absolute;
  inset:8px -10px -8px 10px;
  border:1px solid rgba(241,81,17,.42);
  border-radius:53% 47% 57% 43% / 46% 56% 44% 54%;
  pointer-events:none;
  z-index:2;
}
.about-photo img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:50% 45%!important;
}

@media(max-width:760px){
  .hero{
    background:
      linear-gradient(rgba(220,236,244,.78),rgba(220,236,244,.82)),
      url("assets/hero-water.jpg") center center / cover no-repeat !important;
  }
  .about-photo{
    width:min(72%,300px)!important;
    max-width:300px!important;
  }
}


/* V5.18 — formulario de contacto */
.form-honeypot{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.form-status{
  min-height:1.5em;
  margin:.85rem 0 0;
  font-size:.9rem;
  line-height:1.45;
}
.form-status.success{font-weight:600;}
.form-status.error{font-weight:600;}
.contact-form button[disabled]{
  opacity:.6;
  cursor:wait;
}


/* V5.19 — reservas Momoyoga */
.booking{
  padding-top:clamp(64px,8vw,110px);
  padding-bottom:clamp(64px,8vw,110px);
}
.booking-intro{
  max-width:760px;
  margin:0 auto 38px;
  text-align:center;
}
.booking-intro h2{margin-bottom:16px;}
.booking-intro p:last-child{max-width:650px;margin-inline:auto;}
.momoyoga-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:clamp(18px,3vw,34px);
  background:rgba(255,255,255,.5);
  border-radius:28px 28px 42px 22px / 24px 34px 24px 38px;
}
@media(max-width:760px){
  .momoyoga-wrap{padding:12px;border-radius:20px;}
}
