/* Accessible Bathroom Page — Supplemental Styles */

:root{--ann-h:0px}

.onyx-option{display:grid;grid-template-columns:1fr 1.4fr;gap:40px;align-items:center;margin-bottom:52px;padding-bottom:52px;border-bottom:1px solid var(--border)}
.onyx-option:last-of-type{border-bottom:none}
.onyx-option--flip .onyx-option__imgs{order:2}
.onyx-option--flip .onyx-option__copy{order:1}
.onyx-option__imgs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.onyx-option__imgs img{width:100%;height:200px;object-fit:cover;border-radius:var(--rl);box-shadow:var(--shadow-md)}
.onyx-option__num{display:inline-block;background:var(--gold);color:#fff;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;padding:3px 12px;border-radius:20px;margin-bottom:10px}
.onyx-option__title{font-family:'Geologica',system-ui,sans-serif;font-size:1.15rem;font-weight:800;color:var(--navy);margin-bottom:10px;line-height:1.25}
.onyx-option p{font-size:.88rem;color:var(--body);line-height:1.72;margin-bottom:14px}

.onyx-allincludes{background:var(--gray);border-radius:var(--rl);padding:32px 28px;margin-top:52px}
.access-features-grid--sm{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.access-features-grid--sm .access-feat{padding:18px;background:#fff}
.access-features-grid--sm .access-feat h3{font-size:.88rem}
.access-features-grid--sm .access-feat p{font-size:.78rem}

@media(max-width:760px){
  .onyx-option{grid-template-columns:1fr}
  .onyx-option--flip .onyx-option__imgs{order:1}
  .onyx-option--flip .onyx-option__copy{order:2}
  .onyx-option__imgs img{height:160px}
}

.hero--access .hero__bg--access {
  background-image: url('/images/hero/accessible/accessible-hero-current.png');
  background-position: center center;
}

@media(max-width:760px){
  .hero--access .hero__bg--access {
    background-position: 58% center;
  }
}

.access-features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 24px;
  margin-top: 8px;
}
.access-feat {
  background: var(--off);
  border-radius: var(--rl);
  padding: 24px;
  border: 1px solid var(--border);
  transition: box-shadow .2s;
}
.access-feat:hover { box-shadow: var(--shadow-md); }
.access-feat h3 {
  font-family: 'Geologica', system-ui, sans-serif;
  font-size: .95rem; font-weight: 800;
  color: var(--navy); margin-bottom: 8px;
}
.access-feat p { font-size: .84rem; color: var(--body); line-height: 1.7; }

.who-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 20px;
}
.who-card {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--rl); padding: 24px; text-align: center;
}
.who-card__icon { font-size: 2rem; margin-bottom: 12px; display: block; }
.who-card h3 {
  font-family: 'Geologica', system-ui, sans-serif;
  font-size: .9rem; font-weight: 800;
  color: #fff; margin-bottom: 8px;
}
.who-card p { font-size: .82rem; color: rgba(255,255,255,.72); line-height: 1.65; }

.gallery-grid--access { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

.nav__link--active {
  color: #fff !important;
  background: var(--gold) !important;
  font-weight: 700 !important;
  border-radius: 4px !important;
}

/* Offer banner */
.offer-banner{background:#92400E;color:#fff;padding:10px 48px 10px 16px;text-align:center;font-size:.80rem;font-weight:600;line-height:1.4;position:relative;z-index:1100}
.offer-banner strong{font-weight:800}
.offer-banner__close{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(255,255,255,.7);font-size:1.2rem;cursor:pointer;line-height:1;padding:4px 6px}
.offer-banner__close:hover{color:#fff}

/* Offer in form */
.offer-form-note{background:rgba(242,98,33,.12);border-left:3px solid var(--gold);border-radius:4px;padding:10px 14px;margin-bottom:14px;font-size:.80rem;color:rgba(255,255,255,.9);line-height:1.5}
.offer-form-note strong{color:#fff}

/* Offer in final CTA */
.offer-cta-block{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.20);border-radius:8px;padding:16px 20px;margin:0 auto 24px;max-width:500px;font-size:.84rem;color:rgba(255,255,255,.88);line-height:1.55;text-align:left}
.offer-cta-block strong{color:#fff}

/* sec-mid used on final CTA section */
.sec-mid { background: var(--navy-mid); }
.sec-mid .sec__title { color: #fff; }

@media(max-width:720px) {
  .access-features-grid { grid-template-columns: 1fr 1fr; }
  .who-grid { grid-template-columns: 1fr 1fr; }
}
@media(max-width:480px) {
  .access-features-grid { grid-template-columns: 1fr; }
  .who-grid { grid-template-columns: 1fr; }
}
