/* Fall theme variables */
:root{
  --primary: #C2410C;
  --accent: #EA580C;
  --gold: #D97706;
  --cocoa: #3F2D20;
  --leaf: #065F46;
  --bg: #FFF8F1;
  --paper: #FFFFFF;
  --ink: #1F1B16;
  --muted: #FDEAD7;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.container{width:min(1120px,92%);margin-inline:auto}
.section{padding:72px 0}
.section.alt{background:var(--muted)}
.section-title{font-size:2.25rem;line-height:1.1;margin:0 0 20px;font-weight:800;font-family:'Playfair Display', serif}
.lead{font-size:1.125rem;opacity:.92;max-width:65ch}
.center{text-align:center;margin-top:24px}
.small{font-size:.9rem;opacity:.8}

/* Header */
.site-header{position:sticky;top:0;background:linear-gradient(90deg,var(--paper),#FFF4E6);border-bottom:1px solid #f0e6db;z-index:1000;backdrop-filter:saturate(1.2) blur(6px)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px}
.brand{display:flex;align-items:center;gap:12px}
.logo{height:42px;width:auto;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.brand-name{font-weight:800;letter-spacing:.2px}
.nav{display:flex;align-items:center;gap:18px}
.nav a{opacity:.9}
.nav .btn{margin-left:4px}
.menu-toggle{display:none;border:none;background:transparent;font-size:24px;line-height:1}

/* Buttons */
.btn{display:inline-block;padding:12px 18px;border-radius:999px;border:1px solid var(--cocoa);font-weight:800;transition:.2s ease;white-space:nowrap;background:var(--paper)}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}
.btn-outline{background:var(--paper);border-color:#ead7c2}
.btn-lg{padding:14px 22px;font-size:1.05rem}
.w-full{display:block;width:100%;text-align:center}

/* Hero */
.hero{background:linear-gradient(180deg, rgba(234,88,12,.10), transparent 60%), var(--bg);padding:56px 0 24px}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}
.badge{display:inline-block;background:var(--gold);color:#fff;font-weight:800;border-radius:999px;padding:6px 12px;margin-bottom:12px;box-shadow:0 6px 14px rgba(0,0,0,.08)}
.hero-copy h1{font-size:3rem;line-height:1.05;margin:0 0 12px;font-weight:800;font-family:'Playfair Display', serif}
.hero-copy p{max-width:60ch}
.cta-row{display:flex;gap:12px;margin:18px 0 8px;flex-wrap:wrap}
.trust-copy{opacity:.85;font-weight:700;margin-top:8px;letter-spacing:.2px}
.hero-card{background:var(--paper);border:1px solid #efdec9;border-radius:20px;padding:18px;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.checklist{margin:0;padding-left:18px}
.checklist li{margin:8px 0}

/* Cards & Grid */
.grid{display:grid;gap:18px}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.services-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{background:var(--paper);border:1px solid #efdec9;border-radius:16px;padding:18px;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.card h3{margin:0 0 6px;font-size:1.1rem}

/* Pricing */
.pricing-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.price-card{position:relative;background:var(--paper);border:2px solid #f0e0c9;border-radius:18px;padding:20px;box-shadow:0 10px 24px rgba(0,0,0,.06);display:flex;flex-direction:column;gap:14px}
.price-card.highlight{border-color:#EA580C;box-shadow:0 14px 28px rgba(234,88,12,.18)}
.ribbon{position:absolute;top:14px;right:-10px;background:#EA580C;color:#fff;font-weight:800;padding:6px 12px;border-radius:999px;box-shadow:0 6px 12px rgba(0,0,0,.12)}
.price-head h3{margin:0;font-size:1.25rem}
.price{font-family:'Playfair Display', serif;font-size:2rem;font-weight:800;color:var(--primary)}
.price span{font-size:1rem;color:#7a5b43;margin-left:4px}
.features{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.features li::before{content:"\2713"; margin-right:8px; font-weight:800; color:var(--leaf)}

/* Contact */
.contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.contact-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.contact-form{display:grid;gap:10px;background:var(--paper);border:1px solid #efdec9;border-radius:16px;padding:18px;box-shadow:0 6px 18px rgba(0,0,0,.05)}
label{display:grid;gap:6px;font-weight:700}
input,textarea{padding:12px;border:1px solid #e5d4bf;border-radius:12px;font:inherit;background:#fff}
input:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,119,6,.20)}

/* Social icon-only buttons */
.socials.icons-only { display:flex; gap:12px; margin-top:12px }
.social-icon {
  --size: 44px;
  width: var(--size);
  height: var(--size);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-shadow: 0 4px 10px rgba(0,0,0,.12);
  transition: transform .18s ease, box-shadow .18s ease;
}
.social-icon .icon { width: 22px; height: 22px; fill: #fff }
.social-icon:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0,0,0,.18) }

/* Brand colors */
.social-icon.fb { background:#1877F2 }
.social-icon.tiktok { background: radial-gradient(circle at 30% 30%, #00F2EA 0%, #00F2EA 35%, transparent 36%), radial-gradient(circle at 70% 70%, #FF0050 0%, #FF0050 35%, transparent 36%), #000000; }
.social-icon.yelp { background:#D32323 }

/* Tooltip */
.social-icon .tooltip {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,.85);
  color:#fff;
  font-size:.85rem;
  font-weight:700;
  padding:6px 8px;
  border-radius:8px;
  white-space: nowrap;
  opacity:0;
  pointer-events:none;
  transition: opacity .18s ease, transform .18s ease;
  transform-origin: bottom center;
}
.social-icon:hover .tooltip { opacity:1; transform: translateX(-50%) translateY(-2px) }

/* Footer */
.site-footer{border-top:1px solid #efdec9;background:linear-gradient(0deg,#FFF4E6,var(--paper));padding:22px 0;margin-top:24px}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.footer-links{display:flex;gap:16px;opacity:.9}

/* Background leaves (static) */
body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-image:
    url('https://cdn.pixabay.com/photo/2017/10/06/22/23/leaves-2824608_960_720.png'),
    url('https://cdn.pixabay.com/photo/2014/10/14/20/24/autumn-leaves-488293_960_720.png');
  background-repeat: no-repeat, no-repeat;
  background-position: top left, bottom right;
  background-size: 300px, 400px;
  opacity: 0.12;
  z-index: 0;
}
.site-header, .hero, .section, .site-footer { position: relative; z-index: 1; }

/* Animated falling leaves */
.leaf {
  position: fixed;
  top: -10vh;
  width: 28px;
  height: 28px;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: .85;
  z-index: 0;
  will-change: transform, opacity;
  animation-name: fall, sway;
  animation-timing-function: linear, ease-in-out;
  animation-iteration-count: 1, infinite;
}
@keyframes fall {
  0% { transform: translateY(-10vh) rotate(0deg); opacity:.0; }
  10% { opacity:.85; }
  100% { transform: translateY(110vh) rotate(360deg); opacity:.0; }
}
@keyframes sway {
  0% { transform: translateX(0) }
  50% { transform: translateX(40px) }
  100% { transform: translateX(0) }
}

/* Responsive */
@media (max-width: 960px){
  .hero-inner{grid-template-columns:1fr}
  .services-grid, .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-wrap{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .nav{display:none}
  .menu-toggle{display:block}
  .services-grid, .pricing-grid{grid-template-columns:1fr}
  .hero-copy h1{font-size:2.4rem}
}