/* RESET & NORMALIZE */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
  margin:0; padding:0; border:0; font-size:100%; font: inherit; vertical-align: baseline; box-sizing:border-box;
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{
  display:block;
}
body{
  line-height:1.5; background: #FDF6F3; min-height: 100vh;
  width:100vw; overflow-x:hidden;
  color: #264653;
}
*, *:before, *:after { box-sizing: border-box; }
img,svg{ max-width:100%; display: block; height: auto; }
button, input, select, textarea{ font-family: inherit; font-size: inherit; color: inherit; }
a{ color: inherit; text-decoration: none; transition: color 0.2s; }
ul,ol{ list-style-position: outside; }

/* FONT IMPORT */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700&family=Lato:wght@400;700&display=swap');

body {
  font-family: 'Lato', Arial, Helvetica, sans-serif;
  font-size: 16px;
  background: #FDF6F3;
  color: #264653;
  min-height: 100vh;
}

h1,h2,h3,h4,h5,h6{
  font-family: 'Playfair Display', serif;
  color: #264653;
  margin-bottom: 10px;
}
h1{ font-size: 2.5rem; letter-spacing: -0.03em; margin-bottom: 20px; }
h2{ font-size: 2rem; margin-bottom: 16px; }
h3{ font-size: 1.35rem; }
h4{ font-size:1.1rem; }
@media (max-width: 768px) {
  h1{ font-size: 2rem; }
  h2{ font-size: 1.4rem; }
}

.subheadline {
  font-family: 'Lato', Arial, Helvetica, sans-serif;
  color: #3C4858;
  font-size: 1.18rem;
  margin-bottom: 20px;
}
p,li,blockquote{
  font-size:1rem;
  color: #38495a;
  margin-bottom: 10px;
  letter-spacing: 0.01em;
}
blockquote{
  font-style: italic;
  color: #264653;
  background: #FEF9F6;
  padding: 16px 24px; border-left: 5px solid #F4A261;
  border-radius: 12px 0 0 12px;
  margin-bottom: 8px;
}
cite {
  font-size:0.95rem;
  font-style: normal;
  color: #597478;
  margin-left: 15px;
}

strong {
  font-weight: 700;
  color: #5787A3;
}

.container {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

.section {
  margin-bottom: 60px; padding: 40px 20px;
}

.content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.text-section {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 740px;
  margin: 0 auto;
  padding: 0 0 16px 0;
}

.feature-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: space-between;
}
.feature-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
  background: #FBF5F7;
  border-radius: 18px;
  margin-bottom: 20px;
  padding: 30px 22px 24px 22px;
  box-shadow: 0 3px 20px 0 rgba(244,162,97,0.07);
  flex: 1 1 220px;
  min-width: 220px;
  transition: box-shadow 0.2s;
}
.feature-item img {
  width: 48px; height: 48px;
}
.feature-item:hover {
  box-shadow: 0 8px 32px 0 rgba(113,108,227,0.09), 0 4px 20px 0 rgba(244,162,97,0.10);
  background: #FCFBFF;
}
.feature-item h3 {
  margin-bottom: 0;
}

.card-container,
.card-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.card {
  margin-bottom: 20px;
  position: relative;
  background: #FFFFFF;
  border-radius: 20px;
  box-shadow: 0 3px 15px 0 rgba(113,108,227,0.07);
  padding: 30px 22px 24px 22px;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.2s;
}
.card:hover {
  box-shadow:0 8px 32px 0 rgba(113,108,227,0.11), 0 4px 18px 0 rgba(244,162,97,0.13);
}
.content-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
}
.text-image-section{
  display:flex;
  align-items:center;
  gap:30px;
  flex-wrap: wrap;
}
@media(max-width:768px){
  .content-grid,.feature-grid,.card-container,.card-grid{
    flex-direction:column;
    gap:20px;
  }
  .text-image-section{
    flex-direction: column;
    align-items:flex-start;
    gap:22px;
  }
}

.testimonial-card {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 24px;
  background: #FFF9F5;
  border-radius: 18px;
  box-shadow: 0 2px 10px 0 rgba(244,162,97,0.09);
  margin-bottom: 22px;
  transition: box-shadow 0.25s, background 0.25s;
  border: 1px solid #FAE1CE;
  color: #22313A;
}
.testimonial-card:hover{
  box-shadow: 0 6px 30px 0 rgba(244,162,97,0.17);
  background: #FEF9F6;
}
.testimonial-card blockquote{
  background:none;
  border-left:4px solid #F4A261;
  font-size:1.08rem;
  color: #22313A;
  padding-left:16px;
  margin-bottom:0;
}
.testimonial-card cite{
  color: #526C80;
  margin-left: 10px;
}

/* Spacing for main blocks */
section,
.section {
  margin-bottom: 52px;
  padding-top: 24px;
}

ul, ol {
  margin-bottom: 18px;
  margin-left: 1.5em;
  padding-left: 6px;
}
ul li, ol li{
  margin-bottom: 8px;
}

.quick-links{
  margin-top:10px; margin-bottom:6px;
  font-size:1rem; color:#6B7659;
}
.quick-links a{color:#3B5C51; text-decoration: underline;}
.quick-links a:hover{text-decoration: none; color: #CB8971;}

/* HEADER & NAVIGATION */
header{
  width:100%;
  background: #FFF9F6;
  box-shadow:0 4px 32px 0 rgba(244,162,97,0.06);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 16px 22px 12px 22px;
  position:relative;
  z-index: 110;
}
header > a img {
  width: 25px; height: auto;
  margin-right: 18px;
}
.main-nav {
  display: flex;
  flex-direction: row;
  gap: 22px;
  margin: 0 20px;
  align-items: center;
}
.main-nav a {
  font-family: 'Lato', Arial, sans-serif;
  font-size: 1rem;
  color: #335672;
  padding: 7px 14px;
  border-radius: 16px;
  background: transparent;
  position:relative;
  transition: background 0.2s, color 0.2s;
}
.main-nav a:hover,
.main-nav a:focus {
  background: #FAE1CE;
  color: #B75B30;
}

.cta-main {
  background: #F4A261;
  color: #264653;
  font-family: 'Lato', Arial, sans-serif;
  font-weight: 700;
  font-size:1.08rem;
  padding: 11px 28px;
  border-radius: 20px;
  box-shadow: 0 1.5px 6px 0 rgba(244,162,97,0.15);
  border:none;
  cursor:pointer;
  margin-left: 16px;
  display: inline-block;
  transition: background 0.2s, color 0.2s, box-shadow 0.16s;
}
.cta-main:hover, .cta-main:focus {
  background: #F6B06E;
  color: #fff;
  box-shadow: 0 5px 24px 0 rgba(244,162,97,0.32);
}

/* MOBILE NAVIGATION */
.mobile-menu-toggle {
  display:none;
  background:none;
  border:none;
  font-size:2rem;
  line-height: 1;
  color: #F4A261;
  cursor:pointer;
  margin-left: 20px;
  z-index: 202;
  transition: color 0.14s;
}
.mobile-menu-toggle:focus {
  outline: none; color: #db7740;
}
.mobile-menu {
  display:none;
  position:fixed;
  top:0; left:0; height:100vh; width:100vw;
  background:rgba(253, 246, 243,0.97);
  z-index: 200;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.73,0,0.22,1);
  box-shadow: -4px 0 18px 0 rgba(113,108,227,0.02);
  flex-direction: column;
  justify-content:flex-start;
  align-items: flex-start;
  padding-top: 40px;
}
.mobile-menu.open {
  display:flex; transform: translateX(0);
}
.mobile-menu-close {
  background:none;
  border:none;
  font-size:2.1rem;
  position:absolute; top:18px; right:22px;
  color: #F4A261;
  cursor:pointer;
  z-index: 205;
  transition: color 0.17s;
  padding: 6px; border-radius: 50%;
}
.mobile-menu-close:focus, .mobile-menu-close:hover {
  color: #cb7741;
  background:#FAE1CE;
}
.mobile-nav {
  display:flex;
  flex-direction:column;
  gap:18px; padding: 48px 0 0 28px;
}
.mobile-nav a {
  font-family: 'Lato', Arial, sans-serif;
  font-size:1.18rem;
  color:#335672;
  padding: 10px 18px;
  border-radius: 18px;
  background: none;
  margin-bottom: 5px;
  transition: background 0.21s, color 0.21s;
}
.mobile-nav a:hover,.mobile-nav a:focus{
  background: #FAE1CE;
  color: #B75B30;
}

@media (max-width:1050px){
  header {
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 8px 8px 8px;
  }
  .main-nav{
    gap: 12px;
    margin:0 6px;
  }
}
@media (max-width: 900px){
  .main-nav a, .cta-main{ font-size: 1rem; }
}
@media (max-width: 820px){
  header > a img { width: 25px; }
}
@media (max-width: 768px){
  header{ flex-direction:row; align-items:center; padding: 8px 8px 8px 10px; }
  .main-nav{ display:none; }
  .cta-main{ margin-left:10px; font-size: 1em; padding: 9px 16px; }
  .mobile-menu-toggle{ display:inline-block; }
}

/* FOOTER */
footer {
  background: #F6EDF9;
  padding:38px 22px 8px 22px;
  margin-top:48px;
  border-radius: 32px 32px 0 0;
  box-shadow:0 -3px 22px 0 rgba(186,133,242,0.08);
  color: #627177;
  font-size: 1rem;
}
.footer-nav{
  display: flex;
  flex-direction: row;
  flex-wrap:wrap; gap: 22px;
  margin-bottom:18px; justify-content: flex-start;
}
.footer-nav a {
  font-size:1rem;
  color: #58746C;
  padding: 6px 0px;
  text-decoration: underline;
  transition: color 0.11s;
}
.footer-nav a:hover, .footer-nav a:focus{ color:#cf7b32; text-decoration: none;}
address{ font-size:0.98rem; color: #6a7e81; margin-bottom:12px; display: flex; flex-direction: column; gap: 8px; }
address img{ width:18px;height:18px;vertical-align: middle; margin-right:5px; margin-bottom: -3px; display: inline-block; }
.footer-bottom{
  margin-top:12px;
  color:#8c9194;
  font-size:0.97rem;
  text-align:left;
}
@media (max-width: 640px){
  .footer-nav{flex-direction: column; gap: 11px;}
  footer{padding:20px 7px 8px 7px; border-radius:22px 22px 0 0; font-size:0.97rem;}
}

/* BUTTONS */
button,
input[type="button"],
input[type="submit"]{
  font-family: 'Lato', Arial, Helvetica, sans-serif;
  font-size: 1rem;
  background: #F4A261;
  color: #264653;
  border: none;
  border-radius: 20px;
  padding: 10px 22px;
  cursor: pointer;
  transition: background 0.18s, color 0.18s, box-shadow 0.12s;
  box-shadow: 0 1.5px 4px 0 rgba(244,162,97,0.14);
}
button:hover,
button:focus {
  background: #F6B06E;
  color: #fff;
}

/* FORMS */
input,textarea,select{
  border:1.4px solid #E8DBC6;
  border-radius: 8px;
  padding: 10px 14px;
  font-family: inherit; font-size:1rem;
  background: #FFFCF9;
  margin-bottom: 12px;
  width: 100%;
  transition: border 0.14s;
}
input:focus,textarea:focus,select:focus{
  border:1.6px solid #F4A261; outline:none; background: #FFF9F5;
}
label{ font-size: 1rem; color:#465a59; margin-bottom: 5px; display:block; }

/* COOKIES CONSENT BANNER */
.cc-banner {
  position:fixed;
  bottom:0;
  left:0;
  width:100vw;
  padding: 23px 16px 17px 16px;
  background: #F3F0F6;
  box-shadow: 0 -5px 30px 0 rgba(131,82,212,0.09);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  z-index: 9998;
  transition: transform 0.25s, opacity 0.25s;
  border-radius: 18px 18px 0 0;
}
.cc-banner.hide { opacity: 0; pointer-events:none; transform:translateY(120px);}
.cc-banner p {
  font-size:1rem;
  line-height:1.5;
  color:#33374a;
}
.cc-banner .cc-btns{
  display: flex; flex-direction: row; gap: 12px; margin-top: 7px;
}
.cc-banner button{
  font-size:1rem;
  padding: 9px 22px;
  background: #F4A261;
  color: #264653;
  border:none;
  border-radius:16px;
  margin:0;
  font-weight:600;
}
.cc-banner button:hover, .cc-banner button:focus{
  background: #F6B06E;
  color: #fff;
}
.cc-banner .cookie-settings{
  background: #fff;
  color: #44637b;
  border: 1px solid #E5DED5;
}
.cc-banner .cookie-settings:hover{
  background: #F6EDF9; color: #B75B30;
}

/* COOKIES CONSENT MODAL */
#cc-modal {
  display:none;
  position:fixed; top:0; left:0; width:100vw; height:100vh;
  background:rgba(38,70,83,0.13);
  z-index: 9999;
  justify-content: center; align-items: center;
}
#cc-modal.open {
  display: flex;
  animation: fadeIn 0.22s;
}
@keyframes fadeIn { 0%{ opacity:0;} 100%{opacity:1;} }
.cc-modal-content{
  background: #FFF9F6;
  border-radius:24px;
  box-shadow: 0 6px 45px #EBA98724;
  padding:36px 28px 28px 28px;
  max-width: 430px;
  width:95vw;
  display: flex; flex-direction:column; gap: 22px;
  position:relative;
}
.cc-modal-title{
  font-family:'Playfair Display',serif;
  font-size:1.38rem; color: #263137; margin-bottom:10px;
}
.cc-close{
  position:absolute; top:18px; right:22px;
  background: none;
  border:none; color: #F4A261;
  font-size:1.45rem; cursor:pointer;
  border-radius:50%; padding: 4px 8px;
}
.cc-close:hover,.cc-close:focus{color: #cb7741; background: #FAE1CE;}
.cc-modal-categories{
  display: flex; flex-direction:column; gap:13px;
  margin-top:10px;
}
.cc-category{
  font-size: 1rem; color:#3B5C51; display: flex; align-items: center; gap:12px;
}
.cc-category-toggle{
  width: 36px; height: 22px; border-radius:24px;
  background: #F3F1F7;
  position: relative;
  cursor:pointer;
  transition: background 0.23s;
  box-shadow: 0 1px 3px 0 rgba(244,162,97,0.04);
}
.cc-category-toggle input[type="checkbox"]{ display: none; }
.cc-category-toggle .cc-toggle-slider{
  position: absolute;
  left:2px; top:2px;
  width:18px; height:18px;
  background:#F4A261;
  border-radius:50%;
  transition: left 0.21s, background 0.22s;
}
.cc-category-toggle input[type="checkbox"]:checked + .cc-toggle-slider{
  left:16px; background: #7DE3B6;
}
.cc-category-desc{
  font-size: 0.98rem;
  color: #73608b;
}
.cc-modal-btns{
  margin-top:16px; display: flex; gap: 12px; flex-direction: row; justify-content: flex-end;
}
.cc-modal-btns button{
  font-size:1rem; padding:9px 22px; border-radius:16px;
}
@media (max-width:500px){
  .cc-modal-content{padding:18px 10px 14px 10px; min-width:0;}
  .cc-modal-title{font-size:1.1rem;}
}

/* COLOR PALETTE - SOFT PASTEL VARIATIONS */
:root {
  --primary: #264653;
  --secondary: #F4A261;
  --accent: #FFFFFF;
  --pastel-blue: #BFD7ED;
  --pastel-pink: #F7D6E0;
  --pastel-lavender: #EADCF6;
  --pastel-green: #C9F4DE;
  --pastel-yellow: #F6EAC4;
  --pastel-violet: #DFE6F7;
  --pastel-orange: #FAE1CE;
}

.section, section {
  border-radius:22px;
  background: #FFFFFFCC;
  box-shadow: 0 2px 16px 0 #f4a26113;
}

/* DREAMY PASTEL BACKGROUNDS ACCENTS */
body {
  background: linear-gradient(110deg, #F7D6E0 0%, #DFE6F7 52%, #C9F4DE 100%);
  background-attachment: fixed;
}

section:nth-of-type(odd) {
  background: #FBF7FE;
}
section:nth-of-type(even) {
  background: #F8F6F3;
}

/* Subtle Pastel accent lines */
hr{
  border:none;
  border-top:2px solid #F7D6E0;
  margin:32px 0;
}

/* Animations & Micro-interactions */
.cta-main, .card, .feature-item, .testimonial-card, button {
  transition: box-shadow 0.21s, background 0.17s, color 0.17s, transform 0.14s;
}
.cta-main:hover, .feature-item:hover, .card:hover, .testimonial-card:hover, button:hover {
  transform: translateY(-2px) scale(1.018);
  box-shadow: 0 8px 28px 0 #fedacf1c;
}

/* Responsive padding for all elements */
@media (max-width: 560px){
  .container{padding-left: 8px; padding-right:8px;}
  .section, section{padding: 24px 6px; margin-bottom:32px;}
  .testimonial-card{padding:12px 10px;}
}

/* Hide scroll on modal and overlay when open */
body.cc-modal-open {overflow: hidden;}

/* Accessibility & Focus Outline */
a:focus, .cta-main:focus, button:focus {
  outline: 2.5px solid #D19785; outline-offset: 1.5px;
  box-shadow:0 0 0 3px #F7D6E05D;
  background: #EADCF673;
}

/* Custom Scrollbar for dream effect */
::-webkit-scrollbar{
  width:11px;
  background: #FAE1CE;
  border-radius:7px;
}
::-webkit-scrollbar-thumb{
  background: #F4A26166;
  border-radius:24px;
}
::-webkit-scrollbar-thumb:hover {
  background: #F4A26199;
}

/* Miscellaneous spacing rules for main pattern */
.section, section, .content-wrapper, .card, .feature-item, .testimonial-card {
  margin-bottom: 20px;
}

/* Utility: Hide visually */
.visually-hidden { position:absolute!important; clip:rect(1px,1px,1px,1px); padding:0!important; border:0!important; height:1px!important; width:1px!important; overflow:hidden; }

/* ------- END OF CSS --------- */