/* Europe → Malta mandate layout — integrates reference grid with shared tokens */
.mg-mandate-main,
.mg-mandate-main * { box-sizing: border-box; }

.mg-mandate-main {
  width: min(100% - 40px, 1320px);
  margin: 0 auto;
  color: var(--ink-950, #111820);
  padding: 0 0 88px;
}

.mg-mandate-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding: 28px 0 18px;
}

.mg-mandate-heading h1 {
  margin: 0;
  color: var(--brand-navy, #0b3f6f);
  font: 800 clamp(2rem, 4vw, 3.2rem) / 1.05 Inter, system-ui, sans-serif;
  letter-spacing: -0.04em;
}

.mg-mandate-heading .lead {
  max-width: 760px;
  margin: 10px 0 0;
  color: var(--ink-600, #5e6a75);
  font: 400 1rem / 1.55 Inter, system-ui, sans-serif;
}

.mg-mandate-heading a.mg-service-link {
  color: var(--brand-navy, #0b3f6f);
  font-weight: 700;
  white-space: nowrap;
  text-decoration: underline;
}

.mg-mandate-card {
  width: 100%;
  padding: clamp(18px, 2.5vw, 34px);
  border: 1px solid var(--line, #dce5ec);
  border-radius: 16px;
  background: var(--surface, #fff);
  box-shadow: 0 14px 34px rgba(11, 63, 111, 0.09);
  margin-bottom: 16px;
}

.mg-form-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 18px;
}

.mg-field {
  grid-column: span 4;
  min-width: 0;
  margin: 0;
}

.mg-field--half { grid-column: span 6; }
.mg-field--wide { grid-column: span 8; }
.mg-field--full { grid-column: 1 / -1; }
.mg-field--third { grid-column: span 4; }

.mg-field label,
.mg-form-grid > label:not(.check):not(.copy-opt) {
  display: block;
  margin: 0 0 7px;
  color: var(--ink-950, #111820);
  font: 700 0.94rem / 1.3 Inter, system-ui, sans-serif;
}

.mg-field :is(input, select, textarea),
.mg-form-grid :is(input, select, textarea):not([type="checkbox"]) {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid #b9c7d2;
  border-radius: 10px;
  background: #fff;
  color: var(--ink-950, #111820);
  font: 400 16px / 1.35 Inter, system-ui, sans-serif;
}

.mg-field textarea { min-height: 104px; resize: vertical; }

.mg-field :is(input, select, textarea):focus-visible,
.mg-form-grid :is(input, select, textarea):focus-visible {
  outline: 3px solid rgba(0, 168, 199, 0.28);
  outline-offset: 2px;
  border-color: var(--brand-cyan, #00a8c7);
}

.mg-step-title {
  grid-column: 1 / -1;
  margin: 4px 0 0;
  padding-top: 4px;
  color: var(--brand-navy, #0b3f6f);
  font: 800 clamp(1.2rem, 2vw, 1.55rem) / 1.2 Inter, system-ui, sans-serif;
}

.mg-inline-hint {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--ink-600, #5e6a75);
  font-size: 0.9rem;
  line-height: 1.5;
}

.mg-mandate-guide { padding: 48px 0 24px; }
.mg-section-heading { max-width: 760px; margin-bottom: 24px; }
.mg-section-heading h2 {
  margin: 0 0 10px;
  color: var(--brand-navy, #0b3f6f);
  font: 800 clamp(1.8rem, 3vw, 2.6rem) / 1.08 Inter, system-ui, sans-serif;
  letter-spacing: -0.025em;
}
.mg-section-heading p { margin: 0; color: var(--ink-600, #5e6a75); line-height: 1.65; }

.mg-process-grid,
.mg-info-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.mg-process-card,
.mg-info-card {
  padding: 24px;
  border: 1px solid var(--line, #dce5ec);
  border-radius: 16px;
  background: #fff;
}

.mg-process-number {
  display: grid;
  width: 38px;
  height: 38px;
  margin-bottom: 16px;
  place-items: center;
  border-radius: 50%;
  background: var(--brand-navy, #0b3f6f);
  color: #fff;
  font-weight: 800;
}

.mg-process-card h3,
.mg-info-card h3 {
  margin: 0 0 8px;
  color: var(--brand-navy, #0b3f6f);
  font-size: 1.14rem;
}
.mg-process-card p,
.mg-info-card p {
  margin: 0;
  color: var(--ink-600, #5e6a75);
  line-height: 1.6;
}

.mg-packing {
  display: grid;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr);
  gap: 32px;
  align-items: center;
  margin: 48px 0;
  padding: clamp(22px, 4vw, 42px);
  border-radius: 16px;
  background: var(--canvas-soft, #f4f8fb);
}

.mg-packing img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 12px;
}

.mg-packing h2 { margin: 0 0 12px; color: var(--brand-navy, #0b3f6f); }
.mg-packing ul {
  margin: 0;
  padding-left: 1.2rem;
  color: var(--ink-600, #5e6a75);
  line-height: 1.7;
}

.mg-faq { margin-top: 48px; }
.mg-faq details { border-bottom: 1px solid var(--line, #dce5ec); padding: 0; }
.mg-faq summary {
  min-height: 52px;
  padding: 16px 4px;
  color: var(--brand-navy, #0b3f6f);
  font-weight: 800;
  cursor: pointer;
}
.mg-faq details p {
  margin: 0;
  padding: 0 4px 18px;
  color: var(--ink-600, #5e6a75);
  line-height: 1.65;
}

.mg-mandate-progress {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 16px;
}

.mg-mandate-progress span {
  min-height: 40px;
  display: grid;
  place-items: center;
  padding: 8px 10px;
  border-radius: 10px;
  background: var(--line, #dce5ec);
  color: var(--ink-600, #5e6a75);
  font-size: 0.8rem;
  font-weight: 700;
  text-align: center;
}

.mg-mandate-progress span.on {
  background: var(--brand-cyan-dark, #087fa8);
  color: #fff;
}

/* Keep parcel rows horizontal on desktop inside widened form */
.mg-mandate-card .parcel {
  display: grid;
  grid-template-columns: minmax(100px, 0.35fr) minmax(120px, 0.55fr) minmax(0, 1.4fr) auto;
  gap: 12px;
  align-items: end;
}

@media (max-width: 900px) {
  .mg-mandate-main { width: min(100% - 28px, 760px); }
  .mg-mandate-heading { grid-template-columns: 1fr; gap: 8px; padding-top: 22px; }
  .mg-mandate-heading h1 { font-size: clamp(1.9rem, 8vw, 2.75rem); }
  .mg-field,
  .mg-field--half,
  .mg-field--wide,
  .mg-field--third { grid-column: span 6; }
  .mg-process-grid,
  .mg-info-grid { grid-template-columns: 1fr; }
  .mg-packing { grid-template-columns: 1fr; }
  .mg-mandate-card .parcel { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .mg-mandate-main { width: min(100% - 20px, 520px); }
  .mg-mandate-card { padding: 16px; }
  .mg-form-grid { grid-template-columns: 1fr; gap: 14px; }
  .mg-field,
  .mg-field--half,
  .mg-field--wide,
  .mg-field--full,
  .mg-field--third,
  .mg-step-title,
  .mg-inline-hint { grid-column: 1; }
  .mg-mandate-progress { grid-template-columns: 1fr; }
  .mg-mandate-guide { padding-top: 36px; }
}