.hero-container {
    position: relative;
    width: 100%;
    height: 45vh;     /* Reduced height */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.hero-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ensures the image covers the container without distortion on larger screens */
    z-index: -1;
	padding-bottom: 10vh;
}

:root {
     color-scheme: light only;
}

/* Mobile-specific styles */
@media (max-width: 768px) {
    .hero-image {
        object-fit: contain; /* Ensures the image fits within the container on smaller screens */
		height:65% !important;
    }
}

.hero-text {
    text-align: center;
    color: white;
}

.hero-text h1 {
    font-size: 4em;
    margin-bottom: 20px;
}

.hero-text p {
    font-size: 1.5em;
}

/* Adjust text size on smaller screens */
@media (max-width: 768px) {
    .hero-text h1 {
        font-size: 2em;
    }

    .hero-text p {
        font-size: 1.2em;
    }
}



body.menu-open {
    overflow: hidden;
}

/* Estilos gerais para o submenu */
.mobile-dropdown {
    position: relative;
}

html * {
    letter-spacing: 1px;
}

.mobile-dropdown .mobile-dropdown-content {
    display: none;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #F7F2EE;
}

.mobile-dropdown .mobile-dropdown-content li {
    padding: 10px;
}

.mobile-dropdown .mobile-dropdown-content li a {
    text-decoration: none;
    color: #472410;
}

/* Chevron icon styles */
.mobile-dropdown .chevron::before {
	border-style: solid;
	border-width: 0.15em 0.15em 0 0;
	content: '';
	display: inline-block;
	height: 0.45em;
	left: 0.15em;
	position: relative;
	transform: rotate(136deg);
	vertical-align: middle;
	width: 0.45em;	
    transition: transform 0.3s ease;
}

.mobile-dropdown.open .chevron::before {
    transform: rotate(136deg); /* Rotate for upward chevron */
	
    transition: transform 0.3s ease;
}

body {
    margin: 0;
    padding: 0;
    background: #F7F2EE;
    text-align: center;
    color: #472410;
}

header {
    background: #F7F2EE; /* Transparent background */
    padding: 20px 0;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    transition: box-shadow 0.3s ease-in-out;
    z-index: 1000;
    text-align: right; /* Align header content to the right */
}

header.scrolled {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

header.scrolled {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.desktop-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
	font-size:16px;
}

.desktop-nav ul li {
    position: relative;
    margin: 0 15px;
}

.desktop-nav ul li a {
    text-decoration: none;
    color: #472410;
    font-weight: bold;
}

.dropdown{
}

.desktop-nav ul li ul.dropdown-content {
    display: none;
    position: absolute;
    background: #F7F2EE;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    list-style: none;
    padding: 0;
    margin: 0;
    top: 100%;
    left: -90px;
    min-width: 100%;
    z-index: 999;
	width: 414px;
    text-align: left;
	font-size:16px;
	color:#472410;
}

.desktop-nav ul li ul.dropdown-content li {
    padding: 10px 20px;
}

.desktop-nav ul li:hover ul.dropdown-content {
    display: block;
}

.mobile-header {
    display: none;
}

#mobile-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #F7F2EE;
    transform: translateY(-100%); /* Start off-screen */
    transition: transform 0.3s ease-out; /* Smooth slide down */
    overflow-y: auto;
    z-index: 9999; /* Ensure it's above all other content */
    padding-top: 60px; /* Adjust as needed for header spacing */
}

#mobile-menu.show {
    transform: translateY(0); /* Slide into view */
}

.mobile-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
    font-family: 'Maleah Regular', sans-serif;
}

.mobile-menu ul li {
    padding: 18px 0;
}

.mobile-menu ul li a {
    color: #472410;
    text-decoration: none;
    font-weight: bold;
}

.hamburger {
    display: block;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0px 15px;
    position: relative;
    z-index: 1001;
	float: right;
}

.hamburger .bar {
    display: block;
    width: 25px;
    height: 3px;
    background: #333;
    margin: 5px 0;
    transition: all 0.3s ease;
}

.close-btn {
    background: transparent;
    border: none;
    font-size: 36px;
    color: #333;
    cursor: pointer;
    position: absolute;
    top: 15px;
    right: 15px;
}

.mobile-menu.show {
    transform: translateY(0);
}

.mobile-menu-content {
    display: flex;
    flex-direction: column;
}

.mobile-menu-content a {
    text-decoration: none;
    color: #333;
    padding: 15px;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
}

.mobile-dropdown-content {
    display: none; /* Hidden by default */
    flex-direction: column;
}

.mobile-dropdown.open .mobile-dropdown-content {
    display: flex; /* Show when open */
}

main {
    padding: 60px 0px 0px 0px;
}

h1 {
    font-size: 3em;
    margin: 0;
}

p {
    font-size: 1.4em;
    margin: 20px 0 0;
}

a:focus, a:hover {
    color: #23527c;
    text-decoration: none !important;
}

.BurgerText{
	font-size: 18px;
}
.my-justify{
	text-align: justify;
}	

.BigTitle{
 font-size:36px;
}
.imgmarginbottom{
	margin-bottom:0px;
}
.images{
	border-radius:16px;max-width:100%;height:auto;
}
.imagesCandle{
	border-radius:16px;max-width:100%;height:auto;
}
.Tematico{
	margin-top:45px;
}
.ImageCandleIndex {
	display:block;
}
.ImageCandleIndexReverse {
	display:none;
}
@media screen and (max-width: 768px) {
.ImageCandleIndex {
	display:none;
}
.ImageCandleIndexReverse {
	display:block;
}
	
.images{
	border-radius:16px;max-width:90%;height:auto;
}
.Tematico{
	margin-top:0px;
}
.imagesCandle{
	margin-top:-40px;
	       border-radius: 54px;
        padding: 30px;
        height: auto;
}
.titleSize{
	font-size:28px !important;
}
.imgmarginbottom{
	margin-bottom:20px;
}

}
@media screen and (max-width: 1370px) and (min-width: 1200px) {
	.OverrideBootstrap{
		width:100% !important;
	}
}
@media screen and (max-width: 1370px) and (min-width: 768px) {

		.IntermediateSize {
			width: 100% !important;
		}
	.PinkTitle{
		margin-top:32px;
    font-size: 22px;
    line-height: 35px;
    font-family: 'Maleah Regular' !important;
	}
		.MobileCenter{		
		text-align:center;
	}

	
	.MobileTitlePink{
		color:#D18741 ! important;
		font-size:20px;
	}
			
	.MobileWidthCandle{
		width:30em;
		margin-left:auto;
		margin-right:auto;		
		}
	.WhiteRoseTransform{
		transform:rotate(-90deg);
		margin-top: -30px;
	}
	.WhiteRose{
	}
			.FontSizeTop{
		font-size: 22px !important;
	}
	}
	
@media screen and (min-width: 1200px) {
	.my-justify{
		text-align: justify;
	}
		.FontSizeTop{
		font-size: 22px;
	}
			.FontSizeTopDogy{
		font-size: 24px;
	}
		.FontSizeTop2{
		font-size: 33px;
	}
		.FontSizeTop3{
		font-size: 56px;
	}
	.FontSizeTopDog{
		margin-top: -3px;
		margin-bottom: -3px;
		font-size: 32px;
	}
		.QuestPratc{
		padding-bottom:32px;
	}
.PinkTitle{
	background-color: #D18741;
    box-shadow: 0.4em 0 0 #D18741, -0.4em 0 0 #D18741;
    color: black !important;
    font-size: 22px;
    line-height: 35px;
    margin-left: -33px;
    margin-top: 10px;
	Width: fit-content;
    font-family: 'Maleah Regular' !important;
    
}
	
	.MobileWidthCandle{
		width:30em;
		transform: scaleY(1.09);
		Margin-top:20px;
	}
	
	


	.WhiteRose{
		width: 27em !important;
		padding-top: 10px;
		margin-top:39px;
	}
}

@media screen and (max-width: 1370px) {	

	.my-justify{
		text-align: justify;
	}
.Acompanhamento{
padding-top:25px !important;
padding-bottom: 50px !important;	
}
p{
	font-size:14px;
}
.dogmargin{
	
}

.Nome{
	font-size: 33px;
}
.headerdiv{
	padding-top:50px !important;
	padding-bottom: 0px !important;
}
	
.CatClass{
		width:96%;
		    margin-top: 20px;
	}
		.QuestPratc{
			font-size: 7vw;
		padding-bottom:22px;
	}
	.MobileWidth{
		width:100%
	}
	.MobileWidthCompass{
		width:100%
	}
	.PinkTitle{
    font-size: 24px;
    line-height: 35px;
    font-family: 'Maleah Regular' !important;
	}
		.MobileCenter{		
		text-align:center;
	}

	
	.MobileTitlePink{
		color:#D18741 ! important;
		font-size:20px;
	}
	.JustifyPC{
		text-align: justify!important;
	}
	
	.JustifyCenter{
		text-align: justify !important;
	}
	
	.MobileTopMargin {
		Margin-top:24px;
	}
	
	.FontSizeTop{
	}
	
	.FontSizeTop2{
		font-size: 6.8vw;
		font-weight:bold;
	}
	
	.FontSizeTop3{
		font-size: 9vw !important;
	}
	
	.FontSizeTopDog{
		
		font-size: 5.7vw !important;
	}
	
	.MobileWidthDogs{
		width:100%
	}

	
	.MobileWidthLogo{
		width:25%
	}
	
	.MobileMarginCandle{
	}
	.MobilePaddingCandle{
	}
	.Feather{
		transform: rotate(13deg);	
		    margin-left: 10px;
	}
	.FeatherDiv{
		margin-top: -5px;
	}
	
	.LeituraFeminina{
		    margin-top: -10px !important;
	}

.HeaderPadding{
}
.ImageBottomMargin{
	margin-bottom:10px;
}
.MobileMargin{
	margin-top:-1px;
}

.BordauxText{
	font-size:18px;
}
.BordauxPadding{
	
}
.BigTitle{
 font-size:34px;
}

.FerramentasTitle{
	
    font-size: 22px;
    line-height: 35px;
    margin-top: 24px;
    font-family: 'Maleah Regular' !important;
    
}	
	.header{
		    background-image: url(../img/Header_mobile.png);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 148vw;
    background-position: 53% 130.7%;
	}	
	.headerDog{
		    background-image: url(../img/NewHeaderDogsShort.png);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 148vw;
    background-position: 53% 130.7%;
	}
.SizePequeno{
	font-size:16px;
}
	
	.MobilePaddingDogs{
	}
	.HeaderM{
		display:inline-block;
	}
	.HeaderP{
		display:none;
	}
	.desktop-nav {
        display: none;
    }
    .mobile-header {
        display: block;
    }
}

@media screen and (min-width: 1370px) {
	.Acompanhamento{
padding-top:50px !important;
padding-bottom: 50px !important;	
}

.Nome{
	font-size: 36px;
}
	.headerdiv{
	padding-top:100px !important;
	padding-bottom: 0px !important;	
	}
	
		.JustifyCenter{
		text-align: Center !important;
	}
	
	.dogmargin{
		margin: 25px 90px 0px 90px;
	}
	.CatClass{
		width:100%;
		margin-top: 38px;
	}
	.JustifyPC{
		text-align: justify!important;
	}
	
	.QuestPratc{
		padding-bottom:32px;
		font-size:28px;
	}
	
	.Feather{
		width:31%;
		transform: rotate(13deg);		
		margin-left: auto;
		margin-right: auto;
		margin-top: 32px;
		margin-bottom: -25px;
	}
	.FeatherDiv{
		margin-right: -137px;
		margin-left: -110px;
		margin-top: -5px;
	}
	.HeaderM{
		display:none;
	}
	.HeaderP{
		display:inline-block;
	}
	
.SizePequeno{
	font-size:18px;
}
	.header{
background-image: url(../img/Header.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 23vw;
	}
	.headerDog{
background-image: url(../img/Header__animals_pc.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: 24vw;
	}
	.MobileWidth{
		width:36em;
		margin-top: 28px;
	}
	.MobileWidthCompass{
		width:39em;
		margin-top: 28px;
	}
	.MobileWidthDogs{
		width:21vw
	}
	
	.MobileMargin{
	margin-top:-1px;
	}
	.MobileWidthLogo{
		width:6%
	}
	
	.MobilePaddingDogs{
		padding: 0 20px 0 20px;
	}
	
	.MobileMarginCandle{
		/*margin-top: 5%;*/
	}
	.MobilePaddingCandle{		
		padding-left:50px;
		margin-top: 1%;
	}
	
.FerramentasTitle{
	
    font-size: 32px;
    line-height: 35px;
    margin-top: 50px;
    
}

	.DogText{
		text-align: justify;
		line-height:1.25;
		padding-left:30px!important;
	}
.BordauxText{
	font-size:19px;
	letter-spacing:1px;
}
.BordauxPadding{
	    padding-left: 20px; 
}
	
.HeaderPadding{
	padding-top: 44px;
    padding-right: 3px;
    padding-bottom: 117px;
    padding-left: 3px;
}

.ImageBottomMargin{
}
}

.titleSize{
	font-size:36px;
}

.row{
	    margin-left: auto !important;
    margin-right: auto !important;
}

.collapsed.Fechado{
	display: block;
}

.Fechado{
	display: none;
}

.collapsed.Aberto{
	display: none;
}

.Aberto{
	display: block;
}
.w3-content{
	max-width: 1200px !important;
}
.img-responsive{
	display:initial;
}

.LineTopics{
	line-height: 1.0;
}

.w3-padding-64{
	padding-top: 50px!important;
    padding-bottom: 50px!important;
}

/* Center feedback text inside carousel slides */
/* --- Feedback Carousel: keep Bootstrap show/hide behavior --- */

#feedbackCarousel .carousel-item{
  /* hidden by default, Bootstrap logic */
  display: none;
  text-align: center;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  padding: 40px 20px;

  /* keep your stacking behavior */
  grid-area: 1 / 1;
}

/* show only active + transitioning items */
#feedbackCarousel .carousel-item.active,
#feedbackCarousel .carousel-item-next,
#feedbackCarousel .carousel-item-prev{
  display: flex;
}

#feedbackCarousel .carousel-item p{
font-size: var(--ts-body);
  line-height: var(--lh-body);
  line-height: 1.6;
  color: #472410;
}

#feedbackCarousel .carousel-item small{
  display: block;
  color: #A67C52;
}

#feedbackCarousel .carousel-control-prev-icon,
#feedbackCarousel .carousel-control-next-icon{
  filter: invert(1) brightness(0);
}

/* Limit text width so arrows never overlap */
#feedbackCarousel .carousel-content{
  max-width: 900px;
  margin: 0 auto;
  padding: 0 60px;
}

/* Keep height of tallest slide */
#feedbackCarousel .carousel-inner{
  display: grid;
}


.carousel-item p {
font-size: var(--ts-body);
  line-height: var(--lh-body);
    line-height: 1.6;
    color: #472410;
}

.carousel-item small {
    display: block;
    color: #A67C52;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: invert(1) brightness(0); /* make arrows black */
}
/* Limit text width so arrows never overlap */
.carousel-content {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 60px; /* space for arrows */
}
/* Make carousel keep the height of the tallest slide */
.carousel-inner {
    display: grid;
}


.site-footer {
  background-color: #F7F2EE;
  color: #472410;
  padding: 10px 10px 10px;
  font-size: 16px;
}

.footer-container {
  width: 800px;
  max-width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 30px;
}

.site-footer {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
      text-align: left;
}

.footer-column h4 {
  font-size: 1rem;
  margin-bottom: 10px;
  color: #472410;
    display: flex;
  flex-direction: column;
}

.footer-column p {
  margin: 0;
  line-height: 1.6;
}

.footer-column{
  width: 100%;              /* key: gives the UL space to move right */
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  width: max-content;       /* shrink-wrap to the longest item */
  margin-left: auto;        /* push UL to the right */
  margin-right: 0;
  text-align: center;       /* center each LI/link within the UL width */
  padding-left: 0;          /* if you have default UL padding */
  list-style: none;         /* optional */
}

.footer-links li {
  margin-bottom: 6px;
}

.footer-links a,
.site-footer a {
  color: #C18787;
  text-decoration: none;
}

.site-footer a:hover {
  text-decoration: underline;
}

.footer-disclaimer {
  max-width: 900px;
  margin: 30px auto 20px;
  font-size: 0.85rem;
  color: #6b4a32;
  text-align: center;
}

.footer-bottom {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 15px;
  text-align: center;
  font-size: 0.8rem;
  color: #6b4a32;
}
  .contact-form {
    max-width: 600px;
    margin: 0 auto;
    display: grid;
    gap: 18px;
  }

  .contact-form label {
    display: flex;
    flex-direction: column;
    font-size: 1.5rem;
    color: #472410;
  }

  .contact-form input,
  .contact-form textarea,
  .contact-form select {
    padding: 10px;
    font-size: 1.5rem;
    border: 1px solid #ccc;
    border-radius: 6px;
  }

  .form-toggle {
    border: none;
    padding: 0;
    margin: 0;
  }

  .form-toggle label {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    margin-right: 18px;
  }

.gdpr{
  display: flex;
  align-items: flex-start; /* keeps checkbox aligned nicely */
  gap: 10px;
  text-align: left;
}

.gdpr a{
  white-space: nowrap; /* prevents “Política de Privacidade” splitting */
}


  .gdpr input {
    margin-right: 10px;
  }

  .contact-form button {
    background: #472410;
    color: #fff;
    border: none;
    padding: 12px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 6px;
  }

  .contact-form button:disabled {
    opacity: 0.7;
    cursor: not-allowed;
  }

  .form-message {
    padding: 12px;
    border-radius: 6px;
    font-size: 0.95rem;
  }

  .form-message.success {
    background: #eef7f0;
    color: #1f5f2a;
    border: 1px solid #cfe9d5;
  }

  .form-message.error {
    background: #fff1f1;
    color: #7a1f1f;
    border: 1px solid #f0caca;
  }

  .contact-form a {
    color: #8a8b60;
    text-decoration: none;
  }

  .contact-form a:hover {
    text-decoration: underline;
  }
button,
input,
select,
textarea {
  font: inherit;              /* font-family + font-size + line-height */
  letter-spacing: inherit;
  color: inherit;
}
ul.no-bullets {
  list-style-type: none; /* Remove bullets */
  padding: 0; /* Remove padding */
  margin: 0; /* Remove margins */
}
.footer-support{
  margin: 12px 0 0;
  color: #472410;        /* match your palette */
  font-size: 16px;    /* slightly smaller than body */
  opacity: 0.9;
}

/* Force the GDPR line to be one row: checkbox left, text right */
label.gdpr{
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 10px;
  text-align: left;
}

/* Undo any global rules that make inputs full width/block inside labels */
label.gdpr > input[type="checkbox"]{
  display: inline-block !important;
  width: auto !important;
  flex: 0 0 auto;
}

/* Keep the text next to it */
label.gdpr > span{
  display: inline-block;
  flex: 1 1 auto;
}

/* Optional: stop “Política de Privacidade” breaking into 2 lines */
label.gdpr a{
  white-space: nowrap;
}
.imageTerapias{
	padding-right:18px;
}
.imageTerapiasLeft{
	padding-left:18px;
}

.LinkAlign {
	text-align: justify;
}

.MarginRosa{
	margin-top:10px;
}

.MarginAlinhamento {
	margin-top:-33px;
}

@media (max-width: 768px){
.imageTerapiasLeft{
	padding-left:0px;
}
  .contact-form{ padding: 0 16px; }
  .contact-box{
    margin-bottom: 30px !important;
  }
  .imageTerapias{
	padding-right:0px;
}
.LinkAlign {
	text-align: center;
}
.MarginRosa{
	margin-top:23px;
}
.MarginAlinhamento {
	margin-top:14px;
}
}
  
  /* =========================================================
   TYPE SCALE FINAL — MULI (MULISH)
   Paste this at the END of styles.css
   ========================================================= */

/* 1) Local font files (./fonts/) */
@font-face {
  font-family: "Muli";
  src: url("./fonts/Muli-Regular.woff2") format("woff2"),
		url("./fonts/Muli-Regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Muli";
  src: url("./fonts/Muli-SemiBold.woff2") format("woff2"),
		url("./fonts/Muli-SemiBold.woff") format("woff"); 
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Muli";
   src: url("./fonts/Muli-Bold.woff2") format("woff2"),
		url("./fonts/Muli-Bold.woff") format("woff");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

/* Optional: if you want a "Medium (500)" slot but don't have the file,
   map it to Regular (400) so at least the CSS weight exists. */
@font-face {
  font-family: "Muli";
  src: url("./fonts/Muli-Regular.woff") format("woff");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
html, body{
  height: 100%;
  font-family: var(--font-sans);
}
/* 2) Design tokens (desktop defaults) */
:root{
  --font-sans: "Muli", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --color-text: #472410;

  /* Desktop (≥1024px) */
  --ts-body: 19px;
  --lh-body: 1.75;

  --ts-small: 16px;
  --lh-small: 1.6;

  --ts-h1: 44px;
  --lh-h1: 1.15;
  --h1-max: 22ch; /* recommended 18–22ch */

  --ts-h2: 30px;
  --lh-h2: 1.3;

  --ts-h3: 24px;
  --lh-h3: 1.35;

  --ts-highlight: 20px;
  --lh-highlight: 1.5;

  --ts-nav: 16px;
  --lh-nav: 1.2;

  --ts-btn: 16px;
  --lh-btn: 1.2;
  --btn-min-h: 44px;
}

/* 3) Hard override your current global font + letter-spacing */
html body,
html body *{
  font-family: var(--font-sans) !important;
  letter-spacing: normal !important;
}

main{
  flex: 1; /* pushes footer to bottom when content is short */
}

/* 4) Base typography */
body{
	  min-height: 100vh;
  display: flex;
  flex-direction: column;
  color: var(--color-text) !important;
  font-weight: 400;
  font-size: var(--ts-body);
  line-height: var(--lh-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  text-align: justify;
}

p, li, dt, dd, blockquote{
  font-size: inherit;
  line-height: inherit;
  font-weight: 400;
}

/* 5) Type scale classes (use these in HTML when you need control) */
.t-body{
  font-size: var(--ts-body);
  line-height: var(--lh-body);
  font-weight: 400;
}

.indent-1{
	text-indent:30px;
}

.t-small{
  font-size: var(--ts-small);
  line-height: var(--lh-small);
  font-weight: 400;
}

.t-h1{
  font-size: var(--ts-h1);
  line-height: var(--lh-h1);
  font-weight: 700;
}

.t-h2{
  font-size: var(--ts-h2);
  line-height: var(--lh-h2);
  font-weight: 600;
}

.t-h3{
  font-size: var(--ts-h3);
  line-height: var(--lh-h3);
  font-weight: 600;  
    text-align: left;
}

.t-highlight{
  font-size: var(--ts-highlight);
  line-height: var(--lh-highlight);
  font-weight: 500;
}

/* 6) Apply scale to semantic tags too (so you don't need classes everywhere) */
h1{
  font-size: var(--ts-h1) !important;
  line-height: var(--lh-h1) !important;
  font-weight: 700 !important;
  margin: 0 0 0.6em;
}

h2{
  font-size: var(--ts-h2) !important;
  line-height: var(--lh-h2) !important;
  font-weight: 600 !important;
  margin: 1.2em 0 0em;
}

h3{
  font-size: var(--ts-h3) !important;
  line-height: var(--lh-h3) !important;
  font-weight: 600 !important;
  margin: 1em 0 0.4em;
}

/* Optional: small text tags */
small, .small, .note, figcaption{
  font-size: var(--ts-small);
  line-height: var(--lh-small);
  font-weight: 400;
}

/* 7) Navigation + buttons (classes + sensible targeting) */
.t-nav,
.desktop-nav ul,
.desktop-nav ul li a{
  font-size: var(--ts-nav) !important;
  line-height: var(--lh-nav) !important;
  font-weight: 600 !important;
}
.mobile-menu ul li a{
  font-size: 18px !important;
  line-height: var(--lh-nav) !important;
  font-weight: 600 !important;
}

.t-button,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.contact-form button{
  font-size: var(--ts-btn) !important;
  line-height: var(--lh-btn) !important;
  font-weight: 600 !important;
  min-height: var(--btn-min-h);
  padding: 12px 18px;
}

/* 8) Mobile overrides (≤768px) */
@media (max-width: 768px){
  :root{
    --ts-body: 17px;
    --lh-body: 1.75;

    --ts-small: 15px;
    --lh-small: 1.6;

    --ts-h1: 30px;
    --lh-h1: 1.2;
    --h1-max: 18ch; /* recommended 16–18ch */

    --ts-h2: 24px;
    --lh-h2: 1.3;

    --ts-h3: 20px;
    --lh-h3: 1.35;

    --ts-nav: 17px;
    --ts-btn: 17px;
  }
}
/* --- Helpers used in HTML updates --- */
.bg-page{
  background: #F7F2EE;
}

.text-brand{
  color: #472410 !important; /* your brown */
}

.text-accent{
  color: #C18787 !important; /* your accent pink */
}

.link-accent{
  color: #C18787 !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.link-accent:hover,
.link-accent:focus{
  text-decoration-thickness: 2px;
}

/* paragraph indent helper */
.indent-1{
  text-indent: 30px;
}
@media (max-width: 768px){
  .site-footer{
    text-align: center;              /* center text by default */
  }

  .footer-container{
    justify-items: center;           /* center each grid item */
  }

  .footer-column{
    display: flex;
    flex-direction: column;
    align-items: center;             /* center children (UL + p) */
  }

  .footer-links{
    width: auto;                     /* stop shrink-wrap right alignment */
    margin-left: 0;                  /* remove “push to right” */
    margin-right: 0;
    text-align: center;              /* keep LI centered */
  }

  .footer-support{
    text-align: center;
  }
}
.no-bullets a{
  color: #C18787;
}
input::placeholder {
 color: #A67C52;
 font-style: italic;
 opacity: 0.7;
}
textarea::placeholder {
 color: #A67C52;
 font-style: italic;
 opacity: 0.7;
}
.contact-form select{
  color: #A67C52;
}

/* Dropdown options (works in many cases, not all) */
.contact-form select option{
  color: #A67C52;          /* or another color */
}

.quote-heart{
	font-family: "Segoe UI Symbol","Apple Color Emoji","Noto Color Emoji",sans-serif !important;
	margin-right: -10px;
  font-size: 1.1em;
  color: #C18787;
}

/* mobile overrides */
@media (max-width: 768px){
  .quote-heart{
  color: #C18787;
    font-size: 1.35em;   /* bigger on mobile */
	margin-right: -5px;
    display: inline-block;
    transform: translateY(1px); /* optional tweak */
  }
  .heart-icon{
  width: 1.0em !important;
  margin-top:6px;
  height: 1.1em;
  vertical-align: middle;
  display: inline-block;
  fill: currentColor;
}
}
.heart-icon{
  width: 1.1em;
  height: 1.1em;
  vertical-align: middle;
  display: inline-block;
  fill: currentColor;
      font-size: 1.2em;
}
.headertext-img{ width: 100%; height: auto; }
@media (min-width: 768px){
  .headertext-img{ width: 85%; }
}

.imageTerapias img{
  margin: 0 auto;
  width: 100%;
  height: auto;
}

.marginBottomChave{
	margin-bottom:0px !important;
}
.LuaNova{
	margin-top:70px;
}

.LeituraAura{
	margin-top: 15px;
}

@media (max-width: 768px){
  .imageTerapias img{ max-width: 90%; } /* matches your .images mobile intent */
  
.marginBottomChave{
	margin-bottom:23px !important;
}
.LuaNova{
	margin-top:45px;
}
.LeituraAura{
	margin-top: 0px;
}
}

.terapia-thumb{
  width: 100%;
  max-width: 260px;      /* pick a size you like */
  aspect-ratio: 1 / 1;   /* square; or 4/5, 3/4, etc */
  overflow: hidden;
  border-radius: 16px;
  margin: 0 auto;
}

.terapia-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Desktop/tablet (not mobile): show ImageBottomVisibility, hide Reverse */
.ImageBottomVisibility { display: block; }
.ImageBottomVisibilityReverse { display: none; }

/* Mobile */
@media (max-width: 600px) {
  .ImageBottomVisibility { display: none !important; }
  .ImageBottomVisibilityReverse { display: block !important; }
}