:root { --aqua:#76cbd0; --coral:#be6274; --mustard:#edb44d; --cream:#fff7e9; --ink:#202021; --green:#397d67; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--cream); font-family:Nunito,Arial,sans-serif; } .container { width:min(1120px,calc(100% - 40px)); margin:auto; }.hero { min-height:700px; overflow:hidden; position:relative; isolation:isolate; padding:76px 0 180px; background:var(--aqua); text-align:center; }.hero__content { position:relative; z-index:3; }.eyebrow { display:flex; gap:15px; align-items:center; justify-content:center; margin:0 0 37px; font:800 clamp(1.5rem,3vw,2.25rem)/1 'Baloo 2'; }.eyebrow:first-letter { color:var(--mustard); }.eyebrow span { color:white; text-transform:uppercase; letter-spacing:.02em; }.theme-tag { display:inline-block; padding:3px 20px; border:3px solid var(--ink); border-radius:999px; background:var(--mustard); font:800 1.25rem 'Baloo 2'; transform:rotate(-4deg); }.hero h1 { max-width:760px; margin:10px auto 0; font:800 clamp(4.1rem,11vw,8.5rem)/.78 'Baloo 2'; letter-spacing:-.07em; color:var(--coral); text-shadow:3px 3px 0 var(--ink),-3px -3px 0 var(--ink),3px -3px 0 var(--ink),-3px 3px 0 var(--ink); }.hero h1 em { font-style:normal; display:block; }.audience { width:max-content; max-width:100%; margin:28px auto 18px; padding:7px 24px; border:3px solid var(--ink); border-radius:999px; background:var(--cream); font:800 clamp(1.1rem,3vw,1.6rem) 'Baloo 2'; }.date-card { display:grid; line-height:.8; font-family:'Baloo 2'; color:white; text-shadow:2px 2px 0 var(--ink),-2px -2px 0 var(--ink),2px -2px 0 var(--ink),-2px 2px 0 var(--ink); }.date-card strong { font-size:clamp(3.2rem,8vw,5.4rem); }.date-card span { font-size:clamp(2rem,5vw,3.5rem); }.button { display:inline-flex; justify-content:center; gap:12px; align-items:center; border:3px solid var(--ink); border-radius:15px; padding:15px 25px; color:var(--ink); font:800 1.15rem 'Baloo 2'; text-decoration:none; box-shadow:5px 5px 0 var(--ink); transition:transform .2s,box-shadow .2s; }.button:hover { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--ink); }.button--coral { margin-top:30px; background:var(--coral); color:white; }.cloud { position:absolute; z-index:1; height:90px; width:250px; border:3px solid var(--ink); border-radius:80px; background:white; }.cloud:before,.cloud:after { content:''; position:absolute; bottom:0; border:3px solid var(--ink); border-bottom:0; border-radius:100px 100px 0 0; background:white; }.cloud:before { left:35px;width:100px;height:120px; }.cloud:after { right:35px;width:95px;height:80px; }.cloud--left { left:-75px; top:53%; }.cloud--right { right:-80px; top:42%; }.hills { position:absolute; z-index:2; bottom:-22px; left:0; display:flex; align-items:end; gap:0; width:100%; height:210px; }.hills i { flex:1; height:130px; border:3px solid var(--ink); border-radius:50% 50% 0 0; background:#d98a5e; transform:scaleX(1.45); }.hills i:nth-child(2) { height:190px;background:#e9b952; }.hills i:nth-child(3) { height:155px;background:#668c78; }.hills i:nth-child(4) { height:205px;background:#bd6571; }.schedule { position:relative; z-index:4; margin-top:-37px; }.schedule__grid { display:flex; align-items:center; justify-content:center; gap:28px; padding:21px; border:3px solid var(--ink); border-radius:28px; background:var(--cream); box-shadow:7px 7px 0 var(--ink); text-align:center; }.schedule article { min-width:200px; display:grid; }.schedule article span { font:800 1.75rem 'Baloo 2'; text-transform:uppercase; }.schedule article strong { color:var(--coral); font-size:1.2rem; }.schedule__cross { font-size:2.1rem; color:var(--mustard); }.invitation { padding:110px 0 100px; background:#f4ddaa; }.invitation__content,.registration__layout { display:grid; grid-template-columns:1.1fr .9fr; gap:70px; align-items:center; }.section-label { margin:0 0 6px; color:var(--coral); font-weight:900; text-transform:uppercase; letter-spacing:.1em; }.invitation h2,.registration h2 { margin:0; font:800 clamp(2.5rem,5vw,4rem)/.92 'Baloo 2'; }.invitation p:not(.section-label),.registration__copy p:not(.section-label) { font-size:1.15rem; line-height:1.65; }.people { display:flex; align-items:end; justify-content:center; min-height:210px; padding:35px 12px 0; border:3px solid var(--ink); border-radius:50% 50% 30px 30px; background:#77cdd1; }.people span { display:grid; place-items:center; width:90px; height:120px; margin-left:-15px; border:3px solid var(--ink); border-radius:50% 50% 25px 25px; background:var(--coral); font-size:3rem; }.people span:nth-child(2n) { height:145px;background:var(--mustard); }.registration { padding:100px 0; background:var(--aqua); }.church { font:800 1.5rem 'Baloo 2'; }.form-card { padding:32px; border:3px solid var(--ink); border-radius:25px; background:var(--cream); box-shadow:8px 8px 0 var(--ink); }.form-card label { display:block; margin:0 0 7px; font-weight:900; }.form-card input { width:100%; margin-bottom:17px; padding:13px; border:2px solid var(--ink); border-radius:10px; background:white; font:inherit; }.form-card input:focus { outline:3px solid var(--mustard); }.form-card small { display:block; margin-top:-13px;margin-bottom:12px;color:#9d2639;font-weight:800; }.button--green { width:100%; margin-top:8px; background:var(--green); color:white; cursor:pointer; }.form-note { margin:17px 0 0; text-align:center; font-size:.82rem; } footer { padding:26px; background:var(--ink); color:white; text-align:center; font-weight:800; } @media(max-width:700px) { .hero { min-height:670px;padding-top:53px; }.eyebrow { gap:8px;flex-direction:column; }.schedule__grid { gap:11px;padding:14px 7px; }.schedule article { min-width:0; }.schedule article span { font-size:1.25rem; }.schedule article strong { font-size:.9rem; }.schedule__cross { display:none; }.invitation__content,.registration__layout { grid-template-columns:1fr; gap:35px; }.invitation,.registration { padding:75px 0; }.people { order:-1; } }