/* Cross-page layout corrections after visual QA */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-x: clip;
  overscroll-behavior-x: none;
}
body { touch-action: pan-y pinch-zoom; }
main,
.site-header,
main > section,
.site-footer { max-width: 100%; }
main,
.hero { overflow-x: hidden; overflow-x: clip; }
body { animation: page-enter .55s cubic-bezier(.2,.75,.25,1) both; }
main { min-height: 55vh; }
body[data-page="about"] .about,
body[data-page="services"] .services,
body[data-page="contact"] .contact,
body[data-page="orientation"] .orientation { padding-top: 0; }
.site-header { scroll-margin-top: 104px; }
.site-header nav a { white-space: nowrap; }
.site-header nav > a:not(.button) { line-height: 1.15; }
.site-header .button { padding: 14px 22px; }
.site-header .language { white-space: nowrap; }
.site-header .brand { flex: 0 0 auto; }
.site-header .brand span { display: none; }
.site-header nav { flex: 1 1 auto; justify-content: flex-end; min-width: 0; }
.site-header .language { position: static; flex: 0 0 auto; padding: 8px; }
.site-header .language span { display: none; }
.site-header .language .language-label { display: inline; }
.site-header .language {
  min-width: 92px;
  padding: 10px 15px;
  border: 1px solid rgba(17,132,135,.22);
  border-radius: 999px;
  color: var(--teal-dark);
  background: rgba(17,132,135,.06);
  font-family: 'Nunito',Arial,sans-serif;
  font-size: .9rem;
  font-weight: 900;
  transition: color .2s ease,background .2s ease,transform .2s ease,border-color .2s ease;
}
.site-header .language:hover { color:#fff; background:var(--teal); border-color:var(--teal); transform:translateY(-2px); }

/* Modern editorial services system */
body[data-page="services"] .services { background: radial-gradient(circle at 90% 12%,rgba(231,173,24,.12),transparent 24%),linear-gradient(180deg,#f7faf9,#fff); }
body[data-page="services"] .services > .section-heading { max-width: 930px; margin-bottom: 68px; }
body[data-page="services"] .services > .section-heading p { font-size: 1.08rem; line-height: 1.8; }
body[data-page="services"] .service-grid { counter-reset: service; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px; max-width: 1400px; }
body[data-page="services"] .service-grid article {
  counter-increment: service;
  position: relative;
  display: grid;
  grid-template-columns: minmax(170px,34%) 1fr;
  grid-template-rows: auto 1fr;
  column-gap: 24px;
  align-items: start;
  padding: 18px;
  min-height: 330px;
  border-radius: 28px;
  background: rgba(255,255,255,.95);
}
body[data-page="services"] .service-grid article:nth-child(1),
body[data-page="services"] .service-grid article:nth-child(6),
body[data-page="services"] .service-grid article:nth-child(9) { grid-column: 1 / -1; grid-template-columns: minmax(300px,42%) 1fr; }
body[data-page="services"] .service-grid article:nth-child(even) { border-radius: 28px 70px 28px 28px; }
body[data-page="services"] .service-grid article:nth-child(odd) { border-radius: 70px 28px 28px 28px; }
body[data-page="services"] .service-grid article::before {
  content: counter(service,decimal-leading-zero);
  position: absolute;
  right: 20px;
  top: 15px;
  z-index: 2;
  padding: 5px 10px;
  border-radius: 999px;
  color: #fff;
  background: var(--orange);
  font: 800 .75rem/1 'Nunito',Arial,sans-serif;
}
body[data-page="services"] .service-grid img { grid-column: 1; grid-row: 1 / 3; width:100%; height:100%; min-height:294px; aspect-ratio:auto; border-radius:18px; object-fit:cover; }
body[data-page="services"] .service-grid h3 { grid-column:2; grid-row:1; min-height:0; margin:12px 42px 12px 0; padding:0; text-align:left; font-size:clamp(1.35rem,2vw,1.85rem); }
body[data-page="services"] .service-grid h3::after { margin:13px 0 0; }
body[data-page="services"] .service-grid p { grid-column:2; grid-row:2; margin:0; padding:0 8px 4px 0; text-align:left; font-size:.98rem; line-height:1.72; }
body[data-page="services"] .service-grid article:nth-child(3n+2),
body[data-page="services"] .service-grid article:nth-child(3n+2):hover { transform:none; }
body[data-page="services"] .service-grid article:hover { transform:translateY(-7px) rotate(.25deg); }

label { display: block; }
label > span { display: inline; }
label input,
label textarea { display: block; margin-top: 8px; }

body[data-page="about"] .about::before,
body[data-page="services"] .services::before,
body[data-page="contact"] .contact::before,
body[data-page="orientation"] .orientation::before {
  margin-top: 0;
  margin-bottom: 72px;
  border-radius: 0 0 54% 0 / 0 0 24% 0;
  box-shadow: inset 0 -1px rgba(255,255,255,.18);
}
body[data-page="about"] .about::before { content: "About Us"; }
body[data-page="services"] .services::before { content: "Services"; }
body[data-page="contact"] .contact::before { content: "Get in Touch"; }
body[data-page="orientation"] .orientation::before { content: "Get Started Today"; }
html[lang="es"] body[data-page="about"] .about::before { content: "Nosotros"; }
html[lang="es"] body[data-page="services"] .services::before { content: "Servicios"; }
html[lang="es"] body[data-page="contact"] .contact::before { content: "Póngase en contacto"; }
html[lang="es"] body[data-page="orientation"] .orientation::before { content: "Comience hoy"; }

body[data-page="home"] .about::before {
  content: '';
  position: absolute;
  width: 250px;
  height: 250px;
  left: -105px;
  top: 20%;
  background: rgba(231,173,24,.16);
  border-radius: 52% 48% 30% 70%;
  transform: rotate(22deg);
}
body:not([data-page="home"]) .about::before { position: static; width: auto; height: auto; transform: none; }

.contact { padding-top: clamp(70px,7vw,105px); padding-bottom: clamp(80px,8vw,120px); }
.contact .section-heading { margin-bottom: 48px; }
.contact-grid { align-items: start; gap: clamp(32px,5vw,72px); max-width: 1240px; }
.contact-form {
  align-content: start;
  gap: 18px;
  padding: clamp(28px,4vw,48px);
  border: 1px solid rgba(17,132,135,.12);
}
.contact-form h3 { margin: 0 0 12px; font-size: clamp(2rem,3vw,2.8rem); }
.contact-form label { font-size: .96rem; }
.contact-form input { min-height: 54px; padding: 12px 14px; }
.contact-form textarea { min-height: 150px; max-height: 260px; padding: 12px 14px; resize: vertical; }
.contact-form .button { min-height: 56px; margin-top: 4px; border-radius: 14px; }
.contact-details {
  min-height: 0;
  justify-content: flex-start;
  gap: 16px;
  padding: clamp(38px,5vw,58px) clamp(24px,4vw,48px);
  border-radius: 28px 72px 28px 72px;
}
.contact-details h3 { margin: 12px 0 2px; font-size: clamp(1.7rem,2.7vw,2.35rem); }
.contact-details .button { margin: 4px 0; padding: 14px 22px; }
.contact-details a { overflow-wrap: anywhere; }

.orientation { padding-top: clamp(80px,8vw,120px); padding-bottom: clamp(85px,9vw,130px); }
.orientation-form { gap: 18px; padding: clamp(28px,4vw,52px); max-width: 1120px; }
.orientation-form label { font-size: .96rem; }
.orientation-form input:not([type="file"]) { min-height: 54px; padding: 12px 14px; }
.orientation-form textarea { min-height: 140px; padding: 12px 14px; resize: vertical; }
.orientation-form input[type="file"] { padding: 12px; min-height: 54px; }
.orientation-form .button { min-height: 58px; border-radius: 14px; }

footer { padding: 58px clamp(20px,10vw,150px) 22px; gap: 30px; }
footer img { max-width: 300px; max-height: 220px; object-fit: contain; }
footer h3 { margin: 0 0 10px; }
footer p { margin: 12px 0 0; }

.site-footer {
  display: grid;
  grid-template-columns: 1.35fr .7fr 1fr;
  align-items: start;
  gap: clamp(36px,6vw,96px);
  padding: 78px clamp(24px,9vw,150px) 0;
  text-align: left;
  border-radius: 48px 48px 0 0;
}
.site-footer::after {
  content: '';
  position: absolute;
  width: 240px;
  height: 240px;
  right: -80px;
  top: -105px;
  border: 28px solid rgba(243,106,33,.3);
  border-radius: 36% 64% 62% 38%;
  transform: rotate(25deg);
}
.site-footer .footer-brand img { width: min(100%,310px); height: auto; margin: 0; }
.site-footer .footer-brand p { max-width: 310px; margin-top: 22px; color: rgba(255,255,255,.78); }
.site-footer h3 { font-size: 1.18rem; letter-spacing: .02em; }
.site-footer .footer-nav,
.site-footer .footer-contact { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.site-footer .footer-nav a,
.site-footer .footer-contact > a:not(.footer-cta) { color: rgba(255,255,255,.82); transition: color .2s ease, transform .2s ease; }
.site-footer .footer-nav a:hover,
.site-footer .footer-contact > a:not(.footer-cta):hover { color: #fff; transform: translateX(5px); }
.site-footer .footer-cta { margin-top: 12px; padding: 11px 18px; border: 1px solid rgba(255,255,255,.45); border-radius: 999px; color: #fff; font-weight: 800; transition: background .2s ease, color .2s ease, transform .2s ease; }
.site-footer .footer-cta:hover { background: #fff; color: var(--teal-dark); transform: translateY(-3px); }
.site-footer .footer-bottom {
  grid-column: 1 / -1;
  margin-top: 20px;
  padding: 22px 0;
  border-top: 1px solid rgba(255,255,255,.22);
  text-align: center;
}
.site-footer .footer-bottom p { margin: 0; color: rgba(255,255,255,.76); font-size: .92rem; }
.site-footer .footer-bottom span { margin-left: 8px; }
.site-footer .footer-bottom a { color: #fff; font-weight: 800; text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 4px; }

@keyframes page-enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

@media (max-width: 1550px) {
  .site-header { min-height: 88px; padding: 10px 20px; }
  .brand img { width: 125px; height: 68px; }
  .brand span { display: none; }
  .language { right: 70px; top: 12px; }
  .language span { display: none; }
  .menu-toggle { display: block; }
  .site-header nav {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 88px;
    max-height: calc(100vh - 88px);
    overflow-y: auto;
    padding: 28px 24px 34px;
    flex-direction: column;
    background: rgba(255,255,255,.98);
    box-shadow: 0 20px 45px rgba(20,66,75,.14);
  }
  .site-header nav.open { display: flex; animation: menu-drop .3s ease both; }
  .site-header nav > a { font-size: 1.08rem; }
  .site-header nav .button { width: min(100%,360px); }
  .hero { min-height: calc(100svh - 88px); }
}

@media (max-width: 780px) {
  body[data-page="about"] .about::before,
  body[data-page="services"] .services::before,
  body[data-page="contact"] .contact::before,
  body[data-page="orientation"] .orientation::before {
    margin-left: -20px;
    margin-right: -20px;
    margin-bottom: 52px;
    padding: 72px 20px;
    border-radius: 0 0 42% 0 / 0 0 16% 0;
  }
  body[data-page="home"] .about::before { width: 120px; height: 120px; left: -70px; }
  .contact-details { padding: 42px 20px; border-radius: 24px 54px 24px 54px; }
  .contact-form { padding: 26px 18px; }
  .contact-form textarea { min-height: 130px; }
  .orientation-form { padding: 26px 18px; }
  body[data-page="services"] .service-grid { grid-template-columns:1fr; }
  body[data-page="services"] .service-grid article,
  body[data-page="services"] .service-grid article:nth-child(1),
  body[data-page="services"] .service-grid article:nth-child(6),
  body[data-page="services"] .service-grid article:nth-child(9) { grid-column:1; grid-template-columns:1fr; grid-template-rows:auto auto auto; min-height:0; padding:14px; border-radius:24px; }
  body[data-page="services"] .service-grid img { grid-column:1; grid-row:1; min-height:0; height:auto; aspect-ratio:16/9; }
  body[data-page="services"] .service-grid h3 { grid-column:1; grid-row:2; margin:20px 40px 10px 8px; }
  body[data-page="services"] .service-grid p { grid-column:1; grid-row:3; padding:0 8px 12px; }
  footer { padding-top: 48px; }
  .site-footer { grid-template-columns: 1fr; gap: 34px; padding: 54px 24px 0; border-radius: 32px 32px 0 0; text-align: center; }
  .site-footer .footer-brand img { margin: auto; }
  .site-footer .footer-brand p { margin-inline: auto; }
  .site-footer .footer-nav,.site-footer .footer-contact { align-items: center; }
  .site-footer .footer-bottom { grid-column: 1; }
  .site-footer .footer-bottom span { display: block; margin: 7px 0 0; }
}

@keyframes menu-drop { from { opacity:0; transform:translateY(-12px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { body { animation: none; } }
/* Accessible server-backed form feedback */
.form-status{grid-column:1/-1;margin:.75rem 0 0;padding:.85rem 1rem;border-radius:14px;font-weight:700;text-align:center}
.form-status:empty{display:none}
.form-status.success{color:#0b615f;background:#e5f7f4;border:1px solid #a8ded8}
.form-status.error{color:#8b2c13;background:#fff0e9;border:1px solid #f7b293}
form button[aria-busy="true"]{cursor:wait;opacity:.72}
form button:disabled{cursor:not-allowed}
.website-field{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Stack the contact experience before phone-sized columns become cramped. */
@media (max-width: 980px) {
  .contact-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 32px;
    width: 100%;
  }
  .contact-form,
  .contact-details {
    width: 100%;
    max-width: 680px;
    min-width: 0;
    margin-inline: auto;
    transform: none;
  }
  .contact-form { grid-template-columns: minmax(0, 1fr); }
  .contact-form > * { grid-column: 1 !important; min-width: 0; }
  .contact-details a,
  .contact-details h3 { max-width: 100%; overflow-wrap: anywhere; word-break: normal; }
}

@media (max-width: 560px) {
  .contact { padding-inline: 14px; }
  .contact-form { padding: 24px 16px; border-radius: 24px; }
  .contact-form h3 { font-size: clamp(2rem, 11vw, 2.65rem); }
  .contact-details { padding: 36px 18px; border-radius: 24px 48px 24px 48px; }
  .contact-details .button { width: 100%; padding-inline: 14px; }
  .contact-details a:not(.button) { font-size: clamp(.92rem, 4.5vw, 1.05rem); }
}
