:root{color-scheme:only dark;--navy:#07182e;--cream:#f8f6f0;--muted:#b7bec7;--line:rgba(248,246,240,.3);font-family:Arial,Helvetica,sans-serif;color:var(--cream);background:var(--navy);font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:5px}
button,input,textarea,select{font:inherit}
button,a,input,select,textarea{touch-action:manipulation}
:focus-visible{outline:2px solid currentColor;outline-offset:6px}
.visually-hidden,.skip-link:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link:focus{position:fixed;left:20px;top:20px;z-index:10;padding:16px;background:var(--cream);color:var(--navy)}
.hero{position:relative;padding:121.5px 0 24px;isolation:isolate;overflow:hidden}
.hero-picture{position:relative;z-index:-1;display:block;width:100%;max-width:1120px;margin:0 auto}
.hero-picture img{display:block;width:100%;height:auto;
  /* Soft contour follows the speakers and reflection, not the photo frame. */
  -webkit-mask-image:url("assets/hero-contour-mask.svg");
  mask-image:url("assets/hero-contour-mask.svg");
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-mode:alpha}

.hero-inner{position:absolute;inset:0;width:min(1280px,86%);height:100%;margin:auto;pointer-events:none}.hero-inner a{pointer-events:auto}
.hero-contact{position:absolute;right:0;top:45px;font-size:13px;letter-spacing:.06em;text-decoration:none;display:flex;gap:24px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.hero-contact span{font-size:19px}
.cerelis-logo{position:absolute;top:26.5px;left:0;width:300px;max-width:55%;height:auto}
.brands{color-scheme:only light;color:var(--navy);background:var(--cream);text-align:center;padding:70px 24px 76px}
.eyebrow{font-size:10px;font-weight:400;letter-spacing:.25em;text-transform:uppercase;margin:0 0 37px}
.accuton-link{display:inline-block;max-width:76%;line-height:0}
.accuton-link img{width:280px;max-width:100%;height:auto}
.contact{width:min(1280px,86%);margin:0 auto;padding:100px 0 0}
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:9%}
.contact-intro h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(40px,4.4vw,65px);line-height:1.1;letter-spacing:-.035em;margin:0 0 24px}
.contact-intro p{font-size:14px;line-height:1.7;color:var(--muted);margin:0 0 36px}
.email-link{font-size:14px;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:8px;display:inline-block}
.field{min-width:0;margin:0 0 26px}
.field label{display:block;font-size:11px;letter-spacing:.06em;color:var(--muted);margin-bottom:10px}
.field input,.field textarea,.field select{display:block;width:100%;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--cream);padding:10px 0 14px;font-size:15px;line-height:1.5;transition:border-color .15s}
.field select{padding-right:10px}
.field option{background:var(--navy);color:var(--cream)}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--cream);outline:2px solid var(--cream);outline-offset:4px}
.field textarea{resize:vertical;min-height:110px;max-height:420px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-note{font-size:11px;line-height:1.7;color:var(--muted);margin:4px 0 22px}
.submit-button{border:1px solid var(--cream);background:var(--cream);color:var(--navy);display:flex;justify-content:space-between;align-items:center;gap:58px;padding:16px 22px;font-size:12px;cursor:pointer;min-height:50px;transition:background .15s,color .15s}
.submit-button:hover{background:var(--navy);color:var(--cream)}
.submit-button:disabled{opacity:.65;cursor:wait}
.submit-button span:last-child{font-size:20px;line-height:1}
.form-status{font-size:13px;line-height:1.7;margin:18px 0 0;color:var(--cream)}
.form-status:empty{display:none}
.form-status[data-state="error"]{color:#f2bcb1}
footer{display:flex;justify-content:space-between;gap:24px;border-top:1px solid var(--line);margin-top:88px;padding:28px 0 32px;color:var(--muted);font-size:10px;line-height:1.6;letter-spacing:.025em}
footer a{color:var(--cream);text-decoration:none}
.privacy-page{width:min(740px,86%);margin:0 auto;padding:65px 0;font-size:16px;line-height:1.8}
.privacy-page .back-link{font-size:13px}
.privacy-page h1{font:400 48px/1.1 Georgia,serif;margin:60px 0 32px}
.privacy-page h2{font:400 25px/1.3 Georgia,serif;margin-top:36px}
.privacy-page p{color:var(--muted)}

@media(min-width:901px){
  .hero{padding-top:0}
  /* Let the contour fade reach zero before the photograph's side boundaries. */
  .hero-picture img{
    --desktop-edge-fade:linear-gradient(to right,transparent,rgba(0,0,0,.16) 3%,rgba(0,0,0,.5) 6%,rgba(0,0,0,.84) 9%,#000 12%,#000 88%,rgba(0,0,0,.84) 91%,rgba(0,0,0,.5) 94%,rgba(0,0,0,.16) 97%,transparent);
    -webkit-mask-image:url("assets/hero-contour-mask.svg"),var(--desktop-edge-fade);
    -webkit-mask-composite:source-in;
    mask-image:url("assets/hero-contour-mask.svg"),var(--desktop-edge-fade);
    mask-composite:intersect;
  }
  .cerelis-logo{left:calc(50% - 420px);top:30px;mix-blend-mode:lighten}
}
@media(max-width:900px) and (min-width:651px){.hero{padding-top:103.275px}.cerelis-logo{width:280px}.contact-layout{gap:6%}.field-row{grid-template-columns:1fr;gap:0}}
@media(max-width:650px){.hero{padding:164.475px 0 40px}.hero-inner{width:86%}.hero-contact{top:23px;font-size:11px;gap:15px}.cerelis-logo{top:57.475px;left:50%;transform:translateX(-50%);width:85%;max-width:340px}.brands{padding:52px 24px 56px}.eyebrow{font-size:9px;margin-bottom:29px}.accuton-link img{width:220px}.contact{padding-top:60px}.contact-layout{grid-template-columns:1fr;gap:46px}.contact-intro h2{font-size:46px;margin-bottom:18px}.contact-intro p{font-size:13px;margin-bottom:22px}.email-link{font-size:13px}.field-row{grid-template-columns:1fr;gap:0}.field{margin-bottom:24px}.submit-button{width:100%}footer{margin-top:58px;padding:25px 0 28px;font-size:9px}.privacy-page{padding-top:35px}.privacy-page h1{font-size:38px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Selected white/navy landing-page theme. */
.light-variant{
  --muted:#56616e;
  --line:rgba(7,24,46,.28);
  color-scheme:only light;
  color:var(--navy);
  background:#fff;
}
.theme-filters{position:absolute;pointer-events:none}
.light-variant .hero{background:#fff}
.light-variant .cerelis-logo{filter:url(#navy-logo);mix-blend-mode:multiply}
.light-variant .hero-picture img{
  /* The original studio photograph fades into white, with its reflection intact. */
  mix-blend-mode:multiply;
}
.light-variant .brands{background:var(--navy);color:var(--cream);color-scheme:only dark}
.light-variant .contact{width:100%;padding:100px 0 88px;background:#fff}
.light-variant .contact-layout{width:min(1280px,86%);margin:auto}
.light-variant .field input,
.light-variant .field textarea,
.light-variant .field select{color:var(--navy)}
.light-variant .field option{background:#fff;color:var(--navy)}
.light-variant .field input:focus,
.light-variant .field textarea:focus,
.light-variant .field select:focus{border-color:var(--navy);outline-color:var(--navy)}
.light-variant .submit-button{background:var(--navy);border-color:var(--navy);color:#fff}
.light-variant .submit-button:hover{background:#fff;color:var(--navy)}
.light-variant .form-status{color:var(--navy)}
.light-variant .form-status[data-state="error"]{color:#9b3027}
.light-variant .alternate-footer{display:block;margin:0;border:0;padding:28px 0 32px;background:var(--navy);color:#b7bec7}
.light-variant .footer-inner{width:min(1280px,86%);margin:auto;display:flex;justify-content:space-between;gap:24px}
@media(max-width:650px){
  .light-variant .contact{padding:60px 0 58px}
  .light-variant .alternate-footer{padding:25px 0 28px}
}

/* Reserved space for the future site menu. */
.site-header{height:64px;background:var(--navy)}
@media(max-width:650px){.site-header{height:48px}}