:root {
   --ink: #162024;
   --muted: #4d5b60;
   --soft: #eef2f3;
   --sand: #f7f4ef;
   --leaf: #2f6b57;
   --sky: #cfe3ee;
   --sun: #f1d9a6;
   --stone: #2a2e2f;
 }
 
 * {
   box-sizing: border-box;
 }
 
 body {
   margin: 0;
   font-family: "Inter", "Segoe UI", Arial, sans-serif;
   color: var(--ink);
   background: #ffffff;
 }
 
 img {
   max-width: 100%;
   display: block;
   object-fit: cover;
 }
 
 a {
   color: var(--ink);
   text-decoration: none;
 }
 
 .page {
   display: flex;
   flex-direction: column;
   min-height: 100vh;
 }
 
 .header {
   display: flex;
   flex-direction: column;
   gap: 12px;
   padding: 24px 8vw 12px;
 }
 
 .nav-row {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 20px;
 }
 
 .brand {
   font-weight: 600;
   letter-spacing: 1.2px;
   text-transform: uppercase;
   font-size: 14px;
 }
 
 .nav-links {
   display: flex;
   flex-wrap: wrap;
   gap: 16px;
   font-size: 14px;
 }
 
 .ad-label {
   font-size: 12px;
   color: var(--muted);
 }
 
 .cta-pill {
   padding: 10px 18px;
   border: 1px solid var(--ink);
   border-radius: 999px;
   font-size: 14px;
   display: inline-flex;
   align-items: center;
   gap: 8px;
 }
 
 .main {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 64px;
   padding-bottom: 80px;
 }
 
 .hero {
   display: flex;
   flex-wrap: wrap;
   align-items: stretch;
   gap: 24px;
   padding: 20px 8vw 0;
 }
 
 .hero-text {
   flex: 1 1 320px;
   padding: 32px;
   background: var(--sand);
   border-radius: 24px;
   display: flex;
   flex-direction: column;
   gap: 18px;
 }
 
 .hero-image {
   flex: 1 1 320px;
   min-height: 360px;
   border-radius: 32px;
   background-color: var(--sky);
   background-image: url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?w=1400&q=80");
   background-size: cover;
   background-position: center;
   position: relative;
 }
 
 .hero-image .overlay {
   position: absolute;
   right: 16px;
   bottom: 16px;
   background: rgba(22, 32, 36, 0.78);
   color: #ffffff;
   padding: 14px 18px;
   border-radius: 16px;
   max-width: 240px;
   font-size: 13px;
 }
 
 .offset-panel {
   margin-top: -48px;
   padding: 0 8vw;
 }
 
 .offset-panel .panel {
   display: flex;
   flex-wrap: wrap;
   gap: 22px;
   background: var(--soft);
   border-radius: 28px;
   padding: 28px;
   align-items: center;
 }
 
 .panel img {
   width: 320px;
   height: 220px;
   border-radius: 18px;
   background-color: var(--sky);
 }
 
 .panel-content {
   flex: 1 1 260px;
   display: flex;
   flex-direction: column;
   gap: 12px;
 }
 
 .callouts {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   padding: 0 8vw;
 }
 
 .callout {
   flex: 1 1 240px;
   padding: 22px;
   border-radius: 22px;
   background: var(--sun);
   min-width: 220px;
 }
 
 .callout.dark {
   background: var(--stone);
   color: #ffffff;
 }
 
 .grid-band {
   display: flex;
   flex-direction: column;
   gap: 22px;
   padding: 0 8vw;
 }
 
 .service-grid {
   display: flex;
   flex-wrap: wrap;
   gap: 18px;
 }
 
 .service-card {
   flex: 1 1 250px;
   background: #ffffff;
   border: 1px solid #e2e6e8;
   border-radius: 20px;
   padding: 20px;
   display: flex;
   flex-direction: column;
   gap: 14px;
 }
 
 .service-card img {
   width: 100%;
   height: 160px;
   border-radius: 14px;
   background-color: var(--soft);
 }
 
 .price {
   font-weight: 600;
   color: var(--leaf);
 }
 
 .split-story {
   display: flex;
   flex-wrap: wrap;
   gap: 26px;
   padding: 0 8vw;
   align-items: center;
 }
 
 .split-story .story-text {
   flex: 1 1 300px;
 }
 
 .split-story .story-image {
   flex: 1 1 260px;
   height: 320px;
   border-radius: 24px;
   background-color: var(--sun);
   background-image: url("https://images.unsplash.com/photo-1500534314209-a25ddb2bd429?w=800&q=80");
   background-size: cover;
   background-position: center;
 }
 
 .testimonial-strip {
   padding: 0 8vw;
   display: flex;
   flex-direction: column;
   gap: 16px;
 }
 
 .testimonial {
   background: var(--soft);
   border-radius: 20px;
   padding: 18px 22px;
 }
 
 .form-wrap {
   padding: 0 8vw;
 }
 
 .form-card {
   background: #ffffff;
   border-radius: 26px;
   padding: 28px;
   display: flex;
   flex-wrap: wrap;
   gap: 24px;
   border: 1px solid #e1e5e7;
 }
 
 .form-card img {
   width: 260px;
   height: 220px;
   border-radius: 18px;
   background-color: var(--sky);
 }
 
 form {
   flex: 1 1 280px;
   display: flex;
   flex-direction: column;
   gap: 12px;
 }
 
 label {
   font-size: 14px;
 }
 
 input,
 select,
 textarea {
   padding: 10px 12px;
   border: 1px solid #cfd6d9;
   border-radius: 10px;
   font-size: 14px;
 }
 
 .btn {
   background: var(--leaf);
   color: #ffffff;
   border: none;
   border-radius: 12px;
   padding: 12px 16px;
   font-size: 14px;
   cursor: pointer;
 }
 
 .btn-secondary {
   background: transparent;
   border: 1px solid var(--leaf);
   color: var(--leaf);
 }
 
 .footer {
   background: var(--sand);
   padding: 36px 8vw 40px;
   display: flex;
   flex-direction: column;
   gap: 18px;
 }
 
 .footer-links {
   display: flex;
   flex-wrap: wrap;
   gap: 14px;
   font-size: 14px;
 }
 
 .footnote {
   font-size: 12px;
   color: var(--muted);
   line-height: 1.5;
 }
 
 .sticky-cta {
   position: fixed;
   right: 18px;
   bottom: 18px;
   background: var(--ink);
   color: #ffffff;
   padding: 12px 16px;
   border-radius: 999px;
   font-size: 13px;
   display: inline-flex;
   gap: 8px;
   align-items: center;
   z-index: 5;
 }
 
 .cookie-banner {
   position: fixed;
   left: 18px;
   bottom: 18px;
   background: #ffffff;
   border: 1px solid #d9dee1;
   padding: 14px 18px;
   border-radius: 16px;
   display: flex;
   flex-direction: column;
   gap: 10px;
   max-width: 320px;
   z-index: 10;
 }
 
 .cookie-actions {
   display: flex;
   gap: 10px;
 }
 
 .hidden {
   display: none;
 }
 
 .page-hero {
   padding: 12px 8vw 0;
   display: flex;
   flex-direction: column;
   gap: 12px;
 }
 
 .page-hero .hero-panel {
   display: flex;
   flex-wrap: wrap;
   gap: 24px;
   background: var(--soft);
   border-radius: 26px;
   padding: 24px;
   align-items: center;
 }
 
 .page-hero img {
   width: 280px;
   height: 200px;
   border-radius: 16px;
   background-color: var(--sun);
 }
 
 .content-block {
   padding: 0 8vw;
   display: flex;
   flex-direction: column;
   gap: 16px;
 }
 
 .content-block .columns {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
 }
 
 .columns .column {
   flex: 1 1 240px;
   background: #ffffff;
   border: 1px solid #e0e6e8;
   border-radius: 18px;
   padding: 16px;
 }
 
 .service-detail {
   display: flex;
   flex-wrap: wrap;
   gap: 16px;
   padding: 18px;
   border-radius: 18px;
   background: var(--soft);
   align-items: center;
 }
 
 .service-detail img {
   width: 220px;
   height: 160px;
   border-radius: 14px;
   background-color: var(--sky);
 }
 
 .contact-grid {
   display: flex;
   flex-wrap: wrap;
   gap: 18px;
 }
 
 .contact-card {
   flex: 1 1 220px;
   background: #ffffff;
   border-radius: 18px;
   border: 1px solid #e3e6e8;
   padding: 18px;
 }
 
 .legal-list {
   display: flex;
   flex-direction: column;
   gap: 12px;
 }
 
 .references {
   font-size: 12px;
   color: var(--muted);
 }
 
 .image-card {
   width: 100%;
   height: 220px;
   border-radius: 20px;
   background-color: var(--soft);
   background-size: cover;
   background-position: center;
 }
 
 .image-card.about {
   background-image: url("https://images.unsplash.com/photo-1501785888041-af3ef285b470?w=800&q=80");
 }
 
 .image-card.services {
   background-image: url("https://images.unsplash.com/photo-1489515217757-5fd1be406fef?w=800&q=80");
 }
 
 .image-card.contact {
   background-image: url("https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=800&q=80");
 }