/* =========================================
   Root & Global
========================================= */
:root{
  --primary-color:#FFD700;
  --secondary-color:#1a365d;
  --accent-color:#2D5016;
  --light-color:#f8f9fa;
  --dark-color:#141516;
  --gray-color:#6c757d;
  --white:#ffffff;

  /* Elegant theme */
  --primary-gold:#FFD700;
  --dark-gold:#E6C200;
  --navy-blue:#0f172a;
  --light-navy:#1e293b;
  --cream-white:#f8fafc;
  --light-gray:#e2e8f0;
  --text-dark:#1e293b;
  --text-light:#64748b;

  /* Extra vars used in CTAs */
  --gg-green:#2e7d32;
  --gg-deep:#1b5e20;
  --gg-ink:#0f172a;
  --gg-line:#cbd5e1;

  --transition:all .3s ease;
  --shadow-light:0 5px 15px rgba(0,0,0,.08);
  --shadow-medium:0 10px 25px rgba(0,0,0,.15);
  --shadow-heavy:0 15px 35px rgba(0,0,0,.2);

  --shadow-soft:0 8px 30px rgba(0,0,0,.08);
  --shadow-float:0 30px 60px rgba(0,0,0,.15);

  --gradient-gold:linear-gradient(135deg, var(--primary-gold) 0%, var(--dark-gold) 100%);
  --gradient-navy:linear-gradient(135deg, var(--navy-blue) 0%, var(--light-navy) 100%);
  --gradient-overlay:linear-gradient(135deg, rgba(15,23,42,.85) 0%, rgba(30,41,59,.75) 100%);
}

*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  line-height:1.7;
  color:var(--text-dark);
  background:var(--cream-white);
  overflow-x:hidden;
}

/* =========================================
   Utilities
========================================= */
.color-primary{color:var(--primary-color)!important}
.color-white{color:var(--white)!important}
.color-black{color:var(--dark-color)!important}
.light-black{color:#2d3748!important}
.dark-gray{color:#4a5568!important}
.fw-500{font-weight:500!important}
.fw-600{font-weight:600!important}
.fw-700{font-weight:700!important}
.mb-12{margin-bottom:12px!important}
.mb-16{margin-bottom:16px!important}
.mb-20{margin-bottom:20px!important}
.mb-24{margin-bottom:24px!important}
.mb-32{margin-bottom:32px!important}
.mb-48{margin-bottom:48px!important}
.mb-80{margin-bottom:80px!important}
.mt-32{margin-top:32px!important}
.py-80{padding-block:80px!important}
.gap-12{gap:12px}
.br-24{border-radius:24px!important}
.w-100{width:100%!important}
.h-100{height:100%!important}
.text-center{text-align:center!important}
.text-sm{font-size:.875rem}
.no-underline{text-decoration:none!important}

/* =========================================
   Hero (Classic Banner)
========================================= */
.hero-banner{
  padding:140px 0 100px;
  position:relative;
  overflow:hidden;
}
.hero-banner .hero-video{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  z-index:-1;
}
.hero-banner::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 30% 50%, rgba(255,215,0,.1) 0%, transparent 50%);
  z-index:0;
}
.hero-content{position:relative; z-index:2}
.hero-badge{
  display:inline-block; background:rgba(255,215,0,.15);
  color:var(--primary-color); padding:8px 20px; border-radius:999px;
  font-size:.9rem; font-weight:600; margin-bottom:20px;
  border:1px solid rgba(255,215,0,.3);
}

/* =========================================
   Elegant Hero (Video + Panel)
   (merged: removed duplicates)
========================================= */
.elegant-hero{
  position:relative; overflow:hidden;
  min-height:clamp(520px,70vw,760px);
  display:flex; align-items:center; color:#fff;
}
.elegant-hero .hero-video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; filter:brightness(.75); z-index:-1;
}
.elegant-hero .hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 600px at 25% 40%, rgba(0,0,0,.25), transparent 60%),
    linear-gradient(0deg, rgba(0,0,0,.35), rgba(0,0,0,.10));
  pointer-events:none; z-index:0;
}
.elegant-hero::before{ /* optional gradient mask layer if needed */
  content:''; position:absolute; inset:0; z-index:0;
}

.hero-panel{
  max-width:60%;
  padding:clamp(16px,3vw,28px) clamp(18px,3.5vw,32px);
  background:rgba(22,94,44,.72);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  border-radius:28px; box-shadow:0 12px 30px rgba(0,0,0,.18);
  position:relative; z-index:1;
}
.elegant-badge{
  display:inline-flex; align-items:center; gap:.5rem; font-weight:600;
  padding:.45rem .8rem; border-radius:999px; background:rgba(255,255,255,.12);
  margin-bottom:.9rem;
}
.hero-title {
  font-weight: 800;
  line-height: 1.05;
  font-size: clamp(28px, 5vw, 54px);
  margin: 0 0 .6rem;
  letter-spacing: -0.02em;
  
  background: linear-gradient(90deg, #ffd700, #8fcea1); /* gradient colors */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.hero-title .accent{color:#b7ffb7}
.hero-subtitle{
  font-size:clamp(14px,1.6vw,18px); line-height:1.6; opacity:.95; margin:0 0 1.2rem;
}
.hero--green .hero-shape{
  position:absolute; left:0; right:0; bottom:-1px; height:120px;
  background:#3b7f1d;
  clip-path:polygon(0 35%, 100% 0, 100% 100%, 0% 100%);
  box-shadow:0 -8px 24px rgba(0,0,0,.12) inset;
}

/* Hero particles */
.hero-particles{position:absolute; inset:0; pointer-events:none}
.particle{
  position:absolute; background:var(--primary-gold); border-radius:50%;
  opacity:.3; animation:float 6s ease-in-out infinite;
}

/* =========================================
   Buttons / CTAs (Unified)
========================================= */
.cus-btn,
.elegant-btn,
.btn-pill,
.btn-secondary,
.btn-outline,
.action-btn{
  transition:var(--transition);
}

.cus-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  background:linear-gradient(135deg, var(--primary-color) 0%, #e6c200 100%);
  color:var(--dark-color); padding:16px 36px; border-radius:999px; font-weight:700;
  text-decoration:none; border:none; cursor:pointer; margin-top:30px; box-shadow:var(--shadow-medium);
  position:relative; overflow:hidden;
}
.cus-btn::before{
  content:''; position:absolute; inset:0; left:-100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent);
  transition:.5s;
}
.cus-btn:hover{transform:translateY(-5px); box-shadow:var(--shadow-heavy)}
.cus-btn:hover::before{left:100%}

.elegant-btn{
  display:inline-flex; align-items:center; gap:.6rem;
  padding:.9rem 1.2rem; border-radius:999px; font-weight:700;
  background:#27ae60; color:#fff; text-decoration:none;
  box-shadow:0 8px 18px rgba(39,174,96,.35);
}
.elegant-btn:hover{transform:translateY(-1px); box-shadow:0 12px 24px rgba(39,174,96,.45); background:#22a157}

.btn-pill{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--gg-green); color:#fff; border:0; border-radius:999px;
  padding:14px 28px; font-weight:700; box-shadow:var(--shadow-medium);
  position:relative; overflow:hidden;
}
.btn-pill::after{
  content:''; position:absolute; inset:0; left:-100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.2), transparent);
  transition:left .7s;
}
.btn-pill:hover{background:var(--gg-deep); transform:translateY(-2px); box-shadow:var(--shadow-heavy)}
.btn-pill:hover::after{left:100%}

.btn-secondary{
  background:linear-gradient(135deg, var(--secondary-color) 0%, #2c5282 100%);
  color:#fff; border:none; padding:12px 28px; border-radius:10px; font-weight:600;
  box-shadow:var(--shadow-light); display:inline-block; text-decoration:none;
}
.btn-secondary:hover{
  background:linear-gradient(135deg, #2c5282 0%, var(--secondary-color) 100%);
  transform:translateY(-3px); box-shadow:var(--shadow-medium); color:#fff;
}

.btn-outline{
  background:transparent; color:#fff; border:2px solid var(--primary-gold);
  padding:16px 36px; border-radius:999px; font-weight:600; text-decoration:none;
}
.btn-outline:hover{background:var(--primary-gold); color:var(--navy-blue); transform:translateY(-2px)}

.quick-actions{display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center}
.action-btn{
  display:inline-flex; align-items:center; gap:.5rem; padding:.6rem .9rem; border-radius:999px;
  background:rgba(255,255,255,.14); color:#010101; text-decoration:none; font-weight:600;
  border:2px solid transparent;
}
.action-btn:hover{background:var(--primary-gold); transform:translateY(-2px); box-shadow:var(--shadow-soft)}
.action-btn i{font-size:1rem}

/* =========================================
   Sidebar / Cards / Tables
========================================= */
.service-sidebar{position:sticky; top:120px; z-index:10}
.service-link{
  display:flex; align-items:center; padding:18px 24px; background:var(--white);
  border-radius:16px; color:var(--dark-color); text-decoration:none;
  box-shadow:var(--shadow-light); margin-bottom:16px; border-left:4px solid transparent;
}
.service-link:hover,.service-link.active{
  background:var(--primary-color); transform:translateX(8px); box-shadow:var(--shadow-medium);
  border-left-color:var(--secondary-color);
}
.service-link p{margin:0; font-weight:600; font-size:1rem}

.contact-card{
  background:linear-gradient(135deg, var(--secondary-color) 0%, #2c5282 100%);
  border-radius:20px; overflow:hidden; box-shadow:var(--shadow-heavy); color:#fff; position:relative;
}
.contact-card::before{
  content:''; position:absolute; top:-50%; left:-50%; width:200%; height:200%;
  background:radial-gradient(circle, rgba(255,255,255,.1) 0%, transparent 70%); transform:rotate(30deg);
}
.contact-card .img-block{height:200px; overflow:hidden; position:relative}
.contact-card .img-block img{object-fit:cover; width:100%; height:100%; transition:var(--transition)}
.contact-card:hover .img-block img{transform:scale(1.05)}
.contact-card .text-block{padding:28px; position:relative; z-index:2; background-color: #1b5e20;}

.service-detail-wrap{
  background:#fff; padding:60px; border-radius:30px; box-shadow:var(--shadow-light);
  position:relative; overflow:hidden;
}
.service-detail-wrap::before{
  content:''; position:absolute; top:0; right:0; width:200px; height:200px;
  background:radial-gradient(circle, rgba(255,215,0,.1) 0%, transparent 70%); border-radius:50%;
}

.image-box{height:240px; border-radius:20px; overflow:hidden; margin-bottom:24px; position:relative}
.image-box::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:50%;
  background:linear-gradient(to top, rgba(0,0,0,.5) 0%, transparent 100%); opacity:0; transition:var(--transition);
}
.image-box:hover::after{opacity:1}
.image-box img{width:100%; height:100%; object-fit:cover; transition:var(--transition)}
.image-box:hover img{transform:scale(1.08)}

.pricing-table{
  width:100%; border-collapse:separate; border-spacing:0; margin:40px 0;
  box-shadow:var(--shadow-medium); border-radius:16px; overflow:hidden; background:#fff;
}
.pricing-table th,.pricing-table td{padding:20px; text-align:left; border-bottom:1px solid #e2e8f0}
.pricing-table th{
  background:linear-gradient(135deg, var(--secondary-color) 0%, #2c5282 100%);
  color:#fff; font-weight:700; font-size:1rem;
}
.pricing-table tr:nth-child(even){background:#f8fafc}
.pricing-table tr:hover{background:#f1f5f9; transform:scale(1.01); transition:var(--transition)}
.pricing-table tr:last-child td{border-bottom:none}

.feature-card{
  background:#fff; border-radius:20px; padding:30px; box-shadow:var(--shadow-light);
  transition:var(--transition); height:100%; position:relative; overflow:hidden;
}
.feature-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}
.feature-card:hover{transform:translateY(-10px); box-shadow:var(--shadow-heavy)}
.feature-card h5{color:var(--secondary-color); margin-bottom:16px; font-weight:700}
.feature-card ul{padding-left:20px; margin-bottom:24px}
.feature-card ul li{margin-bottom:10px; position:relative}
.feature-card ul li::before{content:"✓"; color:var(--primary-color); font-weight:700; margin-right:8px}

/* =========================================
   Sections
========================================= */
.services-detail-sec{
  background:linear-gradient(to bottom, #f8f9fa 0%, #ffffff 100%);
  position:relative;
}
.services-detail-sec::before{
  content:''; position:absolute; top:0; left:0; right:0; height:300px;
  background:linear-gradient(to bottom, var(--secondary-color) 0%, transparent 100%); opacity:.05; pointer-events:none;
}

.solution-sec{
  background:linear-gradient(135deg, var(--secondary-color) 0%, #2c5282 100%);
  color:#fff; border-radius:30px; margin:0 20px; position:relative; overflow:hidden;
}
.solution-sec::before{
  content:''; position:absolute; top:-50%; right:-20%; width:400px; height:400px;
  background:radial-gradient(circle, rgba(255,215,0,.1) 0%, transparent 70%); border-radius:50%;
}
.solution-sec ul{list-style:none; padding-left:0}
.solution-sec ul li{
  position:relative; padding-left:32px; margin-bottom:16px; font-size:1.1rem;
}
.solution-sec ul li:before{
  content:"✓"; position:absolute; left:0; color:var(--primary-color); font-weight:700; font-size:1.2rem;
}

.process-section{
  background:linear-gradient(to bottom, #ffffff 0%, #f8f9fa 100%);
  position:relative;
}
.process-section::before{
  content:''; position:absolute; bottom:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent 0%, var(--primary-color) 50%, transparent 100%);
}
.process-card{
  background:#fff; border-radius:20px; padding:40px 30px; box-shadow:var(--shadow-light);
  transition:var(--transition); height:100%; text-align:center; position:relative; overflow:hidden;
}
.process-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}
.process-card:hover{transform:translateY(-10px); box-shadow:var(--shadow-heavy)}
.process-number{
  display:flex; align-items:center; justify-content:center; width:60px; height:60px;
  background:linear-gradient(135deg, var(--primary-color) 0%, #e6c200 100%);
  color:var(--dark-color); border-radius:50%; font-weight:700; font-size:1.5rem; margin:0 auto 20px;
  box-shadow:var(--shadow-medium);
}
.process-card h6{color:var(--secondary-color); font-weight:700; margin-bottom:16px}

.cta-section{
  background:linear-gradient(135deg, var(--secondary-color) 0%, #2c5282 100%);
  color:#fff; border-radius:30px; margin:0 20px 80px; position:relative; overflow:hidden; padding:80px 40px;
}
.cta-section::before,
.cta-section::after{
  content:''; position:absolute; width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,215,0,.1) 0%, transparent 70%);
}
.cta-section::before{top:-20%; right:-10%}
.cta-section::after{bottom:-20%; left:-10%}
.cta-content{position:relative; z-index:2}

.services-section{padding:120px 0; background:#fff; position:relative}
.section-header{text-align:center; margin-bottom:80px}
.section-tag{
  display:inline-block; color:var(--primary-gold); font-weight:600; letter-spacing:2px; text-transform:uppercase;
  margin-bottom:16px; position:relative;
}
.section-tag::after{
  content:''; position:absolute; bottom:-8px; left:50%; transform:translateX(-50%); width:40px; height:2px;
  background:var(--gradient-gold);
}
.section-title{font-size:3rem; font-weight:700; color:var(--navy-blue); margin-bottom:20px}
.section-subtitle{font-size:1.2rem; color:var(--text-light); max-width:600px; margin:0 auto}

.service-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(350px, 1fr)); gap:40px; margin-top:60px;
}
.service-card{
  background:#fff; border-radius:24px; overflow:hidden; box-shadow:var(--shadow-soft);
  transition:var(--transition); position:relative; border:1px solid var(--light-gray);
}
.service-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background:var(--gradient-gold); transform:scaleX(0); transition:var(--transition);
}
.service-card:hover{transform:translateY(-10px); box-shadow:var(--shadow-float)}
.service-card:hover::before{transform:scaleX(1)}
.service-image{height:280px; overflow:hidden; position:relative}
.service-image img{width:100%; height:100%; object-fit:cover; transition:var(--transition)}
.service-card:hover .service-image img{transform:scale(1.1)}
.service-content{padding:32px}
.service-title{font-size:1.5rem; font-weight:700; color:var(--navy-blue); margin-bottom:16px}
.service-description{color:var(--text-light); margin-bottom:24px; line-height:1.6}
.service-link{display:inline-flex; align-items:center; gap:8px; color:var(--primary-gold); font-weight:600; text-decoration:none}
.service-link:hover{gap:12px; color:var(--dark-gold)}

.benefits-section{padding:120px 0; background:var(--cream-white); position:relative}
.benefits-container{display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center}
.benefits-content h3{font-size:2.5rem; font-weight:700; color:var(--navy-blue); margin-bottom:24px}
.benefits-intro{font-size:1.2rem; color:var(--text-light); margin-bottom:40px}
.benefits-list{list-style:none}
.benefit-item{
  display:flex; align-items:flex-start; gap:16px; padding:20px; margin-bottom:16px;
  background:#fff; border-radius:16px; transition:var(--transition); border-left:4px solid transparent;
}
.benefit-item:hover{transform:translateX(10px); border-left-color:var(--primary-gold); box-shadow:var(--shadow-soft)}
.benefit-icon{
  width:48px; height:48px; background:var(--gradient-gold); border-radius:12px;
  display:flex; align-items:center; justify-content:center; color:var(--navy-blue); font-size:1.2rem; flex-shrink:0;
}
.benefit-text h4{font-weight:600; color:var(--navy-blue); margin-bottom:4px}
.benefit-text p{color:var(--text-light); font-size:.95rem}
.benefits-visual{position:relative}
.floating-card{
  position:absolute; background:#fff; padding:24px; border-radius:20px; box-shadow:var(--shadow-medium);
  border:1px solid var(--light-gray);
}
.card-1{top:10%; right:10%; animation:float-card-1 8s ease-in-out infinite}
.card-2{bottom:20%; left:5%; animation:float-card-2 6s ease-in-out infinite}

.stats-section{padding:100px 0; background:var(--gradient-navy); color:#fff; position:relative; overflow:hidden}
.stats-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:40px; text-align:center}
.stat-item{position:relative; z-index:2}
.stat-number{font-size:3.5rem; font-weight:700; color:var(--primary-gold); margin-bottom:8px}
.stat-label{font-size:1.1rem; opacity:.9}

.final-cta{padding:140px 0; background:var(--gradient-navy); color:#fff; text-align:center; position:relative; overflow:hidden}
.cta-title{
  font-size:3.5rem; font-weight:700; margin-bottom:24px;
  background:linear-gradient(135deg, #fff 0%, var(--primary-gold) 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.cta-subtitle{font-size:1.3rem; opacity:.9; margin-bottom:40px; max-width:600px; margin-inline:auto}
.cta-buttons{display:flex; gap:20px; justify-content:center; flex-wrap:wrap}

/* Breadcrumb */
.breadcrumb{background:transparent; padding:20px 0; margin:0; font-size:.9rem}
.breadcrumb a{color:var(--primary-gold); text-decoration:none}
.breadcrumb-item.active{color:#fff}

/* KPIs / postcode input */
.kpis{display:flex; flex-wrap:wrap; gap:16px; margin-top:20px}
.kpi{
  backdrop-filter:blur(6px); background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22); border-radius:14px; padding:10px 14px;
  animation:floaty 6s ease-in-out infinite; transition:var(--transition);
}
.kpi:hover{transform:translateY(-2px); background:rgba(255,255,255,.18)}
.postcode{display:flex; gap:10px; flex-wrap:wrap; margin-top:18px}
.postcode input{
  flex:1; min-width:220px; padding:14px 16px; border-radius:999px; border:1px solid #cbd5e1;
  box-shadow:var(--shadow-medium); transition:var(--transition);
}
.postcode input:focus{outline:none; border-color:var(--gg-green); box-shadow:0 0 0 3px rgba(46,125,50,.1)}

/* Grids */
.grid{display:grid; gap:28px}
@media(min-width:768px){
  .grid-2{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .grid-4{grid-template-columns:repeat(4,1fr)}
}

/* =========================================
   Headings
========================================= */
.section-heading{position:relative; margin-bottom:60px}
.section-heading h3{color:var(--secondary-color); font-weight:700; position:relative; display:inline-block}
.section-heading h3::after{
  content:''; position:absolute; bottom:-10px; left:0; width:60px; height:4px;
  background:linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%); border-radius:2px;
}
.section-heading.text-center h3::after{left:50%; transform:translateX(-50%)}

/* =========================================
   Animations
========================================= */
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%{transform:scale(1)} 50%{transform:scale(1.05)} 100%{transform:scale(1)}}
.wow.fadeInUp{animation-name:fadeInUp}
.wow{visibility:visible}
.pulse{animation:pulse 2s infinite}

@keyframes float{0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-20px) rotate(180deg)}}
@keyframes float-card-1{0%,100%{transform:translateY(0) rotate(-2deg)} 50%{transform:translateY(-20px) rotate(2deg)}}
@keyframes float-card-2{0%,100%{transform:translateY(0) rotate(2deg)} 50%{transform:translateY(-15px) rotate(-2deg)}}
@keyframes floaty{0%,100%{transform:translateY(0)} 50%{transform:translateY(-4px)}}

/* =========================================
   Responsive
========================================= */
@media (max-width:1200px){
  .service-detail-wrap{padding:40px}
  .hero-title{font-size:3.5rem}
  .benefits-container{gap:60px}
}
@media (max-width:992px){
  .service-sidebar{position:static; margin-bottom:40px}
  .service-detail-wrap{padding:30px}
  .hero-banner{padding:120px 0 80px}
  .cta-section,.solution-sec{margin:0 0 60px; border-radius:0}
  .hero-title{font-size:3rem}
  .benefits-container{grid-template-columns:1fr; gap:60px}
  .section-title{font-size:2.5rem}
  .service-grid{grid-template-columns:1fr}
  .funding-cards{grid-template-columns:1fr}
}
@media (max-width:768px){
  .hero-banner{padding:100px 0 60px}
  .py-80{padding-block:60px!important}
  .service-detail-wrap{padding:20px}
  .pricing-table{display:block; overflow-x:auto}
  .cta-section{padding:60px 20px}
  .hero-subtitle{font-size:1.2rem}
  .section-title{font-size:2rem}
  .benefits-content h3{font-size:2rem}
  .cta-title{font-size:2.5rem}
  .elegant-btn,.btn-outline{width:100%; max-width:300px}
  .quick-actions{flex-direction:column; align-items:center}
  .action-btn{width:100%; max-width:250px; justify-content:center}
}
@media (max-width:576px){
  .quick-actions{gap:.5rem}
  .action-btn span{display:none}
}
@media (max-width:480px){
  .hero-title{font-size:2rem}
  .section-title{font-size:1.8rem}
  .service-content{padding:24px}
  .floating-card{position:static; margin-bottom:20px}
}