@import url("fonts.css");
@import url("navigation.css");
@import url("grid.css");
@import url("hero.css");
@import url("section.css");
@import url("card.css");
@import url("cta-strip.css");
@import url("popup.css");
@import url("calendar.css");
@import url("faq.css");
/* Minimal, modern styles for Flowen Yôga */
:root{
  --maxw: 1100px;
  --gap: 1.2rem;
  --radius: 14px;
  --text: #1b1b1d;
  --muted: #5b5b61;
  --bg: #ffffff;
  --card: #ffffff;
  --line: #e8e8ef;
  --brand-white: #f0ebdc;
  --brand-primary: #294565;
  --brand-primary-bg-alpha: rgba(41, 69, 101, 0.5);
  --brand-secondary: #569b97;
  --brand-secondary-bg-alpha: rgba(86, 155, 151, 0.5);

  /* Calendar Settings below */
  --start-hour: 6;          /* 06:00 */
  --end-hour: 20;           /* 20:00 */
  --hours: calc(var(--end-hour) - var(--start-hour));
  --grid-bg: #f8f9fb;
  --hour-line: #e6e8ee;
  --accent: #3b82f6;        /* podes ajustar a cor do evento */
  --text: #0f172a;
  --muted: #64748b;
  --radius: 10px;
}
@media (prefers-color-scheme: dark){
  :root{
    /* --bg: #e9e9ea; */
    --bg: ##fff;
    --muted: #a9a9ad;
    --text: #0b0b0c;
    --card: #131316;
    --line: #232327;
  }
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  color:var(--text);
  background:var(--bg);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, 'Helvetica Neue', Arial, 'Noto Sans';
  line-height:1.6;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:1.2rem}
a{color:inherit}

header.site{
  /* border-bottom:1px solid var(--line); */
  /* background:var(--card); */
}

header.site .wrap{
  display:flex; flex-wrap:wrap; gap:1rem;
  align-items:center; justify-content:space-between;
}


.lead{color:var(--muted)}
h2{font-size:clamp(1.2rem,3.2vw,1.6rem)}
/* Grid + Card */

.btn{
  display:inline-block; text-decoration:none;
  border:1px solid var(--line);
  padding:.55rem .85rem; border-radius:.7rem;
}
.btn:hover{filter:brightness(1.05)}
/* Footer */
footer.site{
  /* border-top:1px solid var(--line); */
  background-color: var(--bg);
  color: var(--brand-primary);
  opacity: 0.7;
  padding:2rem 0; 
}
/* Utilities */
.stack > * + *{margin-top: .8rem;}
section > h2{margin-top:0.6rem}

.left-align{text-align:left;}
.right-align{text-align:right;}
.center{text-align:center;}
.black-text{color:black;}
.discreet {
  color: var(--muted)
}

.brand h1 a {
  text-decoration: none;
}

@media (max-width: 600px) {
  .wrap {
   padding: 0.75rem;
   
  }
}