/* ===================================================================
   StanceStyle — vida em movimento
   Editorial / newspaper aesthetic · SMACSS naming · rem units
   css_variables: none → colours are hardcoded throughout
   =================================================================== */

/* ---------- Modern reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: #3e4a54;
  background: #faf7f2;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
a { color: #c75d38; text-decoration: none; }
a:hover { text-decoration: underline; }
ul, ol { padding: 0; list-style-position: inside; }
button, input, textarea, select { font: inherit; color: inherit; }

/* ---------- Typography ---------- */
h1, h2, h3, h4 { font-family: 'Lora', Georgia, 'Times New Roman', serif; color: #1f2933; line-height: 1.18; font-weight: 600; }
h1 { font-size: clamp(2.1rem, 5vw, 3.4rem); letter-spacing: -0.01em; }
h2 { font-size: clamp(1.7rem, 3.5vw, 2.5rem); }
h3 { font-size: 1.3rem; }
h4 { font-size: 1.075rem; font-family: 'Inter', sans-serif; font-weight: 700; color: #1f2933; }
p { margin-bottom: 1.1rem; }
p:last-child { margin-bottom: 0; }

/* ---------- Layout primitives (SMACSS l-) ---------- */
.l-container { width: 100%; max-width: 1140px; margin: 0 auto; padding: 0 1.5rem; }
.l-container--narrow { max-width: 760px; }
.l-section { padding: 5rem 0; }
.l-section--tight { padding: 3.25rem 0; }
.l-section--paper { background: #faf7f2; }
.l-section--white { background: #ffffff; }
.l-section--ink { background: #1f2933; color: #d6dde3; }
.l-section--accent { background: #f3e4da; }

/* Functional-css utilities */
.u-eyebrow { display: inline-block; font-family: 'Inter', sans-serif; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: #c75d38; margin-bottom: 0.9rem; }
.u-lead { font-size: 1.2rem; line-height: 1.6; color: #4a555f; }
.u-center { text-align: center; }
.u-measure { max-width: 42rem; }
.u-measure-center { max-width: 42rem; margin-left: auto; margin-right: auto; }
.u-mt-s { margin-top: 1rem; }
.u-mt-m { margin-top: 1.75rem; }
.u-mb-m { margin-bottom: 1.75rem; }

.section-head { margin-bottom: 2.75rem; }
.section-head--center { text-align: center; }
.section-head h2 { margin-bottom: 0.75rem; }
.section-head p { color: #6b7680; max-width: 40rem; }
.section-head--center p { margin-left: auto; margin-right: auto; }

/* Section divider — thin-rule-centered */
.section-divider { height: 1px; background: #e7dfd4; max-width: 1100px; margin: 0 auto; }

/* ---------- Buttons — dot-indicator ---------- */
.btn { display: inline-block; font-family: 'Inter', sans-serif; font-weight: 600; cursor: pointer; border-radius: 8px; transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease; text-align: center; }
.btn:hover { text-decoration: none; }
.btn-primary { background: #c75d38; color: #ffffff; border: none; padding: 0.85rem 1.6rem 0.85rem 1.4rem; }
.btn-primary::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #ffffff; margin-right: 0.6rem; vertical-align: middle; }
.btn-primary:hover { background: #a8482a; transform: translateY(-1px); }
.btn-ghost { background: transparent; color: #1f2933; border: 1.5px solid #1f2933; padding: 0.8rem 1.5rem; }
.btn-ghost:hover { background: #1f2933; color: #ffffff; }
.btn-block { display: block; width: 100%; }

/* ===================================================================
   Header / Navigation  (visual only — mobile-menu module owns behaviour)
   navigation_type: dropdown-mega
   =================================================================== */
[data-mm-header].site-header {
  --mm-bg: #faf7f2;
  --mm-text: #1f2933;
  --mm-primary: #c75d38;
  --mm-overlay-bg: rgba(20, 24, 31, 0.55);
}
.site-header { position: sticky; top: 0; z-index: 900; background: #faf7f2; border-bottom: 1px solid #e7dfd4; }
.site-header__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.85rem 0; }
.site-header__brand { display: inline-flex; align-items: center; gap: 0.6rem; }
.site-header__brand:hover { text-decoration: none; }
.site-header__brand img { width: 38px; height: 38px; }
.site-header__name { font-family: 'Lora', serif; font-size: 1.35rem; font-weight: 600; color: #1f2933; letter-spacing: -0.01em; }
.site-header__name b { color: #c75d38; font-weight: 600; }

.site-nav__list { display: flex; align-items: center; gap: 0.25rem; }
.site-nav__list li { list-style: none; }
.site-nav__link { display: block; font-family: 'Inter', sans-serif; font-weight: 500; font-size: 0.98rem; color: #1f2933; padding: 0.55rem 0.95rem; border-radius: 6px; }
.site-nav__link:hover { color: #c75d38; text-decoration: none; }
.site-nav__cta { margin-left: 0.5rem; }

/* Mega dropdown (desktop) */
.site-nav__item--has-mega { position: relative; }
.site-nav__mega {
  position: absolute; left: 50%; top: calc(100% + 0.4rem); transform: translateX(-50%) translateY(8px);
  width: 540px; background: #ffffff; border: 1px solid #e7dfd4; border-radius: 12px;
  box-shadow: 0 18px 40px rgba(31, 41, 51, 0.13); padding: 1.4rem; opacity: 0; visibility: hidden;
  transition: opacity 0.22s ease, transform 0.22s ease; z-index: 950;
}
.site-nav__item--has-mega:hover .site-nav__mega,
.site-nav__item--has-mega:focus-within .site-nav__mega { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.site-nav__mega-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.4rem 1.5rem; }
.site-nav__mega a { display: block; padding: 0.55rem 0.6rem; border-radius: 8px; color: #1f2933; }
.site-nav__mega a:hover { background: #f3e4da; text-decoration: none; }
.site-nav__mega a span { display: block; font-weight: 600; }
.site-nav__mega a small { color: #6b7680; font-size: 0.85rem; }

/* hamburger lines colour */
[data-mm-toggle] span { background: #1f2933; }

@media (max-width: 767px) {
  .site-nav__mega { position: static; width: auto; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; padding: 0.5rem 0 0; background: transparent; }
  .site-nav__mega-grid { grid-template-columns: 1fr; }
  .site-nav__cta { margin-left: 0; }
}

/* ===================================================================
   Hero — split-left-text + background-images
   =================================================================== */
.hero { padding: 4.5rem 0; }
.hero__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 3rem; align-items: center; }
.hero__title { margin-bottom: 1.25rem; }
.hero__title em { font-style: italic; color: #c75d38; }
.hero__text { font-size: 1.18rem; color: #4a555f; max-width: 34rem; margin-bottom: 1.9rem; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-bottom: 2rem; }
.hero__trust { display: flex; flex-wrap: wrap; gap: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #e7dfd4; }
.hero__trust li { list-style: none; }
.hero__trust b { display: block; font-family: 'Lora', serif; font-size: 1.5rem; color: #1f2933; }
.hero__trust span { font-size: 0.85rem; color: #6b7680; }
.hero__media { position: relative; min-height: 420px; border-radius: 16px; background-image: url('/assets/img/hero.jpg'); background-size: cover; background-position: center; box-shadow: 0 24px 48px rgba(31, 41, 51, 0.16); }
.hero__media::after { content: ""; position: absolute; inset: 0; border-radius: 16px; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18); }
.hero__badge { position: absolute; left: 1.25rem; bottom: 1.25rem; background: rgba(250, 247, 242, 0.94); backdrop-filter: blur(4px); padding: 0.85rem 1.1rem; border-radius: 12px; max-width: 16rem; }
.hero__badge b { font-family: 'Lora', serif; color: #1f2933; }
.hero__badge span { font-size: 0.85rem; color: #6b7680; }

@media (max-width: 880px) {
  .hero__grid { grid-template-columns: 1fr; gap: 2rem; }
  .hero__media { order: -1; min-height: 280px; }
}

/* ===================================================================
   Feature cards — icon-top-center
   =================================================================== */
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.feature-card { text-align: center; padding: 2.1rem 1.6rem; border-radius: 14px; background: #ffffff; border: 1px solid #efe7db; box-shadow: 0 4px 14px rgba(31, 41, 51, 0.06); transition: transform 0.25s ease, box-shadow 0.25s ease; }
.feature-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(31, 41, 51, 0.1); }
.feature-card__icon { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 1.1rem; background: #f3e4da; color: #c75d38; }
.feature-card__icon svg { width: 28px; height: 28px; }
.feature-card h3 { margin-bottom: 0.55rem; }
.feature-card p { color: #6b7680; font-size: 0.98rem; }

@media (max-width: 860px) { .feature-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .feature-grid { grid-template-columns: 1fr; } }

/* ===================================================================
   Two-column editorial block (newspaper rhythm)
   =================================================================== */
.editorial { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; }
.editorial__media { border-radius: 14px; min-height: 360px; background-size: cover; background-position: center; box-shadow: 0 18px 40px rgba(31,41,51,0.13); }
.editorial--flip .editorial__media { order: 2; }
.editorial__body h2 { margin-bottom: 1rem; }
.editorial__body .checklist { margin: 1.4rem 0 1.8rem; }
.checklist { list-style: none; }
.checklist li { position: relative; padding-left: 1.9rem; margin-bottom: 0.7rem; color: #3e4a54; }
.checklist li::before { content: ""; position: absolute; left: 0; top: 0.45rem; width: 12px; height: 12px; border-radius: 50%; background: #c75d38; box-shadow: 0 0 0 4px #f3e4da; }
@media (max-width: 820px) { .editorial { grid-template-columns: 1fr; gap: 2rem; } .editorial--flip .editorial__media { order: -1; } }

/* Newspaper columns text */
.columns-text { column-count: 2; column-gap: 2.5rem; }
.columns-text p { break-inside: avoid; }
@media (max-width: 680px) { .columns-text { column-count: 1; } }

/* ===================================================================
   Experts / Team
   =================================================================== */
.expert-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.75rem; }
.expert-card { background: #ffffff; border: 1px solid #efe7db; border-radius: 14px; overflow: hidden; }
.expert-card__photo { aspect-ratio: 4 / 3; background-size: cover; background-position: center; background-color: #ece3d6; }
.expert-card__body { padding: 1.3rem 1.4rem 1.6rem; }
.expert-card__role { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #c75d38; }
.expert-card h3 { margin: 0.25rem 0 0.6rem; font-size: 1.2rem; }
.expert-card p { color: #6b7680; font-size: 0.95rem; }
@media (max-width: 820px) { .expert-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 540px) { .expert-grid { grid-template-columns: 1fr; } }

/* ===================================================================
   FAQ — chat-bubble
   =================================================================== */
.faq-chat { display: flex; flex-direction: column; max-width: 780px; margin: 0 auto; }
.faq-chat .q, .faq-chat .a { max-width: 78%; padding: 0.95rem 1.2rem; margin: 0.45rem 0; font-size: 1rem; }
.faq-chat .q { background: #c75d38; color: #ffffff; align-self: flex-end; border-radius: 16px 16px 4px 16px; font-weight: 600; font-family: 'Inter', sans-serif; }
.faq-chat .a { background: #ffffff; color: #3e4a54; align-self: flex-start; border-radius: 16px 16px 16px 4px; border: 1px solid #efe7db; }
.faq-chat .a strong { color: #1f2933; }
@media (max-width: 560px) { .faq-chat .q, .faq-chat .a { max-width: 90%; } }

/* ===================================================================
   Lead capture / Contact form — footer-section placement
   =================================================================== */
.lead__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
.lead__intro h2 { color: #ffffff; margin-bottom: 1rem; }
.lead__intro p { color: #c4ccd4; }
.lead__points { list-style: none; margin-top: 1.6rem; }
.lead__points li { position: relative; padding-left: 1.8rem; margin-bottom: 0.8rem; color: #d6dde3; }
.lead__points li::before { content: "→"; position: absolute; left: 0; color: #e0894f; font-weight: 700; }

.lead-form { background: #ffffff; border-radius: 16px; padding: 2rem; box-shadow: 0 24px 50px rgba(0,0,0,0.25); }
.field { margin-bottom: 1.15rem; }
.field label { display: block; font-family: 'Inter', sans-serif; font-weight: 600; font-size: 0.9rem; color: #1f2933; margin-bottom: 0.4rem; }
.field .optional { color: #9aa3ac; font-weight: 400; }
.field input[type="text"], .field input[type="tel"], .field input[type="email"], .field textarea {
  width: 100%; padding: 0.8rem 0.95rem; border: 1.5px solid #e0d8cb; border-radius: 9px; background: #faf7f2; color: #1f2933; transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.field input:focus, .field textarea:focus { outline: none; border-color: #c75d38; box-shadow: 0 0 0 3px rgba(199, 93, 56, 0.16); background: #ffffff; }
.field textarea { min-height: 110px; resize: vertical; }
.field--check { display: flex; align-items: flex-start; gap: 0.6rem; font-size: 0.9rem; color: #5b6670; }
.field--check input { margin-top: 0.25rem; flex: 0 0 auto; }
.field--check a { font-weight: 600; }
.form-note { font-size: 0.82rem; color: #9aa3ac; margin-top: 0.9rem; }
.form-errors { background: #fbeae3; border: 1px solid #e8b39c; color: #8c3b1d; padding: 0.85rem 1rem; border-radius: 9px; margin-bottom: 1.1rem; font-size: 0.92rem; }
.form-errors ul { margin: 0.3rem 0 0; padding-left: 1.1rem; list-style: disc; }
.form-success { background: #fff; border-radius: 16px; padding: 2.4rem 2rem; text-align: center; box-shadow: 0 24px 50px rgba(0,0,0,0.25); }
.form-success .success-icon { width: 64px; height: 64px; border-radius: 50%; background: #e7f3ea; color: #2f7d4f; display: grid; place-items: center; margin: 0 auto 1.2rem; font-size: 2rem; }

@media (max-width: 820px) { .lead__grid { grid-template-columns: 1fr; gap: 2rem; } }

/* ===================================================================
   Inner page head
   =================================================================== */
.page-head { background: #1f2933; color: #e7edf2; padding: 3.6rem 0; }
.page-head .u-eyebrow { color: #e0894f; }
.page-head h1 { color: #ffffff; }
.page-head p { color: #b7c0c9; max-width: 44rem; margin-top: 0.75rem; }

/* ---------- Prose (legal & article text) ---------- */
.prose { max-width: 760px; }
.prose h2 { margin: 2.3rem 0 0.8rem; font-size: 1.5rem; }
.prose h3 { margin: 1.6rem 0 0.6rem; }
.prose p { color: #44505a; }
.prose ul, .prose ol { margin: 0 0 1.1rem 0; padding-left: 1.3rem; list-style-position: outside; }
.prose li { margin-bottom: 0.5rem; }
.prose ul li { list-style: disc; }
.prose ol li { list-style: decimal; }
.prose .muted { color: #8a939c; font-size: 0.9rem; }
.prose address { font-style: normal; color: #44505a; }

/* ---------- Blog ---------- */
.blog-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.75rem; }
.blog-card { background: #ffffff; border: 1px solid #efe7db; border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.blog-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(31,41,51,0.1); text-decoration: none; }
.blog-card__media { aspect-ratio: 16 / 10; background-size: cover; background-position: center; background-color: #ece3d6; }
.blog-card__body { padding: 1.3rem 1.4rem 1.6rem; flex: 1; }
.blog-card__tag { font-size: 0.74rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #c75d38; }
.blog-card h3 { margin: 0.35rem 0 0.5rem; font-size: 1.22rem; }
.blog-card p { color: #6b7680; font-size: 0.95rem; }
.blog-card__meta { color: #9aa3ac; font-size: 0.82rem; margin-top: 0.9rem; }
@media (max-width: 820px) { .blog-list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 540px) { .blog-list { grid-template-columns: 1fr; } }

.post { max-width: 740px; }
.post__hero { aspect-ratio: 16 / 8; border-radius: 14px; background-size: cover; background-position: center; background-color: #ece3d6; margin-bottom: 2rem; }
.post__meta { color: #9aa3ac; font-size: 0.88rem; margin-bottom: 1.4rem; }
.post p { color: #44505a; margin-bottom: 1.2rem; }
.post h2 { margin: 2rem 0 0.8rem; font-size: 1.55rem; }
.post__back { display: inline-block; margin-top: 2rem; font-weight: 600; }

/* ===================================================================
   Footer — columns-classic
   =================================================================== */
.site-footer { background: #14181f; color: #aeb7c2; padding: 3.5rem 0 1.75rem; }
.site-footer__cols { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 2.25rem; }
.site-footer__brand img { width: 36px; height: 36px; margin-bottom: 0.9rem; }
.site-footer__brand .name { font-family: 'Lora', serif; font-size: 1.25rem; color: #ffffff; }
.site-footer__blurb { font-size: 0.92rem; color: #8b95a1; max-width: 22rem; margin-top: 0.7rem; }
.site-footer h4 { color: #ffffff; font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 1rem; }
.site-footer__links { list-style: none; }
.site-footer__links li { margin-bottom: 0.6rem; }
.site-footer__links a { color: #aeb7c2; font-size: 0.94rem; }
.site-footer__links a:hover { color: #e0894f; text-decoration: none; }
.site-footer address { font-style: normal; font-size: 0.92rem; color: #8b95a1; line-height: 1.7; }
.site-footer__bottom { border-top: 1px solid #262d38; margin-top: 2.5rem; padding-top: 1.4rem; display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; justify-content: space-between; align-items: center; }
.site-footer__bottom p { font-size: 0.85rem; color: #7e8893; }
.site-footer__legal { font-size: 0.82rem; color: #6f7884; max-width: 40rem; }
.cc-footer-link { color: #aeb7c2; cursor: pointer; }
.cc-footer-separator { color: #404956; }
@media (max-width: 820px) { .site-footer__cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .site-footer__cols { grid-template-columns: 1fr; } }

/* ===================================================================
   Page transitions / scroll reveal (animation_type: page-transitions)
   =================================================================== */
.page-fade { animation: pageFade 0.5s ease both; }
@keyframes pageFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.reveal { opacity: 0; transform: translateY(22px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .page-fade { animation: none; }
  .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* mobile_behavior: swipe-sections — horizontal snap row on small screens */
@media (max-width: 560px) {
  .swipe-row { display: grid; grid-auto-flow: column; grid-auto-columns: 82%; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding-bottom: 0.5rem; }
  .swipe-row > * { scroll-snap-align: start; }
}

/* ===================================================================
   Cookie banner accent override (match site palette)
   =================================================================== */
.cc-btn-primary { background: #c75d38 !important; border-color: #c75d38 !important; }
.cc-btn-primary:hover { background: #a8482a !important; border-color: #a8482a !important; }
.cc-link { color: #c75d38 !important; }

/* ===================================================================
   Mobile menu module — slide-left (functional CSS, module-owned)
   =================================================================== */
[data-mm-header]{--mm-bg:#ffffff;--mm-text:#333333;--mm-primary:#2563eb;--mm-overlay-bg:rgba(0,0,0,0.5);--mm-transition:0.3s ease}
[data-mm-header]{position:relative}
[data-mm-toggle]{display:flex;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:8px;z-index:1001}
[data-mm-toggle] span{display:block;width:24px;height:2px;background:var(--mm-text);transition:var(--mm-transition)}
[data-mm-menu]{position:fixed;top:0;left:0;width:280px;max-width:85vw;height:100vh;height:100dvh;background:var(--mm-bg);transform:translateX(-100%);transition:transform var(--mm-transition);z-index:1100;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;padding:60px 24px 24px}
[data-mm-menu].mm-open{transform:translateX(0)}
[data-mm-menu] ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
[data-mm-menu] ul li a{display:block;padding:14px 0;color:var(--mm-text);text-decoration:none;font-size:16px;border-bottom:1px solid rgba(0,0,0,0.08);transition:color var(--mm-transition)}
[data-mm-menu] ul li a:hover{color:var(--mm-primary)}
[data-mm-close]{position:absolute;top:16px;right:16px;background:none;border:none;font-size:28px;line-height:1;cursor:pointer;color:var(--mm-text);padding:4px 8px}
[data-mm-overlay]{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--mm-overlay-bg);opacity:0;visibility:hidden;transition:opacity var(--mm-transition),visibility var(--mm-transition);z-index:1050}
[data-mm-overlay].mm-visible{opacity:1;visibility:visible}
@media(min-width:768px){[data-mm-toggle]{display:none!important}[data-mm-menu]{position:static!important;width:auto!important;max-width:none!important;height:auto!important;background:transparent!important;transform:none!important;padding:0!important;overflow:visible!important;flex-direction:row!important}[data-mm-menu] ul{flex-direction:row;gap:0;align-items:center}[data-mm-menu] ul li a{padding:8px 16px;border-bottom:none;font-size:inherit}[data-mm-close]{display:none!important}[data-mm-overlay]{display:none!important}}
@media(prefers-reduced-motion:reduce){[data-mm-menu],[data-mm-overlay],[data-mm-toggle] span{transition:none!important}}
