@import "variables.css";
@import "reset.css";

*{
  font-family: "Tangerine", cursive;
  /* font-weight: 400;
  font-style: normal; */
  /* color:var(--text); */
}

.imperial-script-regular {
  font-family: "Imperial Script", cursive !important;
  font-weight: 400 !important;
  font-style: normal !important;
}

.imperial-script-bold {
  font-family: "Imperial Script", cursive !important;
  font-weight: 700 !important;
  font-style: normal !important;
}

.tangerine-regular {
  font-family: "Tangerine", cursive !important;
  font-weight: 400 !important;
  font-style: normal !important;
}

.tangerine-bold {
  font-family: "Tangerine", cursive !important;
  font-weight: 1000 !important;
  font-style: normal !important;
}


body{
    font-size: calc(1.3rem * var(--font-scale));

	background:var(--bg);
	color:var(--text);
	line-height:1.45;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}

.site-header{
	background:rgba(255,255,255,0.9);
	padding:18px 0;
	position:sticky;
	top:0;
	z-index:60;
	backdrop-filter: blur(6px);
	border-bottom: 1px solid rgba(170,150,170,0.04);
    margin-bottom: 10px;
}
.site-header .logo{font-weight:700;color:var(--text);text-decoration:none}
.main-nav a{font-size:1.8rem;margin-left:18px;color:var(--muted);text-decoration:none;transition:color var(--transition)}
.main-nav a:hover{color:var(--lilac-deep)}
.main-nav a.selected{color:var(--lilac-deep); border-bottom:2px solid var(--lilac-deep);padding-bottom:4px}

.wrap{max-width:var(--max-width);margin:0 auto;padding:0 16px}

.btn-cta{
	display:inline-block;
	background: linear-gradient(90deg,var(--lilac-deep),var(--dusty-rose));
	color:#fff;padding:10px 18px;border-radius:999px;text-decoration:none;
	box-shadow: var(--shadow);
	transition: transform var(--transition), box-shadow var(--transition), opacity var(--transition);
}
.btn-cta:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(169,142,167,0.12)}

.site-footer{padding:28px 0;background:transparent;text-align:center;color:var(--muted);margin-top:40px}

/* cards and common */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px}

/* Mobile spacing adjustments: reduce horizontal padding and internal paddings for <768px */
@media (max-width: 768px) {
  /* Reduce outer wrap horizontal padding to ~0.75rem (12px) */
  .wrap{padding:0 0.75rem}

  /* Slightly smaller header vertical padding on mobile */
  .site-header{padding:12px 0}

  /* Nav link spacing reduced */
  .main-nav a{margin-left:12px}

  /* Hero content sits closer to edges */
  .hero .hero-content{left:12px;bottom:12px;padding:10px}

  /* CTA inner padding reduced so content uses more width */
  .cta-inner{padding:12px}

  /* Cards and small containers tighter */
  .card{padding:10px}

  /* Footer spacing tweaks to avoid extra horizontal gaps */
  .footer-row { gap:8px }
}