/* Quiet controls and a lightweight, accessible notification form. */
button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid #1d1d1f;outline-offset:5px}
body:not(.keyboard-navigation) button:focus-visible,body:not(.keyboard-navigation) a:focus-visible,body:not(.keyboard-navigation) [tabindex]:focus-visible{outline:none!important}
.header .notify-trigger{border:0;cursor:pointer;background:#fff;color:#1d1d1f;gap:16px;padding:12px 19px;font-weight:600;transition:background .2s,transform .2s}
.header .notify-trigger:hover{background:#f5f5f7;transform:translateY(-1px)}
.hero{height:100svh;min-height:560px}
.hero .intro{top:clamp(140px,25svh,280px);left:clamp(30px,5.5vw,95px);max-width:min(610px,52vw)}
.hero .intro h1{position:static;font-size:clamp(38px,4.6vw,72px);font-weight:600;letter-spacing:-.05em;line-height:1.04;white-space:normal;margin:20px 0 0;pointer-events:auto}
.hero .intro p{font-size:clamp(16px,1.5vw,22px);line-height:1.45;letter-spacing:-.025em;margin-top:24px}
.footer-notify{display:inline-flex;gap:20px;align-items:center;border:0;padding:12px 20px;border-radius:24px;background:#1d1d1f;color:#fff}
#notify-dialog{width:min(480px,calc(100vw - 32px));max-height:calc(100svh - 32px);border-radius:30px;overflow-y:auto}
.notify-shell{position:relative;padding:56px 40px 35px}
.notify-close{position:absolute;top:17px;right:17px;display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:#f5f5f7;color:#6e6e73}
.notify-close svg,.notify-submit svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.notify-shell h2{font-size:clamp(38px,6vw,52px);font-weight:600;letter-spacing:-.055em;line-height:1.02;margin:18px 0}
#notify-description{color:#6e6e73;font-size:15px;line-height:1.55;margin:0 0 28px}
#notify-form label{display:block;font-size:12px;font-weight:600;margin:0 0 9px}
#notify-email{display:block;width:100%;height:54px;font:inherit;font-size:16px;letter-spacing:-.01em;padding:0 17px;border:1px solid #e2e2e7;border-radius:15px;background:#f5f5f7;color:#1d1d1f;outline-offset:3px}
#notify-email[aria-invalid=true]{border-color:#ad382f}
.notify-submit{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:50px;padding:0 18px;margin-top:12px;border:0;border-radius:15px;background:#1d1d1f;color:#fff;font-size:14px;font-weight:600}
.notify-submit:disabled{opacity:.65;cursor:wait}.notify-submit:hover:not(:disabled){background:#363638}
.notify-consent{font-size:10px;line-height:1.5;color:#77777c;margin:15px 2px 0}
.notify-feedback{font-size:13px;line-height:1.5;margin:18px 0 0;color:#58585e;min-height:0}.notify-feedback:empty{display:none}.notify-feedback.is-error{color:#a02b23}
.notify-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(max-width:600px){.hero{height:100svh;min-height:560px}.hero .intro{top:150px;left:30px;max-width:calc(100% - 60px)}.hero .intro h1{font-size:clamp(33px,8.7vw,45px);font-weight:600;max-width:320px;margin-top:16px}.hero .intro p{font-size:16px;margin-top:17px}.header .notify-trigger{font-size:11px;padding:10px 14px}.notify-shell{padding:52px 27px 30px}}
@media(max-height:580px) and (min-width:601px){.hero{min-height:0}.hero .intro{top:125px;max-width:60vw}.hero .intro h1{font-size:36px}.hero .intro p{font-size:16px;margin-top:12px}.hero-caption{bottom:34px}}
@media(prefers-reduced-motion:reduce){.header .notify-trigger{transition:none}}

/* Optical spacing uses the visible strokes, not text-glyph baselines. */
.control-icon{display:block;flex:none;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.expand,.circle-button,.close-dialog,.round-icon{display:grid;place-items:center;padding:0;line-height:0}
.feature-card .expand{width:32px;height:32px;right:17px;bottom:17px}.expand .control-icon{width:16px;height:16px}
.close-dialog{width:36px;height:36px;border-radius:50%;padding:0;gap:0;flex:none}.close-dialog .control-icon{width:18px;height:18px}
.circle-button .control-icon{width:18px;height:18px}.round-icon .control-icon{width:19px;height:19px}
.text-button,.back-top{display:inline-flex;align-items:center;gap:10px}.text-button .control-icon,.back-top .control-icon,.notify-trigger .control-icon,.footer-notify .control-icon{width:15px;height:15px}
.notify-close{width:34px;height:34px}.notify-close svg{width:16px;height:16px}
@media(max-width:600px){.hero-caption .round-icon .control-icon{width:16px;height:16px}.feature-card .expand{right:15px;bottom:15px}}
