/* Direct-entry contact page, sharing the form used in the contact slide-out. */
.yl-contact-page-main{background:#f7f7ef}
.yl-contact-page{
 position:relative;isolation:isolate;margin:0!important;padding:clamp(2.5rem,5vw,4.5rem) 0 clamp(4rem,7vw,6rem);
 background:radial-gradient(ellipse at 0 15%,#e4eccf88,transparent 53%),linear-gradient(150deg,#f9f8ef,#f3f5e9);
}
.yl-contact-page::before{
 content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.34;
 background:url('images/parents-margin-doodles.svg') center/100% 100% no-repeat,url('images/event-paper-grain.svg') center/180px 180px repeat;
}
.yl-contact-page .yl-contact-page-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start;gap:clamp(2rem,5vw,4.5rem);margin:0 auto}
.yl-contact-page-grid>*{min-width:0;margin:0!important}
.yl-contact-page .yl-contact-page-copy>.yl-subtitle{font:800 var(--yl-type-label)/1.5 var(--yl-font-body);letter-spacing:.13em;margin:0 0 1rem}
.yl-contact-page h1{font:800 var(--yl-type-page-title)/1.06 var(--yl-font-heading);letter-spacing:-.025em;margin:0 0 .85rem;text-wrap:balance}
.yl-contact-page .yl-contact-page-copy>.yl-script{position:relative;width:fit-content;font:600 var(--yl-type-script-large)/1.2 var(--yl-font-accent);color:#526e55;margin:.75rem 0 1.6rem;transform:rotate(-2deg)}
.yl-contact-page .yl-contact-page-copy>.yl-script::after{content:"";position:absolute;left:0;right:-.4rem;bottom:-.25rem;height:3px;background:var(--yl-lime);clip-path:polygon(0 38%,55% 0,100% 35%,98% 90%,28% 100%,1% 80%)}
.yl-contact-page .yl-contact-page-lede{max-width:34rem;font-size:var(--yl-type-body);line-height:1.8;margin:0 0 2rem;text-wrap:pretty}
.yl-contact-page .yl-contact-page-direct{
 position:relative;padding:1.6rem 1.7rem;background:linear-gradient(135deg,#0b4652,#002936);color:#fffef7;border-radius:5px;box-shadow:6px 7px 0 #aebf8c45;
}
.yl-contact-page .yl-contact-page-direct::before{content:"";position:absolute;inset:0;border-radius:inherit;background:url('images/event-paper-grain.svg') center/180px repeat;opacity:.24;pointer-events:none}
.yl-contact-page .yl-contact-page-direct>*{position:relative}
.yl-contact-page .yl-contact-page-direct>.yl-subtitle{font:750 var(--yl-type-label)/1.5 var(--yl-font-body);letter-spacing:.1em;color:#d4f32c;margin:0 0 .5rem}
.yl-contact-page .yl-contact-page-direct h2{font-size:var(--yl-type-card);line-height:1.15;margin:0 0 1rem;color:inherit}
.yl-contact-page .yl-contact-page-direct>p:not(.yl-subtitle){font-size:var(--yl-type-compact);line-height:1.7;margin:1rem 0 0}
.yl-contact-page .yl-contact-page-direct a{color:#fffef7;text-decoration-color:#b4ce88;text-underline-offset:4px;overflow-wrap:anywhere}
.yl-contact-page .yl-contact-page-direct a:hover{color:#d4f32c}
.yl-contact-page .yl-contact-page-direct strong{display:block;color:#c6d8c8;font-size:var(--yl-type-small);font-weight:600}
.yl-contact-page .yl-contact-page-social{display:flex;flex-wrap:wrap;gap:.65rem 1.3rem;margin:1.8rem 0 0;line-height:1.7;font-size:var(--yl-type-small)}
.yl-contact-page-social a{color:var(--yl-navy);font-weight:650;text-underline-offset:4px}
.yl-contact-page .yl-contact-page-next{padding-top:1.3rem;border-top:1px solid #c8d4bd;margin:1.5rem 0 0;font-size:var(--yl-type-small);line-height:1.8}
.yl-contact-page .yl-contact-page-next a{display:inline-block;margin-top:.3rem;font-weight:750;text-underline-offset:4px;color:var(--yl-navy)}
.yl-contact-page .yl-contact-page-form{
 position:relative;background:#fffef8;padding:clamp(1.35rem,3vw,2.25rem);border:1px solid #ccd6c0;border-top:4px solid var(--yl-lime);border-radius:5px;box-shadow:0 8px 25px #0029360a;
}
.yl-contact-page .yl-contact-page-form::before{content:"";position:absolute;left:42%;top:-.8rem;width:5.5rem;height:1.5rem;background:#d4ed69b3;transform:rotate(-5deg);clip-path:polygon(2% 5%,97% 0,100% 94%,0 100%);pointer-events:none}
.yl-contact-page .yl-contact-page-form h2{font-size:var(--yl-type-card);line-height:1.15;margin:0 0 .5rem}
.yl-contact-page .yl-contact-page-form-subtitle{font-size:var(--yl-type-small);line-height:1.7;margin:0 0 1.4rem;color:#4e6869}
.yl-contact-page .yl-contact-inline{max-width:none;margin:0!important;padding:0;border:0;border-radius:0;background:transparent}
.yl-contact-page .yl-contact-fields{gap:1.1rem 1rem}
.yl-contact-page .yl-contact-field:has(>input[name="email"]),.yl-contact-page .yl-contact-field:has(>input[name="phone"]){grid-column:auto}
.yl-contact-page .yl-contact-field input,.yl-contact-page .yl-contact-field select,.yl-contact-page .yl-contact-field textarea{border-color:#bbcbbb;background:#fff;font-size:var(--yl-type-compact)}
.yl-contact-page .yl-contact-preference label{font-size:var(--yl-type-small)}
.yl-contact-page .yl-contact-submit{background:var(--yl-navy);border-color:var(--yl-navy);color:#fffef7;transition:background-color .18s,color .18s}
.yl-contact-page .yl-contact-submit:hover{background:var(--yl-lime);border-color:#c1da25;color:var(--yl-navy)}
.yl-contact-page .yl-contact-direct{display:none}
@media(max-width:900px){.yl-contact-page .yl-contact-page-grid{gap:2rem;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.yl-contact-page .yl-contact-field:has(>input[name="email"]),.yl-contact-page .yl-contact-field:has(>input[name="phone"]){grid-column:1/-1}}
@media(max-width:781px){
 .yl-contact-page{padding:2.5rem 0 4rem}
 .yl-contact-page .yl-contact-page-grid{grid-template-columns:1fr;gap:2.5rem}
 .yl-contact-page .yl-contact-page-copy{display:contents}
 .yl-contact-page .yl-contact-page-grid{row-gap:0}
 .yl-contact-page .yl-contact-page-copy>.yl-subtitle{order:0}
 .yl-contact-page .yl-contact-page-copy>h1{order:1}
 .yl-contact-page .yl-contact-page-copy>.yl-script{order:2}
 .yl-contact-page .yl-contact-page-lede{order:3}
 .yl-contact-page .yl-contact-page-form{order:4;margin-top:.5rem!important}
 .yl-contact-page .yl-contact-page-direct{order:5;margin-top:2rem!important}
 .yl-contact-page .yl-contact-page-social{order:6}
 .yl-contact-page .yl-contact-page-next{order:7}
 .yl-contact-page h1{max-width:none;font-size:var(--yl-type-page-title)}
 .yl-contact-page .yl-contact-page-copy>.yl-script{font-size:var(--yl-type-script)}
 .yl-contact-page .yl-contact-page-lede{margin-bottom:1.5rem}
 .yl-contact-page .yl-contact-page-direct{padding:1.35rem 1.4rem}
 .yl-contact-page .yl-contact-page-social{margin-top:1.5rem}
 .yl-contact-page::before{opacity:.2}
}
@media(max-width:420px){.yl-contact-page .yl-contact-fields{grid-template-columns:1fr}.yl-contact-page .yl-contact-field{grid-column:1/-1}.yl-contact-page .yl-contact-preference>div{gap:.5rem}.yl-contact-page .yl-contact-preference label{font-size:var(--yl-type-small);padding:.6rem .65rem}}
@media(prefers-reduced-motion:reduce){.yl-contact-page .yl-contact-submit{transition:none}}
