.menu-philosophy{max-width:1280px;margin-inline:auto;padding:56px 80px 64px;color:var(--green);position:relative;background:transparent;isolation:isolate;box-shadow:none;clip-path:none;border-radius:0}
.menu-philosophy::before{content:'';position:absolute;z-index:-1;inset:0 auto 0 calc(50% - 50vw);width:100vw;background:var(--yellow);border-radius:50% 50% 0 0 / var(--footer-arch,30px) var(--footer-arch,30px) 0 0}
.menu-philosophy .eyebrow{font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.menu-philosophy h2{font-family:PangramCompressed,Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:100px;line-height:.9;margin:20px 0 28px}
.menu-philosophy p:not(.eyebrow){max-width:680px;font-size:18px;line-height:1.6;margin-top:16px}
.menu-philosophy>a{display:inline-flex;gap:40px;margin-top:30px;padding-bottom:10px;border-bottom:1px solid;font-size:18px}
@media(max-width:700px){.menu-philosophy{padding:40px 24px}.menu-philosophy h2{font-size:76px}.menu-philosophy p:not(.eyebrow){font-size:16px}}
/* Continue the preceding blue surface underneath the yellow arch. */
.couple+.menu-philosophy::after{content:'';position:absolute;z-index:-2;top:-1px;left:calc(50% - 50vw);width:100vw;height:242px;background:var(--blue);pointer-events:none}
/* The surfaces stay still; only their contents are revealed. */
.footer-line-mask{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.footer-line-motion{display:block;transform-origin:50% 100%}
@media(prefers-reduced-motion:reduce){.footer-line-mask{overflow:visible}}

@media(prefers-reduced-motion:reduce){.menu-philosophy{--footer-arch:30px!important}}

/* Shared footer composition from Figma. */
.menu-philosophy{min-height:562px;padding:56px 80px 24px}
.menu-philosophy h2{line-height:1;margin:20px 0}
.footer-copy{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.menu-philosophy .footer-copy p{margin:0;font-size:18px;line-height:1.55;max-width:none}
.footer-copy>a{grid-column:1;display:block;max-width:178px;margin-top:28px;font-size:18px;line-height:1.55}
.footer-waves{position:absolute;right:calc(50% - 50vw);bottom:0;width:min(43.6vw,558px);height:198px;overflow:hidden;pointer-events:none}
.footer-waves img{position:absolute;display:block;height:auto}
.footer-wave-side{width:51.58%;left:0;bottom:0}.footer-wave-back{width:76.36%;right:0;bottom:0}.footer-wave-front{width:46.44%;right:0;bottom:0}
.menu-footer{min-height:126px;padding:48px;align-items:flex-start}
@media(max-width:850px){.menu-philosophy{padding-inline:36px}.footer-copy{grid-template-columns:1fr;max-width:600px}.footer-copy>a{margin-top:8px}.menu-philosophy{padding-bottom:170px}.footer-waves{width:360px;height:150px}.menu-footer{padding:32px 24px}}
@media(max-width:700px){.menu-philosophy{padding:40px 24px 155px}.menu-philosophy h2{font-size:76px}.menu-philosophy .footer-copy p,.footer-copy>a{font-size:16px}.footer-waves{width:300px;height:120px}}
/* Align the lower footer with the philosophy content above it. */
.menu-footer{padding-inline:80px}
@media(min-width:701px) and (max-width:850px){.menu-footer{padding-inline:36px}}
@media(max-width:700px){.menu-footer{padding-inline:24px}}
/* Match both footer content edges to the product grid at every viewport. */
.menu-philosophy,.menu-footer{max-width:var(--page-width);padding-inline:calc(min(100vw,var(--page-width)) * .0617)}
@media(max-width:700px){.menu-philosophy,.menu-footer{padding-inline:var(--product-gutter)}}
.footer-copy{max-width:none}
