@import url('/assets/fonts.css');
/* Palette: ceci-la-mer/src/scss/utils/_variables.scss; forms/buttons: its components. */
:root{color-scheme:light;--blue:#1A6984;--navy:#364B67;--text:#324B4B;--grey:#7B776F;--pale:#DDEAEE;--ground:#FDFDFD;--white:#FFFFFF;--error:#F64960}
*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--text);font:18px/1.6 noirpro,sans-serif}a{color:var(--blue)}
.top{max-width:1120px;margin:auto;padding:24px 40px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--pale)}
.brand{display:block;text-decoration:none}.brand img{display:block;width:170px;height:auto}nav{display:flex;gap:20px}nav a{color:var(--navy);text-decoration:none;font-size:14px;padding:6px 0;letter-spacing:1px}nav a[aria-current]{border-bottom:2px solid var(--blue)}
.shell{max-width:980px;margin:0 auto;padding:64px 40px}.eyebrow{letter-spacing:1.5px;font-size:14px;font-weight:500;color:var(--navy)}h1{font:400 56px/1.15 'PF Marlet Display',serif;color:var(--blue);margin:16px 0 24px}h2{font:500 32px/1.2 'PF Marlet Display',serif;color:var(--blue)}.intro{max-width:670px;font-size:20px;color:var(--grey);margin:0 0 40px}
.lookup,.stay,.notice{padding:32px;background:var(--white);border:1px solid var(--pale)}.lookup-row{display:flex;gap:24px;align-items:stretch;margin-top:20px}.lookup-row input{flex:1;min-width:0}.hint{font-size:16px;color:var(--grey);margin:12px 0 20px}
label{display:block;font-size:16px;font-weight:400;color:var(--navy)}input:not([type=checkbox]):not([type=radio]),textarea,select{width:100%;padding:16px;border:0;border-bottom:2px solid var(--blue);border-radius:0;background:var(--ground);color:var(--navy);font:16px/1.5 noirpro,sans-serif;display:block;margin-top:8px}
input:focus,textarea:focus,select:focus,button:focus-visible,canvas:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
button{background:transparent;border:2px solid var(--blue);border-radius:0;color:var(--blue);padding:16px 40px;font:500 15px/1.5 noirpro,sans-serif;letter-spacing:1.5px;cursor:pointer;transition:background-color .2s,color .2s;white-space:normal}button:hover{background:var(--blue);color:var(--white)}button:disabled{opacity:.6;cursor:wait}
.stay{display:flex;gap:32px;flex-wrap:wrap;background:var(--pale);margin:40px 0}.stay span,.stay strong{display:block}.stay span{font-size:14px;color:var(--navy)}.stay strong{font-weight:500}
fieldset{border:0;border-top:1px solid var(--pale);padding:32px 0 12px;margin:40px 0}legend{padding-right:24px;font:500 28px/1.3 'PF Marlet Display',serif;color:var(--blue)}legend span{font:14px noirpro,sans-serif;margin-right:12px;color:var(--navy)}.grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}textarea{resize:vertical;margin-bottom:24px}
canvas{width:100%;height:auto;border:1px dashed var(--blue);background:var(--white);touch-action:none}.text-button{border:0;background:none;color:var(--blue);padding:12px 0;letter-spacing:0;text-decoration:underline}.text-button:hover{background:transparent;color:var(--navy)}
.check{display:flex;gap:16px;align-items:flex-start;margin:32px 0;font-weight:400}.check input{margin-top:6px;flex:none;accent-color:var(--blue)}.primary{width:100%;display:flex;justify-content:space-between;gap:16px;text-align:left;font-size:16px}.notice{margin:24px 0}.error{color:var(--error)}.notice.error{background:var(--white);border-color:var(--error)}.success{background:var(--pale)}.choice{display:flex;gap:16px;padding:16px 0;font-weight:400}
footer{border-top:1px solid var(--pale);margin-top:64px;padding-top:24px;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:14px;color:var(--grey)}footer img{width:130px;height:auto}footer span{font-size:14px}
@media(max-width:600px){.top{padding:20px 24px}.brand img{width:134px}.shell{padding:40px 24px}h1{font-size:40px}.intro{font-size:18px}.lookup,.notice{padding:24px}.lookup-row{flex-direction:column;gap:20px}.grid{grid-template-columns:1fr;gap:24px}.stay{gap:24px;padding:24px}legend{font-size:25px}.primary{font-size:15px;padding:16px 24px}footer{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
