/* ===== Ramaste base stylesheet (baked) ===== */

/* Center option cards across service pages */
.option-grid .card{display:flex;flex-direction:column;align-items:center;text-align:center}
.option-grid .card *{text-align:inherit}

/* Provide safe intrinsic ratio for hero images */
.hero img, img.hero {
  width:100%;
  height:auto;
  display:block;
}

/* Slight form polish */
form input[type="text"], form input[type="email"], form input[type="tel"], form textarea, form select {
  width:100%;
  max-width: 720px;
  padding:.75rem .9rem;
  border:1px solid rgba(0,0,0,.12);
  border-radius:.6rem;
  margin:.4rem 0;
  font-size:1rem;
}
form button[type="submit"] {
  padding:.75rem 1.1rem;
  border-radius:.6rem;
}
.micro-note { font-size:.85rem; opacity:.8; margin-top:.5rem }

/* ===== Free Daily Reiki form polish ===== */
.free-daily-reiki main form, .free-daily-reiki .form-card form {
  background: rgba(124, 58, 237, 0.06); /* soft violet tint */
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 1rem;
  padding: 1.25rem;
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
  max-width: 720px;
  margin: 1rem auto;
}
.free-daily-reiki form input[type="text"],
.free-daily-reiki form input[type="email"],
.free-daily-reiki form input[type="tel"],
.free-daily-reiki form textarea {
  background: #fff;
}
.free-daily-reiki form button[type="submit"]{
  font-weight: 600;
}


/* ===== Service form unified layout ===== */
.service-form{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.service-form > textarea{ grid-column: 1 / -1; }
.service-form .grid{ display: contents; } /* flatten nested grids to our main layout */
.service-form .grid > div{ display:block; }
@media (max-width: 820px){
  .service-form{ grid-template-columns: 1fr; }
}

/* ===== Service form card styling ===== */
.service-form, form[data-netlify]{
  background: rgba(124, 58, 237, 0.04);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 1rem;
  padding: 1.25rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  max-width: 900px;
  margin: 1.5rem auto;
}
.service-form textarea, form[data-netlify] textarea{width:100%;}

/* ===== Global box sizing to prevent overflow ===== */
*, *::before, *::after { box-sizing: border-box; }

/* Fix select text wrapping */
select { white-space: normal; }

/* Home form card styling */
.home .form-card form{
  background: rgba(124,58,237,0.06);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 1rem;
  padding: 1.25rem;
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
  max-width: 720px;
  margin: 1rem auto;
}

/* Service form layout refine */
.service-form{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  width: 100%;
  max-width: 100%;
}
.service-form > textarea{ grid-column: 1 / -1; }
.service-form input, .service-form select, .service-form textarea { max-width:100%; }

/* Undo contents flatten to avoid weird overflows */
.service-form .grid{ display: grid; grid-template-columns: inherit; gap: inherit; }

@media (max-width: 820px){
  .service-form{ grid-template-columns: 1fr; }
}

/* === Layout consistency with Homepage Hero (WIDER + TIGHTER) === */
:root{
  --content-max: 1280px;   /* was 1100px */
  --gutter: 18px;
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 18px;
  --space-4: 24px;
}

.wrap,
.card {
  max-width: var(--content-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}

.service-hero,
header.hero .service-hero {
  display: block;
  width: 100%;
  max-width: var(--content-max);
  margin-left: auto;
  margin-right: auto;
  height: auto;
  border-radius: 20px;
}

header.hero.card { padding-left: 0; padding-right: 0; }

.wrap { margin: var(--space-4) auto; }
.card { margin: var(--space-2) 0; padding-top: 18px; padding-bottom: 18px; }
header.hero { margin: var(--space-2) 0 var(--space-3); }

/* === Ramaste Footer — minimal, conflict‑free === */
.ramaste-footer { width: 100%; padding: 1rem 0; }
.ramaste-footer .footer-inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#bbb-seal { display: flex; justify-content: center; margin-bottom: .75rem; }
.trust-line { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin: .25rem 0 1rem; }
.pill { display: inline-flex; align-items: center; gap: 8px; padding: .6rem 1rem; border: 1px solid rgba(0,0,0,.1); border-radius: 999px; }
.chamber-pill .logo { height: 36px; width: auto; }
.photo-credit, .footer-about, .legal { margin: .25rem 0; }



/* ==== Ramaste Layout Fix Pack v1 (2025-09-19) ==== */

/* Global container to align content site-wide */
.container, .content-wrap, main {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* Header: align brand, nav, socials on one row */
.ramaste-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 16px;
  background: #fdfbf7;
}
.ramaste-header .brand {
  display: flex;
  align-items: center;
  gap: 12px;
}
.ramaste-header .brand img {
  height: 64px;
  width: auto;
  display: block;
}
.ramaste-header nav {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.ramaste-header nav a {
  text-decoration: none;
  color: #2d2150;
  font-weight: 600;
}
.ramaste-header nav a:hover { opacity: .8; }

/* Socials cluster (right side) */
.socials {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}
.socials a { display: inline-flex; }

/* Kill legacy header/link rules that caused stacking */
header a, header * {
  /* Remove stray block-level enforcement from old builds */
  /* do not force block; let flex work */
}

/* Card grids: unify styles across different class names */
.cards, .card-grid, .options-grid, .option-grid, .grid-2, .grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 20px;
}
@media (max-width: 960px){
  .cards, .card-grid, .options-grid, .option-grid, .grid-2, .grid-3 {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 640px){
  .cards, .card-grid, .options-grid, .option-grid, .grid-2, .grid-3 {
    grid-template-columns: 1fr;
  }
}

/* Card block: consistent look */
.card, .option, .service-card {
  background: #ffffff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 10px 24px rgba(0,0,0,.04);
}
.card img, .option img, .service-card img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
}

/* Fix random center/edge hugging */
.ramaste-footer .footer-inner,
header.hero, .hero, .section, .why-ramaste, .faqs, .service-form, .trust-badges {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

/* Remove any universal footer alignment overrides from old builds */
footer, footer * {
  text-align: inherit;
}


/* === Live Header/Sidebar/Drawer sync (minimal) === */
:root{ --content-max:1280px; --gutter:18px; }
main, .wrap, .content { max-width:var(--content-max); margin:0 auto; padding:0 var(--gutter); }

/* Desktop sidebar */
.sidebar{ position:sticky; top:16px; align-self:start; display:none; width:220px; padding:12px 8px; }
.sidebar a{ display:block; margin:.35rem 0; text-decoration:none; color:#2d2150; font-weight:600; }
.sidebar .book-btn{ display:block; text-align:center; background:#5c4873; color:#fff; padding:.6rem .8rem; border-radius:12px; margin-bottom:.5rem; }
.sidebar-social{ display:flex; gap:10px; margin-top:.5rem; }

/* Mobile topbar */
.topbar-mobile{ position:sticky; top:0; z-index:1000; background:#fdfbf7; border-bottom:1px solid rgba(0,0,0,.05); }
.topbar-mobile .topbar-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; }
.hamburger-left{ font-size:1.4rem; background:none; border:0; cursor:pointer; }
.topbar-mobile .brand{ font-weight:700; color:#2d2150; }

/* Drawer */
.drawer-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.4); opacity:0; pointer-events:none; transition:.25s; z-index:9998; }
.drawer-overlay.show{ opacity:1; pointer-events:auto; }
.mobile-drawer{
  position:fixed; top:0; left:0; height:100vh; width:80vw; max-width:320px;
  background:#f7f5fa; transform:translateX(-100%); transition:transform .25s ease; z-index:9999;
  padding:2rem 1.5rem; box-shadow:2px 0 12px rgba(0,0,0,.25);
}
.mobile-drawer.show{ transform:translateX(0); }
.mobile-drawer .drawer-close{ font-size:2rem; font-weight:700; color:#5c4873; background:none; border:0; margin-bottom:2rem; cursor:pointer; }
.mobile-drawer ul{ list-style:none; padding:0; margin:0; }
.mobile-drawer li{ margin-bottom:1.1rem; }
.mobile-drawer a{ text-decoration:none; font-weight:700; color:#5c4873; }

/* Desktop switch */
@media (min-width:1024px){
  .layout{ display:grid; grid-template-columns:240px 1fr; gap:20px; align-items:start; }
  .sidebar{ display:block; }
  .topbar-mobile{ display:none; }
}

/* Services/cards grid on Home */
.services-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px; margin-top:10px;
}
@media (max-width:960px){ .services-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px){ .services-grid{ grid-template-columns:1fr; } }

.service-item{
  display:flex; gap:12px; align-items:flex-start;
  background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:16px; padding:14px;
  text-decoration:none; color:#2d2150; box-shadow:0 8px 22px rgba(0,0,0,.04);
}
.service-item:hover{ box-shadow:0 12px 28px rgba(0,0,0,.08); transform:translateY(-2px); }
.service-icon{ width:64px; height:64px; object-fit:contain; border-radius:12px; }
.svc-content h3{ margin:.1rem 0 .25rem; } .svc-content p{ margin:0; line-height:1.45; }


@media (min-width:1024px){
  body .content{margin-left:240px;padding:2rem;}
  body .content .section{max-width:1100px;margin-left:0;margin-right:auto;}
  main.container,.content-wrap{margin-left:0;margin-right:auto;}
}
@media (min-width:1024px){.ramaste-footer{padding-left:calc(240px + 20px);} .ramaste-footer .footer-inner{max-width:1100px;margin:0 auto;text-align:center;}}@media (min-width:1024px){.layout{display:grid;grid-template-columns:240px 1fr;gap:20px;}.content{margin:0;max-width:none;width:100%;padding:2rem;}.content .section{max-width:none;margin:0;}.ramaste-footer{padding-left:0;}.ramaste-footer .footer-inner{max-width:none;margin:0 2rem;text-align:center;}}@media (min-width:1024px){.container,.content-wrap,main{max-width:none!important;margin:0!important;padding-left:0;padding-right:0}.content{max-width:none!important;margin:0!important;width:100%!important;padding:2rem}body .hero,body .section,body .why-ramaste,body .faqs,body .service-form,body .testimonials,body .cta,body .cards,body .grid{max-width:none!important;margin:0!important}.hero .service-hero{margin-left:0!important;margin-right:0!important}}@media (min-width:1024px){.wrap,.card{max-width:none!important;margin:0!important;padding-left:0!important;padding-right:0!important}}
@media (min-width:1024px){
  .content{max-width:none!important;margin:0!important;width:100%!important;padding:2rem}
  .content > *, .content .wrap, .content .card, .content .hero, .content .section, 
  .content .why-ramaste, .content .faqs, .content .service-form, .content .trust-badges,
  .content .container, .content .content-wrap, .content main, .content .grid {
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}
@media (min-width:1024px){.content{padding:0!important}.home .hero, .hero{margin:0!important}.hero .service-hero{margin-left:0!important;margin-right:0!important;width:100%!important}}
@media (min-width:1024px){
  html,body{overflow-x:hidden}
  /* Ensure grid second column can actually shrink and not cause phantom space */
  .layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:20px}
  /* Kill any max-width var used in grouped rules */
  .content{--content-max:none !important;max-width:none!important;margin:0!important;width:100%!important;padding-right:0!important}
  /* Make every common wrapper inside content full-width and left-aligned */
  .content > *, .content .wrap, .content .card, .content .hero, .content .section, 
  .content .why-ramaste, .content .faqs, .content .service-form, .content .trust-badges,
  .content .container, .content .content-wrap, .content main, .content .grid {
    max-width:none!important;margin-left:0!important;margin-right:0!important
  }
  /* Media elements should not overflow/center themselves */
  .hero img, .hero video, .hero picture, .hero .service-hero{display:block;max-width:none!important;width:100%!important;margin:0!important}
  /* Footer aligned to the content column, not the full viewport */
  .ramaste-footer{grid-column:2;padding-left:0!important;margin-left:0!important}
  .ramaste-footer .footer-inner{max-width:min(1100px,100% - 4rem);margin:0 auto;text-align:center}
}