.groups-page { --g:min(1px,.052083333vw); background:#003377; color:#fff; }
.groups-main { min-height:calc(1627 * var(--g)); padding:calc(123 * var(--g)) 0 calc(84 * var(--g)); background:linear-gradient(219deg,#00347b,#0059d1); }
.signup-card { position:relative; display:grid; grid-template-columns:1fr 1fr; width:calc(1386 * var(--g)); height:calc(1420 * var(--g)); margin:auto; border:calc(1.1 * var(--g)) solid #a9c4e7; border-radius:calc(44 * var(--g)); overflow:hidden; }
.signup-portrait { position:relative; min-width:0; overflow:hidden; }
.signup-portrait>img { position:absolute; width:calc(1122 * var(--g)); max-width:none; height:auto; left:calc(-188.1 * var(--g)); top:calc(68.9 * var(--g)); }
.signup-panel { position:relative; min-width:0; background:#0651b5; }
.signup-brand { position:absolute; top:calc(52 * var(--g)); left:calc(140 * var(--g)); width:calc(412.61 * var(--g)); }
.signup-brand img { width:100%; }
.signup-panel h1 { position:absolute; left:calc(42.94 * var(--g)); top:calc(200 * var(--g)); margin:0; font-size:calc(56.5 * var(--g)); line-height:calc(60 * var(--g)); font-weight:900; text-transform:uppercase; letter-spacing:-.02em; }
.signup-intro { position:absolute; left:calc(42.94 * var(--g)); top:calc(338 * var(--g)); margin:0; font-size:calc(19.483 * var(--g)); line-height:calc(24 * var(--g)); font-weight:600; text-transform:uppercase; }
.signup-form { position:absolute; top:calc(449 * var(--g)); left:calc(42.94 * var(--g)); width:calc(595.647 * var(--g)); }
.signup-field { height:calc(145.333 * var(--g)); }
.signup-field>label { display:block; font-size:calc(22.02 * var(--g)); line-height:calc(27 * var(--g)); font-weight:800; text-transform:uppercase; margin-bottom:calc(10.647 * var(--g)); }
.signup-field>input:not([type=hidden]),.city-trigger { display:block; box-sizing:border-box; width:100%; height:calc(80.374 * var(--g)); border:calc(2.2 * var(--g)) solid #6998d5; border-radius:calc(11 * var(--g)); padding:0 calc(24.222 * var(--g)); background:#3773c3; color:#fff; font-family:inherit; font-size:calc(24.222 * var(--g)); font-weight:500; outline-offset:4px; }
.signup-field>input::placeholder { color:#88acda; opacity:1; }
.signup-field>input:focus-visible,.city-trigger:focus-visible,.city-search:focus-visible { outline:2px solid #fec502; }
.city-field { position:relative; }
.city-trigger { display:flex; align-items:center; justify-content:space-between; text-align:left; gap:16px; cursor:pointer; color:#88acda; }
.city-trigger.has-value { color:#fff; }
.city-trigger svg { width:calc(12 * var(--g)); height:calc(28 * var(--g)); flex-shrink:0; color:#ccdcf0; }
.city-popup { position:absolute; top:calc(126 * var(--g)); left:0; right:0; z-index:5; padding:12px; background:#fff; color:#102a4c; border:1px solid #8cafde; border-radius:10px; box-shadow:0 12px 32px #00265366; }
[hidden] { display:none!important; }
.city-search { width:100%; padding:12px; font:inherit; font-size:16px; border:1px solid #b7cce5; border-radius:6px; color:#102a4c; background:#fff; }
.city-popup ul { margin:8px 0 0; padding:0; list-style:none; max-height:260px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.city-popup li { padding:10px 12px; font-size:16px; line-height:1.4; border-radius:5px; cursor:pointer; }
.city-popup li:hover,.city-popup li.is-active { background:#e9f2ff; }
.city-popup li[aria-selected=true] { background:#dbeaff; font-weight:700; }
.city-empty { margin:12px; font-size:15px; }
.signup-consents { margin-top:calc(27.7 * var(--g)); }
.signup-consent { display:flex; align-items:flex-start; gap:calc(17.6 * var(--g)); font-size:calc(15.414 * var(--g)); line-height:calc(19 * var(--g)); font-weight:500; color:#eff4fb; cursor:pointer; }
.signup-consent input { appearance:none; width:calc(26 * var(--g)); height:calc(26 * var(--g)); margin:0; border:calc(2 * var(--g)) solid #387dcc; border-radius:calc(5 * var(--g)); background:transparent; flex-shrink:0; cursor:pointer; }
.signup-consent input:checked { background:#0780ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12 4 4 8-8' stroke='%23002349' stroke-width='2.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/85% no-repeat; border-color:#4196f0; }
.signup-consent input:focus-visible { outline:2px solid #fec502; outline-offset:4px; }
.signup-marketing { margin-top:calc(34 * var(--g)); align-items:center; min-height:calc(26 * var(--g)); }
.signup-submit { display:block; width:calc(599 * var(--g)); height:calc(96 * var(--g)); margin:calc(55 * var(--g)) 0 0 calc(-2.94 * var(--g)); border:0; border-radius:calc(8 * var(--g)); background:#fec502; color:#102a4c; font:inherit; font-size:calc(20 * var(--g)); font-weight:800; text-transform:uppercase; cursor:pointer; }
.signup-submit:hover { background:#ffd429; }
.signup-submit:focus-visible { outline:2px solid #fff; outline-offset:4px; }
.signup-submit:disabled { opacity:.65; cursor:wait; }
.signup-note { margin:calc(17 * var(--g)) 0 0; font-size:calc(15.414 * var(--g)); line-height:calc(19 * var(--g)); font-weight:500; color:#a9c4e7; text-align:center; }
.signup-status { margin:16px 0 0; padding:12px; background:#fff; border-radius:8px; color:#102a4c; font-size:15px; line-height:1.4; }
.signup-card.has-status { overflow:visible; }
.signup-card.has-status .signup-panel { border-radius:0 calc(44 * var(--g)) calc(44 * var(--g)) 0; }
.groups-footer { height:calc(150 * var(--g)); border-top:calc(1 * var(--g)) solid #729ed7; background:#003377; }
.groups-footer .footer-inner { position:relative; display:block; width:calc(1185 * var(--g)); height:100%; min-height:0; margin:auto; padding:0; }
.groups-footer .footer-brand { position:absolute; left:0; top:calc(38.4 * var(--g)); width:calc(264.785 * var(--g)); }
.groups-footer .footer-brand .brand { width:100%; }
.groups-footer .footer-brand small { font-size:calc(10.714 * var(--g)); letter-spacing:calc(2 * var(--g)); margin-top:calc(7 * var(--g)); }
.groups-footer .footer-inner>strong { position:absolute; left:calc(385.4 * var(--g)); top:calc(55 * var(--g)); font-size:calc(30 * var(--g)); white-space:nowrap; line-height:1.2; }
.groups-footer .social-strip { position:absolute; left:calc(1069 * var(--g)); top:calc(63 * var(--g)); width:calc(124 * var(--g)); }
@media (max-width:900px) {
  .groups-main { min-height:0; padding:24px 16px 40px; }
  .signup-card { display:flex; flex-direction:column; width:100%; max-width:600px; height:auto; border-width:1px; border-radius:24px; }
  .signup-portrait { height:300px; flex:none; }
  .signup-portrait>img { width:520px; max-width:none; top:16px; left:calc(50% - 260px); }
  .signup-panel { padding:32px 24px; }
  .signup-card.has-status .signup-panel { border-radius:0 0 24px 24px; }
  .signup-brand,.signup-panel h1,.signup-intro,.signup-form { position:static; width:100%; }
  .signup-brand { display:block; width:250px; max-width:100%; margin:0 auto 32px; }
  .signup-panel h1 { font-size:clamp(28px,7.5vw,40px); line-height:1.12; text-align:center; }
  .signup-intro { margin:20px 0 30px; font-size:15px; line-height:1.5; text-align:center; }
  .signup-desktop-break { display:none; }
  .signup-field { height:auto; margin-bottom:24px; }
  .signup-field>label { font-size:15px; line-height:1.5; margin-bottom:8px; }
  .signup-field>input:not([type=hidden]),.city-trigger { height:56px; border-width:1px; border-radius:8px; padding-inline:14px; font-size:16px; }
  .city-trigger svg { width:12px; height:24px; }
  .city-popup { top:91px; padding:8px; }
  .signup-consents { margin-top:32px; }
  .signup-consent { font-size:13px; line-height:1.5; gap:12px; }
  .signup-consent input { width:24px; height:24px; border-width:1.5px; border-radius:5px; }
  .signup-marketing { margin-top:24px; align-items:flex-start; }
  .signup-submit { width:100%; height:auto; min-height:60px; padding:18px 12px; margin:32px 0 0; font-size:14px; border-radius:8px; line-height:1.4; }
  .signup-note { margin-top:16px; font-size:12px; line-height:1.5; }
  .groups-footer { height:auto; min-height:0; border-top-width:1px; }
  .groups-footer .footer-inner { display:flex; flex-direction:column; align-items:center; gap:24px; width:calc(100% - 32px); height:auto; padding:28px 0; }
  .groups-footer .footer-brand,.groups-footer .footer-inner>strong,.groups-footer .social-strip { position:static; }
  .groups-footer .footer-brand { width:220px; max-width:100%; }
  .groups-footer .footer-brand small { font-size:9px; letter-spacing:1px; margin-top:8px; }
  .groups-footer .footer-inner>strong { font-size:20px; white-space:normal; text-align:center; }
  .groups-footer .social-strip { width:124px; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto; } }

/* Compact screen layout: dimensions no longer follow the large PDF artboard. */
.groups-main { min-height:calc(100svh - 100px); padding:32px 24px; display:flex; align-items:center; }
.signup-card { width:100%; max-width:1000px; height:auto; border-width:1px; border-radius:24px; overflow:visible; }
.signup-portrait { border-radius:23px 0 0 23px; }
.signup-portrait>img { width:auto; height:calc(100% - 28px); left:50%; top:28px; transform:translateX(-50%); }
.signup-panel { padding:28px 32px; border-radius:0 23px 23px 0; }
.signup-brand,.signup-panel h1,.signup-intro,.signup-form { position:static; }
.signup-brand { display:block; width:240px; max-width:100%; margin:0 auto 24px; }
.signup-panel h1 { margin:0; font-size:32px; line-height:1.12; letter-spacing:-.02em; }
.signup-intro { margin:14px 0 24px; font-size:14px; line-height:1.45; }
.signup-desktop-break { display:none; }
.signup-form { width:100%; }
.signup-field { height:auto; margin-bottom:16px; }
.signup-field>label { font-size:14px; line-height:18px; margin-bottom:6px; }
.signup-field>input:not([type=hidden]),.city-trigger { height:46px; padding:0 14px; border-width:1px; border-radius:7px; font-size:16px; }
.city-trigger svg { width:10px; height:22px; }
.city-popup { top:75px; padding:8px; }
.signup-consents { margin-top:22px; }
.signup-consent { gap:10px; font-size:12px; line-height:1.45; }
.signup-consent input { width:20px; height:20px; border-width:1.5px; border-radius:4px; }
.signup-marketing { margin-top:16px; min-height:20px; }
.signup-submit { width:100%; height:auto; min-height:48px; margin:22px 0 0; padding:14px 12px; font-size:14px; line-height:1.4; border-radius:7px; }
.signup-note { margin-top:12px; font-size:12px; line-height:1.4; }
.signup-card.has-status { overflow:visible; }
.signup-card.has-status .signup-panel { border-radius:0 23px 23px 0; }
.groups-footer { height:auto; min-height:100px; border-top-width:1px; }
.groups-footer .footer-inner { width:calc(100% - 48px); max-width:1000px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 0; height:auto; }
.groups-footer .footer-brand,.groups-footer .footer-inner>strong,.groups-footer .social-strip { position:static; }
.groups-footer .footer-brand { width:180px; }
.groups-footer .footer-brand small { margin-top:6px; font-size:8px; letter-spacing:1px; }
.groups-footer .footer-inner>strong { font-size:20px; line-height:1.3; }
.groups-footer .social-strip { width:104px; flex-shrink:0; }
@media (max-width:1100px) and (min-width:901px) {
 .signup-panel { padding:24px; }
 .signup-panel h1 { font-size:30px; }
 .groups-footer .footer-inner>strong { font-size:18px; }
}
@media (max-width:900px) {
 .groups-main { min-height:0; padding:24px 16px 32px; }
 .signup-card { max-width:560px; }
 .signup-portrait { height:328px; border-radius:23px 23px 0 0; }
 .signup-portrait::after { content:""; position:absolute; inset:auto 0 0; height:110px; background:linear-gradient(to bottom,rgba(6,81,181,0),#0651b5); pointer-events:none; }
 .signup-portrait>img { width:100%; height:300px; max-width:100%; object-fit:contain; object-position:center bottom; top:28px; left:0; transform:none; }
 .signup-panel,.signup-card.has-status .signup-panel { padding:24px; border-radius:0 0 23px 23px; }
 .signup-brand { width:210px; margin-bottom:24px; }
 .signup-panel h1 { font-size:clamp(26px,6.8vw,32px); text-align:center; }
 .signup-intro { text-align:center; }
 .signup-field>input:not([type=hidden]),.city-trigger { height:48px; }
 .city-popup { top:77px; }
 .signup-consent { font-size:13px; }
 .signup-consent input { width:22px; height:22px; }
 .signup-marketing { align-items:flex-start; }
 .groups-footer .footer-inner { width:calc(100% - 32px); flex-direction:column; gap:20px; }
 .groups-footer .footer-brand { width:180px; }
 .groups-footer .footer-inner>strong { font-size:18px; white-space:normal; }
}
@media (max-width:360px) {
 .signup-panel { padding:24px 18px; }
 .signup-panel h1 { font-size:25px; }
 .signup-brand { width:190px; }
 .signup-submit { font-size:13px; }
}
