/* Mobile first. Cambia estos tokens para ajustar la identidad visual. */ :root{
  --ink:#123e43;
  --dark:#0c3035;
  --muted:#536467;
  --accent:#e2ecb6;
  --paper:#fff;
  --soft:#f3f6f5;
  --line:#dce4e2;
  --max:1200px;
  --radius:4px
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:2rem
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  font-size:1rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased
}
a{
  color:inherit;
  text-decoration:none
}
button{
  font:inherit
}
img{
  display:block;
  width:100%;
  height:auto
}
h1,h2,h3,p{
  margin-top:0
}
h1,h2,h3{
  font-weight:400
}
h1,h2{
  font-family:Georgia,'Times New Roman',serif;
  letter-spacing:-.035em;
  line-height:1.12
}
h1{
  font-size:clamp(2.55rem,5vw,4.7rem);
  margin-bottom:1.5rem
}
h2{
  font-size:clamp(2rem,3.4vw,3rem);
  margin-bottom:1.3rem
}
h3{
  font-family:Georgia,'Times New Roman',serif;
  font-size:1.6rem;
  line-height:1.2;
  letter-spacing:-.02em
}
p{
  margin-bottom:1.2rem
}
a:focus-visible,button:focus-visible{
  outline:3px solid #408a91;
  outline-offset:5px
}
a:hover{
  text-decoration:underline;
  text-underline-offset:.25em
}
.container{
  width:min(calc(100% - 2.5rem),var(--max));
  margin-inline:auto
}
.skip{
  position:fixed;
  z-index:30;
  top:-6rem;
  left:1rem;
  background:var(--accent);
  padding:.8rem 1rem;
  color:var(--dark)
}
.skip:focus{
  top:1rem
}
.topbar{
  background:var(--ink);
  color:white;
  font-size:.875rem
}
.topbar .container{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding-block:.6rem
}
.topbar span{
  display:none
}
.topbar a{
  margin-left:auto
}
.header{
  position:relative;
  z-index:10;
  background:white;
  border-bottom:1px solid var(--line)
}
.header-inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:1.1rem;
  padding-block:1rem
}
.brand{
  display:inline-flex;
  flex-direction:column;
  line-height:1;
  text-decoration:none!important
}
.brand>span{
  font-family:Georgia,serif;
  font-size:2.6rem;
  font-weight:bold;
  letter-spacing:-.055em
}
.brand-dot{
  color:#789642
}
.brand small{
  font-size:.75rem;
  letter-spacing:.27em;
  margin-top:.4rem;
  margin-left:.15rem
}
.menu-toggle{
  display:none;
  align-items:center;
  gap:.7rem;
  border:1px solid var(--line);
  padding:.55rem .75rem;
  background:white;
  border-radius:var(--radius);
  color:var(--ink);
  min-height:44px
}
.js .menu-toggle{
  display:flex
}
.menu-lines{
  width:18px;
  height:12px;
  border-block:1.5px solid currentColor;
  position:relative
}
.menu-lines:after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:4px;
  height:1.5px;
  background:currentColor
}
nav#navigation{
  display:flex;
  flex-direction:column;
  width:100%;
  gap:.3rem;
  padding-top:.3rem
}
.js nav#navigation{
  display:none
}
.js nav#navigation.is-open{
  display:flex
}
nav#navigation a{
  padding:.65rem .9rem;
  min-height:44px;
  font-size:.95rem
}
nav#navigation a[aria-current=page]{
  font-weight:bold;
  background:var(--soft)
}
nav#navigation .nav-contact{
  background:var(--ink);
  color:white;
  border-radius:var(--radius);
  text-align:center
}
.eyebrow{
  font-family:Arial,Helvetica,sans-serif;
  font-size:.875rem;
  font-weight:600;
  letter-spacing:.1em;
  line-height:1.5;
  margin-bottom:1.4rem
}
.hero{
  padding-block:2.8rem 2.5rem;
  background:var(--soft)
}
.hero-grid{
  display:grid;
  gap:2rem
}
.hero-copy{
  padding-top:.3rem
}
.hero .intro{
  max-width:32rem
}
.intro{
  font-size:1.1rem;
  line-height:1.7;
  color:var(--muted);
  max-width:42rem
}
.actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:1.3rem;
  margin-top:1.8rem
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:.8rem 1.3rem;
  border:1px solid var(--ink);
  border-radius:var(--radius);
  background:var(--ink);
  color:white;
  font-weight:600;
  font-size:.95rem;
  text-align:center;
  transition:background .15s,color .15s
}
.button:hover{
  background:var(--dark);
  text-decoration:none
}
.button.secondary{
  background:transparent;
  color:var(--ink)
}
.button.secondary:hover{
  background:var(--soft)
}
.text-link{
  font-size:.95rem;
  font-weight:600;
  text-decoration:underline;
  text-underline-offset:.35em;
  text-decoration-thickness:1px;
  display:inline-block;
  padding-block:.4rem
}
.hero-note{
  display:flex;
  align-items:center;
  gap:1rem;
  font-size:.9rem;
  color:var(--muted);
  margin-top:2rem;
  line-height:1.5
}
.note-line{
  height:1px;
  width:40px;
  background:var(--ink)
}
.hero-visual{
  position:relative;
  min-width:0
}
.hero-visual img{
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:var(--radius)
}
.photo-caption{
  display:flex;
  justify-content:space-between;
  gap:.7rem;
  flex-wrap:wrap;
  background:var(--accent);
  padding:.9rem 1.1rem;
  font-size:.95rem;
  font-weight:600
}
.specialties{
  background:var(--ink);
  color:white
}
.specialties .container{
  display:grid;
  grid-template-columns:1fr 1fr;
  text-align:center;
  padding-block:1rem;
  gap:1rem;
  font-size:.8rem;
  letter-spacing:.12em
}
.section{
  padding-block:3.5rem
}
.section-heading{
  display:grid;
  gap:.7rem;
  margin-bottom:1.8rem
}
.section-heading>p{
  color:var(--muted);
  max-width:25rem;
  margin-bottom:0
}
.service-grid{
  display:grid;
  gap:1rem
}
.service-card{
  display:flex;
  flex-direction:column;
  padding:1.8rem 1.4rem;
  border:1px solid var(--line);
  border-radius:var(--radius);
  transition:border-color .15s,background .15s
}
.service-card:hover{
  border-color:#89a5a3;
  background:var(--soft)
}
.service-card h3{
  margin-bottom:.9rem
}
.service-card p{
  font-size:1rem;
  color:var(--muted)
}
.service-card>.text-link{
  margin-top:auto;
  align-self:flex-start
}
.about-strip{
  background:var(--ink);
  color:white;
  padding-block:3.5rem
}
.about-grid{
  display:grid;
  gap:1rem
}
.about-strip .eyebrow{
  color:var(--accent)
}
.about-strip p:not(.eyebrow){
  color:#e1eceb
}
.about-strip .lead{
  font-size:1.15rem
}
.about-strip .text-link{
  color:var(--accent)
}
.audience-grid{
  display:grid;
  gap:1.5rem
}
.audience-card{
  background:var(--soft);
  padding:1.6rem
}
.audience-card .eyebrow{
  display:block;
  font-size:.8rem;
  color:var(--muted)
}
.audience-card h3{
  font-size:1.8rem;
  margin-bottom:1rem
}
.audience-card p{
  color:var(--muted)
}
.contact-band{
  background:var(--accent);
  padding-block:3rem
}
.contact-band-inner{
  display:grid;
  gap:1rem
}
.contact-band h2{
  margin-bottom:.8rem
}
.contact-band .eyebrow{
  margin-bottom:.8rem
}
.contact-band p{
  margin-bottom:0
}
.contact-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:1.1rem
}
.phone-large{
  font-size:1.2rem
}
.footer{
  background:var(--dark);
  color:white;
  padding-top:3rem
}
.footer-grid{
  display:grid;
  gap:2rem
}
.footer .brand-dot{
  color:var(--accent)
}
.footer p{
  color:#bdcece;
  font-size:.95rem;
  margin-block:1.4rem 0
}
.footer h2{
  font:600 .875rem/1.5 Arial,sans-serif;
  letter-spacing:.04em;
  margin-bottom:.9rem
}
.footer-grid>div>a:not(.brand){
  display:block;
  font-size:.95rem;
  color:#e1eceb;
  padding-block:.35rem;
  overflow-wrap:anywhere
}
.footer .footer-local{
  color:var(--accent)
}
.footer-bottom{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem 2rem;
  justify-content:space-between;
  border-top:1px solid #315156;
  margin-top:2.7rem;
  padding-block:1.3rem;
  color:#bdcece;
  font-size:.875rem
}
.detail-hero{
  background:var(--soft);
  padding-block:1.6rem 3rem
}
.breadcrumb{
  display:flex;
  gap:.7rem;
  flex-wrap:wrap;
  font-size:.875rem;
  color:var(--muted);
  margin-bottom:2.5rem
}
.breadcrumb a{
  text-decoration:underline
}
.detail-heading{
  display:grid;
  gap:1rem
}
.detail-heading .intro{
  margin-bottom:0
}
.detail-heading h1{
  font-size:clamp(2.4rem,4.5vw,4.3rem);
  margin-bottom:0;
  max-width:47rem
}
.detail-layout{
  display:grid;
  gap:2.5rem
}
.service-groups{
  display:grid;
  gap:2.2rem
}
.service-group h2{
  font-size:1.8rem;
  line-height:1.22;
  max-width:30rem
}
.service-group .check-list{
  list-style:none;
  padding:0;
  margin:0
}
.check-list li{
  padding:1rem 0 1rem 1.6rem;
  border-bottom:1px solid var(--line);
  position:relative;
  color:var(--muted)
}
.check-list li:before{
  content:'✓';
  position:absolute;
  left:0;
  top:1rem;
  color:var(--ink);
  font-size:1rem
}
.consultation{
  align-self:start;
  background:var(--soft);
  padding:1.8rem;
  border-top:3px solid var(--ink);
  border-radius:var(--radius)
}
.consultation h2{
  font-size:1.8rem
}
.consultation p{
  color:var(--muted)
}
.consultation .eyebrow{
  font-size:.8rem
}
.consultation .button{
  width:100%
}
.consultation-phone{
  display:block;
  text-align:center;
  padding:1rem 0 .3rem;
  font-weight:600
}
.consultation hr{
  border:0;
  border-top:1px solid var(--line);
  margin:1.5rem 0
}
.other-services{
  margin-top:3rem
}
.other-services h2{
  font-size:1.6rem
}
.tags{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem
}
.tags span{
  background:var(--soft);
  padding:.6rem .9rem;
  font-size:.95rem;
  border:1px solid var(--line);
  border-radius:var(--radius)
}
.support-text{
  font-size:.95rem;
  color:var(--muted);
  margin-top:1.5rem
}
.tinted{
  background:var(--soft)
}
.tinted .service-grid{
  margin-top:2rem
}
.tinted .service-card{
  background:white
}
.about-story{
  display:grid;
  gap:2.5rem
}
.story-image img{
  aspect-ratio:1.15;
  object-fit:cover;
  border-radius:var(--radius)
}
.about-story p:not(.eyebrow){
  color:var(--muted)
}
.values-grid{
  display:grid;
  gap:2rem
}
.values-grid h2{
  font-size:1.8rem
}
.values-grid p{
  color:var(--muted);
  margin-bottom:0
}
.contact-grid{
  display:grid;
  gap:1rem
}
.contact-card{
  border:1px solid var(--line);
  padding:1.8rem;
  border-radius:var(--radius)
}
.contact-card h2{
  font-size:2rem
}
.contact-card h2.email{
  font-family:Arial,sans-serif;
  font-size:clamp(1.1rem,2.3vw,1.8rem);
  letter-spacing:-.02em;
  overflow-wrap:anywhere
}
.contact-card p{
  color:var(--muted)
}
.location{
  display:grid;
  gap:2rem;
  margin-top:3.5rem
}
.location address{
  font-style:normal;
  font-size:1.1rem;
  margin-bottom:1.5rem
}
.location-panel{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:2rem;
  min-height:280px;
  background:var(--ink);
  color:white;
  border-radius:var(--radius);
  text-align:center
}
.location-mark{
  display:flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:64px;
  border:1px solid #6d9191;
  border-radius:50%;
  font-family:Georgia,serif;
  font-size:2rem;
  color:var(--accent);
  margin-bottom:1.5rem
}
.location-panel h3{
  font-size:2rem;
  margin-bottom:.6rem
}
.location-panel>span:last-child{
  font-size:.8rem;
  letter-spacing:.12em;
  color:var(--accent)
}
@media(min-width:40rem){
  .container{
    width:min(calc(100% - 4rem),var(--max))
  }
  .topbar span{
    display:block
  }
  .service-grid{
    grid-template-columns:1fr 1fr
  }
  .audience-grid{
    grid-template-columns:1fr 1fr
  }
  .audience-card:last-child{
    grid-column:1/-1
  }
  .footer-grid{
    grid-template-columns:1fr 1fr
  }
  .hero{
    padding-block:3.5rem
  }
  .hero-visual img{
    max-height:450px
  }
  .specialties .container{
    grid-template-columns:repeat(4,1fr)
  }
  .values-grid{
    grid-template-columns:repeat(3,1fr)
  }
  .contact-grid{
    grid-template-columns:1fr 1fr
  }
  .contact-card{
    padding:2rem
  }
  .location{
    grid-template-columns:1fr 1fr
  }
  .section{
    padding-block:4.5rem
  }
}
@media(min-width:64rem){
  .header-inner{
    flex-wrap:nowrap;
    min-height:106px
  }
  .js .menu-toggle{
    display:none
  }
  nav#navigation,.js nav#navigation{
    display:flex!important;
    flex-direction:row;
    align-items:center;
    width:auto;
    padding:0;
    gap:.1rem
  }
  nav#navigation a{
    padding:.65rem .85rem
  }
  nav#navigation a[aria-current=page]{
    background:none;
    border-bottom:2px solid var(--ink)
  }
  nav#navigation .nav-contact{
    margin-left:1rem;
    padding:.75rem 1.2rem
  }
  nav#navigation .nav-contact[aria-current=page]{
    background:var(--ink);
    border-bottom:0
  }
  .hero{
    padding-block:4rem
  }
  .hero-grid{
    grid-template-columns:1.03fr 1fr;
    align-items:center;
    gap:3rem
  }
  .hero-copy{
    padding-block:.5rem
  }
  .hero-visual{
    align-self:stretch;
    display:flex;
    flex-direction:column
  }
  .hero-visual img{
    height:100%;
    min-height:425px;
    max-height:unset;
    flex:1;
    object-position:53% 50%;
    border-radius:var(--radius) var(--radius) 0 0
  }
  .hero-note{
    margin-top:2.2rem
  }
  .photo-caption{
    padding:1rem 1.5rem
  }
  .section-heading{
    grid-template-columns:1fr .7fr;
    align-items:end;
    gap:4rem;
    margin-bottom:2.5rem
  }
  .section-heading h2{
    margin-bottom:0
  }
  .section-heading>p{
    justify-self:end
  }
  .service-grid{
    grid-template-columns:repeat(4,1fr);
    gap:0
  }
  .service-card{
    border-radius:0;
    padding:2rem 1.5rem;
    border-right:0
  }
  .service-card:last-child{
    border-right:1px solid var(--line)
  }
  .service-card h3{
    font-size:1.6rem
  }
  .service-card   .about-grid{
    grid-template-columns:1fr 1fr;
    gap:5rem
  }
  .about-strip{
    padding-block:4.5rem
  }
  .about-grid h2{
    margin-bottom:0
  }
  .audience-grid{
    grid-template-columns:repeat(3,1fr);
    gap:1.5rem
  }
  .audience-card:last-child{
    grid-column:auto
  }
  .audience-card{
    padding:2rem
  }
  .contact-band-inner{
    grid-template-columns:1.3fr 1fr;
    align-items:center
  }
  .contact-actions{
    flex-direction:column;
    align-items:flex-end
  }
  .footer-grid{
    grid-template-columns:1.2fr 1fr 1fr 1.2fr;
    gap:2.5rem
  }
  .footer{
    padding-top:4rem
  }
  .detail-heading{
    grid-template-columns:1.2fr .8fr;
    align-items:end;
    gap:4rem
  }
  .detail-heading .intro{
    padding-bottom:.25rem
  }
  .detail-hero{
    padding-bottom:4rem
  }
  .detail-layout{
    grid-template-columns:1fr 330px;
    gap:4rem
  }
  .service-groups{
    gap:3rem
  }
  .about-story{
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:4rem
  }
  .values-grid{
    gap:4rem
  }
  .contact-grid{
    gap:2rem
  }
  .contact-card{
    padding:2.5rem
  }
  .location{
    margin-top:4.5rem;
    gap:4rem
  }
  .section{
    padding-block:5rem
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *{
    transition:none!important
  }
}
@media print{
  .topbar,.menu-toggle,.header nav,.footer,.contact-band,.actions{
    display:none!important
  }
  body{
    font-size:11pt
  }
  .container{
    width:100%
  }
  .hero,.section,.detail-hero{
    padding:1rem 0
  }
  .hero-grid,.detail-heading,.detail-layout{
    display:block
  }
  .hero-visual{
    max-width:50%
  }
  a{
    text-decoration:underline
  }
  .consultation{
    display:none
  }
}
h1,h2,h3{
  overflow-wrap:anywhere
}
@media(min-width:64rem){
  nav#navigation,.js nav#navigation{
    flex-wrap:wrap;
    justify-content:flex-end;
    min-width:0
  }
  .header .brand{
    flex-shrink:0
  }
}

/* Identidad corporativa: Me + rs en naranja, tipografía original Georgia. */
.brand .brand-name { white-space:nowrap; font-size:clamp(1.25rem,2.35vw,2.05rem); letter-spacing:-.055em; }
.brand .brand-accent { color:#ea681c; }
.footer .brand .brand-accent { color:#f48a45; }
.contact-card h2.email { overflow-wrap:anywhere; font-size:clamp(1rem,1.7vw,1.45rem); line-height:1.7; }

/* Navegación: la página activa conserva únicamente su indicador de selección.
   Evita sumar el subrayado global de a:hover a la línea de la opción activa. */
nav#navigation a[aria-current="page"]:hover,
nav#navigation a[aria-current="page"]:focus-visible {
  text-decoration: none;
}

/* Marca corporativa en el panel de ubicación: mismo tratamiento que en cabecera. */
.location-brand { margin-bottom:1.5rem; max-width:100%; }
.location-brand .brand-name { display:block; color:#fff; font-family:Georgia,serif; font-size:clamp(1.45rem,3.5vw,2.15rem); font-weight:700; line-height:1.2; letter-spacing:-.055em; white-space:normal; }
.location-brand .brand-accent { color:#ea681c; }