:root { --ink:#18281d; --paper:#f7f4ee; --lime:#c9f04a; --pink:#ff6d8d; --line:#d8d3c8; font-family: Inter, ui-sans-serif, system-ui, sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; line-height:1.5; } a { color:inherit; } .site-header { height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 max(2rem,calc((100vw - 1240px)/2)); border-bottom:1px solid var(--line); background:var(--paper); position:sticky; top:0; z-index:5; } .brand { text-decoration:none; font-weight:800; letter-spacing:-.04em; font-size:1.1rem; } .brand span { display:inline-grid; place-items:center; width:2rem; height:2rem; margin-right:.5rem; color:var(--paper); background:var(--ink); border-radius:50%; font-size:.72rem; letter-spacing:0; } nav { display:flex; gap:1.5rem; } nav a { text-decoration:none; font-size:.9rem; font-weight:650; }
.hero { max-width:1240px; min-height:650px; margin:auto; padding:4rem max(2rem,calc((100vw - 1160px)/2)); display:grid; grid-template-columns:1fr .88fr; gap:4rem; align-items:center; } .kicker { margin:0 0:.8rem; color:#547247; font-weight:800; letter-spacing:.14em; font-size:.72rem; } h1,h2,h3,p { margin-top:0; } h1 { max-width:720px; margin-bottom:1.5rem; font-size:clamp(3.5rem,7vw,6.5rem); line-height:.91; letter-spacing:-.075em; } h1 em { color:#547247; font-family:Georgia,serif; font-weight:400; letter-spacing:-.07em; } .intro { max-width:32rem; font-size:1.25rem; } .actions { display:flex; gap:.8rem; margin-top:2rem; flex-wrap:wrap; } .button { padding:.9rem 1.15rem; border:1px solid var(--ink); text-decoration:none; font-weight:750; border-radius:2px; } .primary { background:var(--ink); color:white; } .secondary:hover,.primary:hover { transform:translateY(-2px); } .hero-image { margin:0; height:520px; overflow:hidden; border-radius:110px 110px 8px 8px; background:#d1ddba; } .hero-image img { width:100%; height:100%; object-fit:cover; }
.notice { display:flex; align-items:center; gap:1.5rem; max-width:1240px; margin:auto; padding:1.1rem max(2rem,calc((100vw - 1160px)/2)); background:var(--lime); } .notice .kicker { margin:0; color:var(--ink); white-space:nowrap; } .notice p { margin:0; flex:1; } .notice a { font-weight:750; white-space:nowrap; }
.section { padding:7rem max(2rem,calc((100vw - 1160px)/2)); } .section-heading { max-width:36rem; } h2 { font-size:clamp(2.5rem,5vw,4.6rem); line-height:.96; letter-spacing:-.065em; margin-bottom:1rem; } .feature-grid { background:var(--ink); color:var(--paper); } .feature-grid .kicker { color:var(--lime); } .cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:3rem; background:#ffffff31; } .cards article { padding:2rem; background:var(--ink); } .cards p { color:#d2dad1; } .number { display:block; color:var(--lime); font-size:3rem; letter-spacing:-.08em; font-weight:800; } .cards h3 { margin:.4rem 0 .8rem; font-size:1.4rem; }
.split-section { display:grid; grid-template-columns:1fr 1fr; gap:4rem; } .body-copy { max-width:34rem; font-size:1.2rem; } .hours { text-align:center; background:var(--pink); } .hours .kicker { color:var(--ink); } .hours h2 { margin-bottom:.4rem; }.price-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:4rem; }.price-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; }.document-card { display:block; text-decoration:none; background:#e6e1d6; }.document-card img { width:100%; aspect-ratio: .72; object-fit:cover; object-position:top; display:block; }.document-card span { display:flex; justify-content:space-between; padding:1rem; font-weight:750; }.document-card:hover { transform:translateY(-4px); box-shadow:0 14px 30px #18281d2a; }.contact { padding:7rem max(2rem,calc((100vw - 1160px)/2)); background:#547247; color:white; }.contact .kicker { color:var(--lime); }.contact-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:2rem; margin-top:3rem; }.contact-grid a { text-decoration:none; font-size:1.1rem; font-weight:600; } footer { padding:1.2rem 2rem; text-align:center; font-size:.85rem; color:#607064; }
@media (max-width:800px) { .site-header { height:auto; padding:1rem 1.25rem; align-items:flex-start; gap:1rem; }.brand { font-size:.95rem; white-space:nowrap; } nav { gap:.7rem; flex-wrap:wrap; justify-content:flex-end; } nav a { font-size:.78rem; }.hero,.split-section,.price-section { grid-template-columns:1fr; gap:2.5rem; }.hero { min-height:unset; padding-top:3rem; }.hero-image { height:360px; order:-1; border-radius:70px 70px 8px 8px; }.notice { display:block; }.notice p { margin:.5rem 0; }.cards,.price-cards,.contact-grid { grid-template-columns:1fr; }.section,.contact { padding-top:4.5rem; padding-bottom:4.5rem; } }