:root {
  --ink: #162d2a;
  --muted: #687674;
  --cream: #f5f2ec;
  --paper: #fbfaf7;
  /* --coral: #8ed49a; */
  /*--coral-dark: #4d9b62;*/
  --coral: #00a18a;
  --coral-dark: #00a18a;
  --sage: #cfead3;
  --line: rgba(22, 45, 42, .16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; font-size: 16px; }
.site-header { background: var(--paper); position: relative; z-index: 5; }
.navbar { padding: 24px 0; }
.navbar-brand, .footer-brand { color: var(--ink); font-size: 1.5rem; font-weight: 700; letter-spacing: -.06em; }
.navbar-brand:hover, .footer-brand:hover { color: var(--coral-dark); }
.brand-logo { display: block; width: min(280px, 45vw); height: auto; }
.brand-dot { color: var(--coral); }
.brand-mark { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid var(--ink); border-radius: 50%; font-size: .95rem; letter-spacing: 0; }
.nav-link { color: var(--ink); font-size: .84rem; font-weight: 500; }
.nav-link:hover { color: var(--coral-dark); }
.btn-dark { background: var(--ink); border-color: var(--ink); border-radius: 0; font-size: .8rem; }
.navbar-toggler { border: 0; padding: 0; }
.navbar-toggler:focus { box-shadow: none; }
.hero-section { overflow: hidden; padding: 72px 0 110px; background: var(--cream); }
.eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 28px; color: var(--coral-dark); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow span { display: inline-block; width: 28px; height: 1px; background: currentColor; }
h1, h2 { margin: 0; font-family: "Playfair Display", Georgia, serif; font-weight: 500; letter-spacing: -.04em; line-height: .99; }
h1 { max-width: 730px; font-size: clamp(3.7rem, 7vw, 6.8rem); }
h1 em, h2 em { color: var(--coral); font-style: italic; }
.hero-copy { max-width: 460px; margin: 30px 0 36px; color: var(--muted); font-size: 1.1rem; line-height: 1.7; }
.btn-coral { padding: 15px 22px; color: #fff; background: var(--coral); border: 1px solid var(--coral); border-radius: 0; font-size: .84rem; font-weight: 600; }
.btn-coral:hover { color: #fff; background: var(--coral-dark); border-color: var(--coral-dark); }
.text-link { color: var(--ink); font-size: .82rem; font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--ink); padding-bottom: 4px; }
.text-link:hover { color: var(--coral-dark); border-color: var(--coral-dark); }
.hero-note { margin-top: 80px; color: var(--muted); font-size: .75rem; }
.note-line { display: inline-block; width: 48px; height: 1px; background: var(--coral); }
.hero-visual { position: relative; min-height: 540px; overflow: hidden; border-radius: 22px; }
.hero-visual img { display: block; width: 100%; height: 100%; min-height: inherit; object-fit: cover; }
.visual-sun { position: absolute; top: 8%; right: 12%; width: 106px; height: 106px; border-radius: 50%; background: var(--coral); }
.visual-arch { position: absolute; right: 12%; bottom: -4%; width: 70%; height: 85%; border: 1px solid var(--ink); border-bottom: 0; border-radius: 180px 180px 0 0; }
.arch-inner { position: absolute; top: 10%; left: 10%; right: 10%; bottom: 0; background: #a9c4b5; border-radius: 160px 160px 0 0; }
.visual-stamp { position: absolute; top: 30%; left: 9%; color: var(--ink); font-size: .68rem; font-weight: 700; letter-spacing: .15em; line-height: 1.55; }
.visual-stamp strong { font-size: 1.05rem; letter-spacing: .08em; }
.visual-caption { position: absolute; bottom: 9%; left: 9%; margin: 0; color: var(--ink); font-family: "Playfair Display", Georgia, serif; font-size: 1.55rem; line-height: 1.1; }
.visual-caption strong { font-style: italic; font-weight: 500; }
.section-space { padding: 125px 0; }
.services-section { background: var(--paper); }
.section-heading { margin-bottom: 62px; }
.section-heading h2, .method-section h2 { max-width: 660px; font-size: clamp(2.8rem, 5vw, 4.5rem); }
.section-intro { max-width: 330px; margin: 0 0 4px auto; color: var(--muted); line-height: 1.65; }
.service-grid { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.service-card { position: relative; min-height: 315px; padding: 28px 28px 28px 0; border-right: 1px solid var(--line); }
.service-grid > div:last-child .service-card { border-right: 0; }
.service-number { display: block; color: var(--coral-dark); font-size: .7rem; font-weight: 700; letter-spacing: .1em; }
.service-icon { display: block; margin: 44px 0 24px; color: var(--coral); font-size: 1.65rem; }
.service-card h3, .method-step h3 { margin-bottom: 11px; font-size: 1.05rem; font-weight: 700; }
.service-card p { max-width: 210px; margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.65; }
.service-card > a { position: absolute; right: 28px; bottom: 28px; color: var(--ink); font-size: 1rem; }
.method-section { background: var(--cream); }
.method-visual { position: relative; min-height: 520px; background: var(--coral); overflow: hidden; }
.method-map { display: block; width: 100%; height: 100%; min-height: inherit; border: 0; }
.method-copy { max-width: 500px; margin: 31px 0 48px; color: var(--muted); line-height: 1.7; }
.method-step { display: flex; gap: 26px; padding: 19px 0; border-top: 1px solid var(--line); }
.method-step > span { color: var(--coral-dark); font-size: .73rem; font-weight: 700; }
.method-step h3 { margin: 0 0 4px; }
.method-step p { margin: 0; color: var(--muted); font-size: .87rem; }
.contact-section { padding-top: 0; background: var(--paper); }
.contact-panel { padding: 80px 9%; background: var(--ink); color: #fff; }
.eyebrow-light { color: var(--sage); }
.contact-panel h2 { font-size: clamp(3rem, 5vw, 5rem); }
.contact-copy { max-width: 430px; margin: 30px 0 0; color: #b9c7c1; line-height: 1.65; }
.contact-link { display: block; padding: 14px 0; color: #fff; border-bottom: 1px solid rgba(255,255,255,.35); font-family: "Playfair Display", Georgia, serif; font-size: 1.45rem; text-decoration: none; }
.contact-link i { float: right; color: var(--coral); font-family: "DM Sans", sans-serif; font-size: 1rem; }
.contact-link:hover { color: var(--coral); }
.contact-address { margin: 26px 0 0; color: #b9c7c1; font-size: .8rem; }
.site-footer { padding: 30px 0; background: var(--paper); color: var(--muted); font-size: .73rem; }
.footer-brand { font-size: 1.25rem; text-decoration: none; }
.footer-logo { display: block; width: 190px; height: auto; }
.footer-links { display: flex; gap: 20px; }
.footer-links a { color: var(--muted); text-decoration: none; }
.footer-links a:hover { color: var(--ink); }
@media (max-width: 991.98px) { .navbar-collapse { padding-top: 18px; } .hero-section { padding-top: 45px; } .hero-note { margin-top: 50px; } .hero-visual { min-height: 460px; } .section-space { padding: 90px 0; } .service-card { padding-left: 0; } .service-grid > div:nth-child(2) .service-card { border-right: 0; } .service-grid > div:nth-child(-n+2) .service-card { border-bottom: 1px solid var(--line); } }
@media (max-width: 575.98px) { .navbar { padding: 18px 0; } h1 { font-size: 3.7rem; } .hero-section { padding-bottom: 72px; } .hero-visual { min-height: 390px; } .section-heading { margin-bottom: 42px; } .section-heading h2, .method-section h2 { font-size: 3rem; } .section-intro { margin: 22px 0 0; } .service-card { min-height: 270px; padding-right: 20px; } .service-grid > div:nth-child(odd) .service-card { border-right: 0; } .service-grid > div:nth-child(3) .service-card { border-bottom: 1px solid var(--line); } .method-visual { min-height: 390px; } .contact-panel { padding: 56px 28px; } .footer-links { gap: 12px; } }
