/* contact.css — Contact page (MN + EN) */

.contact__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:auto 1fr;grid-template-areas:"form direct" "form stores";column-gap:clamp(32px,5vw,88px);row-gap:0;align-items:start}
.contact__form{grid-area:form;display:flex;flex-direction:column;gap:24px;min-width:0}
.contact__direct{grid-area:direct;display:flex;flex-direction:column;gap:20px;min-width:0}
.contact__stores{grid-area:stores;min-width:0}

/* form panel: white card with a dark top rule, like .store / .pcard */
.contact__panel{background:var(--white);border-top:4px solid var(--core);padding:clamp(24px,3.4vw,48px)}
.contact__panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px 24px;flex-wrap:wrap;margin-bottom:clamp(24px,2.6vw,32px)}
.contact__panel .form{position:relative}
.field__opt{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-size:13px;color:var(--muted)}
.field select{appearance:none;-webkit-appearance:none;padding-right:48px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%2318191B' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 18px center}
.field__error:empty{min-height:0;margin-top:-8px}
.form__consent{display:flex;flex-direction:column;gap:8px}
.form__consent .check a{text-decoration:underline;text-decoration-color:var(--spark);text-decoration-thickness:2px;text-underline-offset:3px;color:var(--ink)}
.form__consent .check input[aria-invalid="true"]{outline:2px solid #B3261E;outline-offset:2px}
.form__actions .btn{min-width:220px}
.form__actions .btn[disabled]{opacity:.7;cursor:progress}
.form__status:focus{outline:2px solid var(--core);outline-offset:2px}

.contact__note{font-size:16px;line-height:1.55;color:var(--ink-3);padding-left:20px;border-left:3px solid var(--spark);max-width:640px}
.contact__note a{color:var(--ink);font-weight:600;white-space:nowrap;text-decoration:underline;text-decoration-color:var(--spark);text-decoration-thickness:2px;text-underline-offset:3px}

/* direct contacts */
.direct{margin:0;border-top:1px solid var(--core)}
.direct__row{padding:20px 0;border-bottom:1px solid var(--line-light);display:flex;flex-direction:column;gap:6px}
.direct dt{font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.direct dd{margin:0;font-size:17px;line-height:1.5;color:var(--ink-2)}
.direct__big{font-family:var(--f-head);font-size:clamp(24px,2.3vw,32px);font-weight:300;letter-spacing:-.015em;line-height:1.15;color:var(--ink);overflow-wrap:anywhere;
  background-image:linear-gradient(var(--spark),var(--spark));background-size:0 3px;background-repeat:no-repeat;background-position:0 100%;padding-bottom:3px;transition:background-size .3s var(--ease)}
.direct__big:hover,.direct__big:focus-visible{background-size:100% 3px}

.contact__stores{display:flex;flex-direction:column;gap:12px;margin-top:clamp(24px,3vw,40px)}
.contact__stores .stores{grid-template-columns:minmax(0,1fr);gap:8px;margin-top:8px}
.contact__stores .store{padding:18px 22px;border-top:0;border-left:4px solid var(--core)}
.contact__stores .store:first-child{border-left-color:var(--spark)}
.contact__stores .link{align-self:flex-start;margin-top:12px}

@media (max-width:1024px){
  .contact__grid{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"direct" "form" "stores";row-gap:clamp(48px,7vw,72px)}
  .contact__stores{margin-top:0}
  .contact__stores .stores{grid-template-columns:repeat(3,minmax(0,1fr))}
  .contact__stores .store{border-left:0;border-top:4px solid var(--core)}
  .contact__stores .store:first-child{border-top-color:var(--spark)}
  .direct{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
}
@media (max-width:760px){
  .contact__stores .stores{grid-template-columns:minmax(0,1fr)}
  .contact__stores .store{border-top:0;border-left:4px solid var(--core)}
  .contact__stores .store:first-child{border-left-color:var(--spark)}
}
@media (max-width:640px){
  .direct{grid-template-columns:minmax(0,1fr)}
  .form__actions .btn{width:100%}
}

/* ---------- QA 2026-10-15 ---------- */
.page-contact main :is(h1,h2){text-wrap:balance}
