.dcc-app,
.dcc-app *,
.dcc-app *::before,
.dcc-app *::after {
  box-sizing: border-box;
}

.dcc-app {
  --dcc-bg: #170b07;
  --dcc-panel: rgba(255, 250, 241, 0.96);
  --dcc-card: #fffaf2;
  --dcc-ink: #29140d;
  --dcc-soft: #755448;
  --dcc-line: rgba(91, 43, 20, 0.16);
  --dcc-red: #df3e35;
  --dcc-red-dark: #8f241d;
  --dcc-gold: #ffce71;
  --dcc-cream: #fff2d7;
  --dcc-shadow: 0 22px 60px rgba(61, 24, 9, 0.16);
  width: min(1240px, 100%);
  margin: 0 auto;
  padding: 0;
  font: 16px/1.55 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--dcc-ink);
  background: transparent;
  box-shadow: none;
  overflow: visible;
  isolation: isolate;
  position: relative;
}

.dcc-app::before {
  content: none;
}

.dcc-app > *,
.dcc-app form,
.dcc-app button,
.dcc-app a,
.dcc-app input,
.dcc-app select {
  position: relative;
  z-index: 1;
}

.dcc-app a {
  color: inherit;
  text-decoration: none;
}

.dcc-app button,
.dcc-app input,
.dcc-app select {
  font: inherit;
}

.dcc-app button {
  cursor: pointer;
}

.dcc-hero {
  position: relative;
  min-height: 664px;
  padding: 28px 28px 24px;
  border-radius: 28px;
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 33%, rgba(255, 150, 45, 0.28), transparent 18%),
    radial-gradient(circle at 86% 72%, rgba(255, 137, 31, 0.16), transparent 20%),
    linear-gradient(90deg, #050201 0%, #0a0201 36%, #120301 54%, #170502 100%);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
}

.dcc-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.06) 0%, rgba(0, 0, 0, 0.08) 22%, rgba(0, 0, 0, 0.16) 43%, rgba(0, 0, 0, 0.30) 52%, rgba(0, 0, 0, 0.06) 68%, rgba(0, 0, 0, 0) 100%);
  pointer-events: none;
  z-index: 1;
}

.dcc-hero__copy {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: min(100%, 540px);
  min-height: 100%;
  padding: 0 0 0 0;
}

.dcc-kicker,
.dcc-modal__kicker,
.dcc-result__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  max-width: 100%;
  padding: 10px 17px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.dcc-hero .dcc-kicker {
  color: #f8ddb6;
  background: linear-gradient(180deg, rgba(49, 14, 4, 0.86), rgba(23, 7, 3, 0.92));
  border: 1px solid rgba(190, 100, 35, 0.9);
  box-shadow: inset 0 0 0 1px rgba(255, 184, 104, 0.18), 0 10px 26px rgba(0, 0, 0, 0.25);
}

.dcc-hero .dcc-kicker > span {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 34%, #ff7e67 0%, #d13319 64%, #8c180f 100%);
  box-shadow: 0 0 0 1px rgba(255, 157, 132, 0.14), 0 0 15px rgba(255, 56, 20, 0.26);
  font-size: 11px;
}

.dcc-result__eyebrow,
.dcc-modal__kicker {
  color: #ffd892;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.dcc-hero h2,
.dcc-section__head h3,
.dcc-help h3 {
  margin: 18px 0 20px;
  font-size: clamp(70px, 7vw, 78px);
  line-height: 0.86;
  letter-spacing: -0.07em;
}

.dcc-hero h2 {
  width: 395px;
  max-width: 100%;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  color: #fdf2e7;
  text-wrap: balance;
  text-shadow: 0 1px 0 rgba(255,255,255,0.02);
}

.dcc-section__head h3,
.dcc-help h3 {
  font-size: clamp(25px, 3.2vw, 42px);
  letter-spacing: -0.045em;
  color: #24110b;
}

.dcc-lead {
  width: min(100%, 532px);
  margin: 0;
  color: rgba(171, 171, 188, 0.88);
  font-size: 16px;
  line-height: 1.72;
}

.dcc-lead strong {
  color: #f6dfbb;
  font-weight: 800;
}

.dcc-emergency-strip {
  position: relative;
  display: flex;
  align-items: center;
  width: min(100%, 536px);
  min-height: 116px;
  margin-top: 22px;
  padding: 22px 24px 22px 90px;
  border-radius: 24px;
  border: 1px solid rgba(238, 56, 25, 0.82);
  background: linear-gradient(180deg, rgba(76, 12, 7, 0.90), rgba(48, 6, 4, 0.95));
  color: #fae8db;
  box-shadow: inset 0 0 0 1px rgba(255, 206, 193, 0.06), 0 0 28px rgba(243, 58, 21, 0.16);
  font-size: 17px;
  line-height: 1.44;
  font-weight: 700;
}

.dcc-emergency-strip::before {
  content: "⚠";
  position: absolute;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(255, 96, 68, 0.45);
  background: linear-gradient(180deg, rgba(35, 5, 3, 0.58), rgba(71, 10, 6, 0.56));
  color: #ff795b;
  box-shadow: 0 0 18px rgba(255, 90, 52, 0.18);
  font-size: 24px;
  font-weight: 900;
}

.dcc-emergency-strip > span {
  display: block;
}

.dcc-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 14px;
  width: 560px;
  max-width: 100%;
  margin-top: 22px;
}

.dcc-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 58px;
  padding: 14px 22px;
  border-radius: 999px;
  border: 1px solid rgba(193, 112, 43, 0.54);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.1;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.dcc-btn::before {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  flex: 0 0 30px;
  border: 1px solid currentColor;
  font-size: 15px;
  opacity: 0.92;
}

.dcc-hero__actions .dcc-btn:nth-child(1)::before { content: "⌗"; }
.dcc-hero__actions .dcc-btn:nth-child(2)::before { content: "⌂"; }
.dcc-hero__actions .dcc-btn:nth-child(3)::before { content: "◇"; }
.dcc-hero__actions .dcc-btn:nth-child(4)::before { content: "◔"; }

.dcc-btn:hover {
  transform: translateY(-2px);
}

.dcc-btn span {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  flex: 0 0 30px;
  background: rgba(36, 14, 6, 0.26);
  border: 1px solid rgba(106, 56, 21, 0.20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}

.dcc-btn--primary {
  min-width: 232px;
  padding-right: 14px;
  color: #261005;
  border-color: rgba(255, 210, 138, 0.82);
  background: linear-gradient(180deg, #ffd48d 0%, #eda13d 100%);
  box-shadow: inset 0 0 0 2px rgba(255, 232, 191, 0.32), 0 12px 26px rgba(237, 162, 55, 0.24), 0 0 0 1px rgba(255, 187, 106, 0.22);
}

.dcc-btn--primary::before,
.dcc-btn--primary span {
  border-color: rgba(84, 42, 15, 0.26);
  background: rgba(67, 31, 10, 0.09);
}

.dcc-btn--ghost {
  min-width: 183px;
  background: rgba(12, 5, 4, 0.64);
  color: #efc47f;
  border-color: rgba(190, 108, 42, 0.42);
  box-shadow: inset 0 0 0 1px rgba(255, 206, 136, 0.03);
}

.dcc-btn--ghost span { display: none; }

.dcc-btn--wide {
  width: 100%;
  margin-top: 6px;
}

.dcc-hero__visual {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 52%;
  background: url("hero-dog.webp") right center / cover no-repeat;
  z-index: 2;
}

.dcc-hero__visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.90) 0%, rgba(0, 0, 0, 0.16) 18%, rgba(0, 0, 0, 0) 34%);
}

.dcc-dog-card,
.dcc-dog-face,
.dcc-choco-stack,
.dcc-dog-card strong,
.dcc-dog-card small {
  display: none !important;
}

.dcc-section {
  margin-top: 22px;
  padding: clamp(20px, 2.6vw, 34px);
  border-radius: 30px;
  background: rgba(255, 250, 242, 0.96);
  box-shadow: var(--dcc-shadow);
}

.dcc-section__head { margin-bottom: 18px; }
.dcc-section__head p { max-width: 820px; margin: 0; color: #76584a; }

.dcc-calc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.dcc-panel {
  border: 1px solid var(--dcc-line);
  border-radius: 26px;
  background: var(--dcc-panel);
  box-shadow: 0 16px 38px rgba(85, 42, 19, 0.10);
  padding: clamp(18px, 2.2vw, 26px);
}

.dcc-form { display: grid; gap: 18px; }
.dcc-field { display: grid; gap: 8px; min-width: 0; }
.dcc-label,
.dcc-field label,
.dcc-field > span,
.dcc-field--range > label { font-weight: 900; color: #3d2014; }

.dcc-field input,
.dcc-field select {
  width: 100%;
  min-height: 48px;
  border-radius: 16px;
  border: 1px solid rgba(94, 47, 24, 0.18);
  background: #fff;
  color: #25120b;
  padding: 10px 13px;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.dcc-field input:focus,
.dcc-field select:focus {
  border-color: rgba(223, 62, 53, 0.55);
  box-shadow: 0 0 0 4px rgba(223, 62, 53, 0.12);
}

.dcc-weight-row { display: grid; grid-template-columns: minmax(0, 1fr) 52px; align-items: center; gap: 9px; }
.dcc-weight-row span { height: 48px; display: grid; place-items: center; border-radius: 16px; background: #32170e; color: #fff; font-weight: 900; }
.dcc-field input[type="range"] { padding: 0; accent-color: var(--dcc-red); box-shadow: none; background: transparent; }
.dcc-hint { margin: 0; color: #76584a; }

.dcc-type-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dcc-type-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(94, 47, 24, 0.16);
  border-radius: 20px;
  background: #fff;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
.dcc-type-card:hover,
.dcc-type-card.is-active { transform: translateY(-2px); border-color: rgba(223, 62, 53, 0.46); box-shadow: 0 14px 30px rgba(79, 31, 11, 0.10); background: #fff8ec; }
.dcc-type-card input { position: absolute; opacity: 0; pointer-events: none; }
.dcc-type-card__emoji { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 15px; background: #fff1d0; font-size: 24px; }
.dcc-type-card strong { display: block; color: #2e170e; line-height: 1.1; }
.dcc-type-card small { display: block; margin-top: 3px; color: #7b5b4b; font-size: 12px; font-weight: 800; }

.dcc-field-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(110px, 140px) minmax(145px, 170px); gap: 10px; }

.dcc-result,
.dcc-brand-result {
  background: linear-gradient(180deg, #32170e, #1b0c08);
  color: #fff;
  align-self: start;
}

.dcc-result h4,
.dcc-brand-result h4 {
  margin: 12px 0 10px;
  font-size: clamp(23px, 2.3vw, 32px);
  line-height: 1.05;
  color: inherit;
}

.dcc-result p,
.dcc-brand-result p { margin: 0; color: rgba(255, 255, 255, 0.76); }
.dcc-meter { height: 14px; margin: 16px 0; border-radius: 999px; background: rgba(255, 255, 255, 0.14); overflow: hidden; }
.dcc-meter span { display: block; width: 0%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #74d88e, #ffce71, #df3e35); transition: width 0.25s ease; }

.dcc-result-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 18px;
}
.dcc-brand-result .dcc-result-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dcc-result-stats span,
.dcc-modal__stats span {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.10);
  min-width: 0;
}
.dcc-result-stats strong,
.dcc-modal__stats strong { font-size: 22px; color: #ffdf91; line-height: 1.1; }
.dcc-result-stats small,
.dcc-modal__stats small { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(255, 255, 255, 0.70); font-weight: 900; }

.dcc-callout {
  margin-top: 16px;
  padding: 13px 14px;
  border-radius: 18px;
  background: rgba(223, 62, 53, 0.15);
  border: 1px solid rgba(255, 116, 105, 0.28);
  color: #ffd9d5;
}

.dcc-scale {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.dcc-scale-card {
  appearance: none;
  width: 100%;
  min-height: 185px;
  padding: 16px;
  border-radius: 24px;
  border: 1px solid rgba(94, 47, 24, 0.14);
  background: linear-gradient(180deg, #fff, #fff1d5);
  box-shadow: 0 15px 30px rgba(65, 27, 10, 0.08);
  color: #2e170e;
  text-align: left;
  display: flex;
  flex-direction: column;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.dcc-scale-card:hover,
.dcc-scale-card.is-active { transform: translateY(-3px); border-color: rgba(223, 62, 53, 0.45); box-shadow: 0 20px 46px rgba(65, 27, 10, 0.14); }
.dcc-scale-card span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; background: #3b1c12; font-size: 24px; }
.dcc-scale-card h4 { margin: 14px 0 6px; font-size: 18px; line-height: 1.12; color: inherit; }
.dcc-scale-card strong { margin-bottom: 8px; color: #c73028; }
.dcc-scale-card p { margin: auto 0 0; color: #76584a; font-size: 13px; }
.dcc-scale-card--baking,
.dcc-scale-card--cocoa { background: linear-gradient(180deg, #3b1c12, #170a07); color: #fff; }
.dcc-scale-card--baking p,
.dcc-scale-card--cocoa p { color: rgba(255, 255, 255, 0.78); }
.dcc-scale-card--baking strong,
.dcc-scale-card--cocoa strong { color: #ffce71; }
.dcc-scale-picked {
  margin-top: 14px;
  padding: 15px 16px;
  border-radius: 20px;
  background: #fff2d7;
  border: 1px solid rgba(94, 47, 24, 0.14);
  color: #56392e;
  font-weight: 800;
}

.dcc-brand-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  grid-template-areas:
    "controls list"
    "result list";
  gap: 14px;
  align-items: start;
}
.dcc-brand-controls { grid-area: controls; display: grid; gap: 14px; }
.dcc-brand-list { grid-area: list; max-height: 620px; overflow: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding-right: 4px; }
.dcc-brand-result { grid-area: result; }
.dcc-brand-selected { padding: 13px; border-radius: 17px; background: #fff4da; color: #624131; font-weight: 800; }
.dcc-brand-card {
  width: 100%;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 10px;
  text-align: left;
  align-items: center;
  padding: 13px;
  border: 1px solid rgba(94, 47, 24, 0.14);
  border-radius: 20px;
  background: #fff;
  color: #2d160e;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
.dcc-brand-card:hover,
.dcc-brand-card.is-active { transform: translateY(-2px); border-color: rgba(223, 62, 53, 0.44); background: #fff7e8; box-shadow: 0 14px 30px rgba(79, 31, 11, 0.10); }
.dcc-brand-card span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: #fff0cd; font-size: 23px; }
.dcc-brand-card strong { line-height: 1.1; }
.dcc-brand-card small { display: block; margin-top: 4px; color: #745545; }
.dcc-brand-card.is-hidden { display: none; }

.dcc-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; counter-reset: dccStep; }
.dcc-timeline article { padding: 18px; border-radius: 24px; background: linear-gradient(180deg, #fff, #fff3db); border: 1px solid rgba(94, 47, 24, 0.14); position: relative; overflow: hidden; }
.dcc-timeline article::after { counter-increment: dccStep; content: counter(dccStep); position: absolute; right: 13px; top: 6px; font-size: 72px; font-weight: 900; color: rgba(109, 54, 28, 0.08); line-height: 1; }
.dcc-timeline span { display: inline-flex; padding: 7px 11px; border-radius: 999px; background: #30160e; color: #ffcf78; font-size: 12px; font-weight: 900; }
.dcc-timeline h4 { margin: 14px 0 8px; font-size: 20px; }
.dcc-timeline p { margin: 0; color: #76584a; }

.dcc-help-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dcc-steps { margin: 16px 0 0; padding-left: 21px; color: #654536; }
.dcc-steps li + li { margin-top: 10px; }
.dcc-symptoms { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.dcc-symptoms span { padding: 9px 12px; border-radius: 999px; background: #fff0d1; color: #5d311b; font-weight: 900; }
.dcc-small-note { margin: 16px 0 0; color: #76584a; }

.dcc-result.is-low .dcc-meter span { background: linear-gradient(90deg, #62ce80, #ffe099); }
.dcc-result.is-moderate .dcc-meter span { background: linear-gradient(90deg, #ffce71, #f09a3f); }
.dcc-result.is-danger .dcc-meter span,
.dcc-result.is-emergency .dcc-meter span { background: linear-gradient(90deg, #ffb15d, #df3e35); }
.dcc-result.is-emergency,
.dcc-brand-result.is-emergency { box-shadow: 0 0 0 3px rgba(223, 62, 53, 0.18), 0 20px 55px rgba(223, 62, 53, 0.26); }
.dcc-result--empty .dcc-meter span { width: 0 !important; }

.dcc-modal[hidden] { display: none !important; }
.dcc-modal {
  position: fixed !important;
  inset: 0;
  z-index: 999999 !important;
  display: grid;
  place-items: center;
  padding: 18px;
}
.dcc-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 7, 4, 0.76);
  backdrop-filter: blur(8px);
}
.dcc-modal__box {
  position: relative;
  z-index: 2;
  width: min(640px, 100%);
  max-height: min(760px, calc(100vh - 36px));
  overflow: auto;
  border-radius: 30px;
  padding: clamp(22px, 3vw, 34px);
  background:
    radial-gradient(circle at 10% 0%, rgba(255, 206, 113, 0.18), transparent 34%),
    linear-gradient(180deg, #32170e, #160a06);
  color: #fff;
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.dcc-modal__close {
  position: absolute !important;
  top: 14px;
  right: 14px;
  z-index: 3;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.10);
  color: #fff;
  font-size: 28px;
  line-height: 1;
}
.dcc-modal h3 { margin: 16px 44px 12px 0; font-size: clamp(30px, 4vw, 46px); line-height: 1; letter-spacing: -0.045em; color: #fff; }
.dcc-modal p { margin: 0; color: rgba(255, 255, 255, 0.78); }
.dcc-modal__meter { height: 16px; margin: 18px 0; border-radius: 999px; background: rgba(255, 255, 255, 0.14); overflow: hidden; }
.dcc-modal__meter span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #67d887, #ffce71, #df3e35); transition: width 0.24s ease; }
.dcc-modal__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.dcc-modal__warning { margin-top: 16px; padding: 14px 15px; border-radius: 20px; background: rgba(223, 62, 53, 0.16); border: 1px solid rgba(255, 116, 105, 0.28); color: #ffd9d5; font-weight: 800; }
.dcc-modal__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.dcc-modal.is-low .dcc-modal__meter span { background: linear-gradient(90deg, #62ce80, #ffe099); }
.dcc-modal.is-moderate .dcc-modal__meter span { background: linear-gradient(90deg, #ffce71, #f09a3f); }
.dcc-modal.is-danger .dcc-modal__meter span,
.dcc-modal.is-emergency .dcc-modal__meter span { background: linear-gradient(90deg, #ffb15d, #df3e35); }
.dcc-modal.is-emergency .dcc-modal__box { box-shadow: 0 0 0 3px rgba(223, 62, 53, 0.22), 0 40px 120px rgba(0, 0, 0, 0.46); }

@media (max-width: 1100px) {
  .dcc-hero,
  .dcc-calc-grid,
  .dcc-brand-layout {
    grid-template-columns: 1fr;
  }
  .dcc-brand-layout {
    grid-template-areas: "controls" "list" "result";
  }
  .dcc-brand-list { max-height: 560px; }
  .dcc-scale { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dcc-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .dcc-app { padding: 12px; border-radius: 24px; }
  .dcc-hero,
  .dcc-section { padding: 18px; border-radius: 24px; }
  .dcc-hero h2 { font-size: 40px; }
  .dcc-hero__visual { min-height: 250px; }
  .dcc-dog-card { width: 100%; }
  .dcc-type-grid,
  .dcc-field-row,
  .dcc-scale,
  .dcc-brand-list,
  .dcc-timeline,
  .dcc-help-grid,
  .dcc-result-stats,
  .dcc-modal__stats {
    grid-template-columns: 1fr;
  }
  .dcc-brand-list { max-height: 430px; }
  .dcc-btn,
  .dcc-modal__actions .dcc-btn { width: 100%; }
  .dcc-modal { padding: 10px; }
  .dcc-modal__box { border-radius: 24px; }
}


.dcc-form {
  width: 100%;
}

@media (max-width: 1080px) {
  .dcc-hero {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr);
    min-height: 580px;
  }

  .dcc-hero h2 {
    font-size: clamp(52px, 7vw, 72px);
  }

  .dcc-emergency-strip {
    width: 100%;
  }
}

@media (max-width: 860px) {
  .dcc-hero {
    grid-template-columns: minmax(0, 1fr);
    min-height: auto;
    padding-bottom: 0;
  }

  .dcc-hero::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.52) 0%, rgba(0, 0, 0, 0.28) 42%, rgba(0, 0, 0, 0.06) 100%);
  }

  .dcc-hero__copy {
    max-width: 100%;
    padding-right: 0;
  }

  .dcc-hero__visual {
    min-height: 360px;
    margin-top: 18px;
    background-position: center center;
  }

  .dcc-hero__actions {
    gap: 12px;
  }

  .dcc-btn--primary {
    min-width: 0;
  }
}

@media (max-width: 640px) {
  .dcc-hero {
    padding: 20px 18px 0;
    border-radius: 24px;
  }

  .dcc-kicker--hero {
    font-size: 11px;
    letter-spacing: 0.1em;
  }

  .dcc-hero h2 {
    margin-top: 16px;
    margin-bottom: 14px;
    font-size: clamp(44px, 14vw, 62px);
    line-height: 0.93;
  }

  .dcc-lead {
    font-size: 16px;
  }

  .dcc-emergency-strip {
    padding: 14px 14px;
    gap: 12px;
    border-radius: 22px;
    font-size: 15px;
  }

  .dcc-emergency-strip__icon {
    flex-basis: 46px;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    font-size: 23px;
  }

  .dcc-hero__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }

  .dcc-btn {
    min-height: 54px;
    padding: 12px 16px;
    font-size: 14px;
  }

  .dcc-btn--primary {
    grid-column: 1 / -1;
  }

  .dcc-btn__icon,
  .dcc-btn__arrow {
    width: 24px;
    height: 24px;
    flex-basis: 24px;
    font-size: 13px;
  }

  .dcc-hero__visual {
    min-height: 280px;
    margin-top: 14px;
    background-position: 58% center;
  }
}


@media (max-width: 1100px) {
  .dcc-hero {
    min-height: 620px;
  }

  .dcc-hero__copy {
    width: min(100%, 500px);
  }

  .dcc-hero h2 {
    width: 360px;
    font-size: clamp(60px, 6.2vw, 72px);
  }

  .dcc-hero__visual {
    width: 50%;
  }
}

@media (max-width: 860px) {
  .dcc-hero {
    min-height: auto;
    padding: 22px 20px 0;
  }

  .dcc-hero__copy {
    width: 100%;
    padding-bottom: 22px;
  }

  .dcc-hero h2 {
    width: min(100%, 340px);
    font-size: clamp(54px, 11vw, 70px);
  }

  .dcc-lead,
  .dcc-emergency-strip,
  .dcc-hero__actions {
    width: 100%;
  }

  .dcc-hero__visual {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    width: calc(100% + 40px);
    margin: 4px -20px 0;
    min-height: 340px;
    background-position: center center;
  }

  .dcc-hero__visual::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.52) 0%, rgba(0, 0, 0, 0) 28%);
  }
}

@media (max-width: 640px) {
  .dcc-hero {
    border-radius: 24px;
  }

  .dcc-hero .dcc-kicker {
    font-size: 10px;
    letter-spacing: 0.1em;
    padding: 9px 14px;
  }

  .dcc-hero h2 {
    margin: 16px 0 16px;
    width: min(100%, 300px);
    font-size: clamp(44px, 14vw, 58px);
    line-height: 0.9;
  }

  .dcc-lead {
    font-size: 15px;
    line-height: 1.6;
  }

  .dcc-emergency-strip {
    min-height: 0;
    padding: 16px 16px 16px 76px;
    font-size: 15px;
    line-height: 1.5;
  }

  .dcc-emergency-strip::before {
    left: 16px;
    width: 42px;
    height: 42px;
  }

  .dcc-hero__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .dcc-btn {
    width: 100%;
    min-height: 54px;
    padding: 12px 14px;
    font-size: 14px;
  }

  .dcc-btn::before,
  .dcc-btn span {
    width: 26px;
    height: 26px;
    flex-basis: 26px;
    font-size: 13px;
  }

  .dcc-btn--primary {
    grid-column: 1 / -1;
    min-width: 0;
  }

  .dcc-btn--ghost {
    min-width: 0;
  }

  .dcc-hero__visual {
    min-height: 292px;
  }
}


/* ===== Hero 1:1 fix ===== */
.dcc-hero {
  display: block;
  min-height: 664px;
  padding: 28px 24px 24px 24px;
  border-radius: 28px;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.10) 0%, rgba(0, 0, 0, 0.12) 18%, rgba(0, 0, 0, 0.24) 38%, rgba(0, 0, 0, 0.10) 56%, rgba(0, 0, 0, 0) 100%),
    url("hero-dog.webp") center center / cover no-repeat !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.26);
}

.dcc-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.22) 0%, rgba(0, 0, 0, 0.18) 24%, rgba(0, 0, 0, 0.08) 46%, rgba(0, 0, 0, 0.02) 68%, rgba(0, 0, 0, 0) 100%);
  z-index: 1;
  pointer-events: none;
}

.dcc-hero__copy {
  width: min(100%, 560px);
  max-width: 560px;
  min-height: 612px;
  justify-content: flex-start;
  padding: 0;
  z-index: 2;
}

.dcc-hero__visual {
  display: none !important;
}

.dcc-hero .dcc-kicker {
  margin-top: 0;
  padding: 10px 18px;
  gap: 10px;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.14em;
  color: #f8ddba;
  border: 1px solid rgba(182, 93, 32, 0.86);
  background: linear-gradient(180deg, rgba(52, 16, 5, 0.90), rgba(23, 8, 3, 0.92));
  box-shadow: inset 0 0 0 1px rgba(255, 185, 108, 0.16), 0 10px 24px rgba(0, 0, 0, 0.18);
}

.dcc-hero .dcc-kicker > span {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #ff876b 0%, #d63a1d 58%, #8a170d 100%);
  box-shadow: 0 0 0 1px rgba(255, 134, 91, 0.12), 0 0 14px rgba(255, 63, 26, 0.24);
  font-size: 10px;
}

.dcc-hero h2 {
  width: min(100%, 430px);
  margin: 18px 0 18px;
  font-size: 80px;
  line-height: 0.87;
  letter-spacing: -0.065em;
  color: #f6eee7;
  background: none;
  -webkit-text-fill-color: initial;
  text-shadow: 0 1px 0 rgba(255,255,255,0.02);
}

.dcc-lead {
  width: min(100%, 500px);
  font-size: 17px;
  line-height: 1.72;
  color: rgba(197, 199, 205, 0.84);
}

.dcc-lead strong {
  color: #f4dfc1;
}

.dcc-emergency-strip {
  width: min(100%, 612px);
  margin-top: 20px;
  padding: 23px 24px 23px 94px;
  min-height: 120px;
  border-radius: 25px;
  border: 1px solid rgba(241, 54, 18, 0.92);
  background: linear-gradient(180deg, rgba(76, 14, 8, 0.90), rgba(52, 8, 5, 0.95));
  box-shadow: inset 0 0 0 1px rgba(255, 198, 179, 0.05), 0 0 24px rgba(247, 63, 21, 0.16);
  color: #f6e4d8;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.42;
}

.dcc-emergency-strip::before {
  left: 22px;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  font-size: 24px;
  color: #ff7757;
  border: 1px solid rgba(255, 97, 64, 0.44);
  background: linear-gradient(180deg, rgba(33, 5, 4, 0.56), rgba(68, 10, 6, 0.55));
  box-shadow: 0 0 16px rgba(255, 88, 54, 0.16);
}

.dcc-hero__actions {
  width: min(100%, 620px);
  margin-top: 20px;
  gap: 14px;
}

.dcc-btn {
  min-height: 60px;
  padding: 14px 23px;
  gap: 12px;
  font-size: 16px;
  border-radius: 999px;
}

.dcc-btn::before {
  width: 30px;
  height: 30px;
  flex-basis: 30px;
}

.dcc-btn span {
  width: 30px;
  height: 30px;
  flex-basis: 30px;
}

.dcc-btn--primary {
  min-width: 240px;
  padding-right: 14px;
  color: #2a1206;
  border-color: rgba(255, 206, 129, 0.95);
  background: linear-gradient(180deg, #ffd38a 0%, #eca03c 100%);
  box-shadow: inset 0 0 0 2px rgba(255, 232, 194, 0.30), 0 10px 22px rgba(236, 160, 60, 0.18), 0 0 0 1px rgba(255, 187, 106, 0.18);
}

.dcc-btn--primary span {
  background: rgba(65, 31, 10, 0.12);
  border: 1px solid rgba(83, 40, 16, 0.22);
}

.dcc-btn--ghost {
  min-width: 190px;
  color: #efc27f;
  background: rgba(13, 6, 4, 0.68);
  border-color: rgba(188, 108, 42, 0.42);
}

@media (max-width: 860px) {
  .dcc-hero {
    min-height: 0;
    padding: 22px 18px 24px;
    background-position: 62% center !important;
  }
  .dcc-hero__copy {
    min-height: 0;
    width: min(100%, 420px);
  }
  .dcc-hero h2 {
    width: min(100%, 340px);
    font-size: clamp(58px, 11vw, 74px);
  }
  .dcc-emergency-strip,
  .dcc-hero__actions,
  .dcc-lead {
    width: 100%;
  }
}

@media (max-width: 640px) {
  .dcc-hero {
    border-radius: 24px;
    padding: 18px 16px 18px;
    background-position: 64% center !important;
  }
  .dcc-hero .dcc-kicker {
    padding: 9px 14px;
    font-size: 10px;
  }
  .dcc-hero h2 {
    width: min(100%, 295px);
    font-size: clamp(44px, 14vw, 60px);
    margin: 16px 0 14px;
  }
  .dcc-lead {
    font-size: 15px;
    line-height: 1.62;
  }
  .dcc-emergency-strip {
    min-height: 0;
    padding: 16px 16px 16px 74px;
    font-size: 15px;
  }
  .dcc-emergency-strip::before {
    left: 16px;
    width: 42px;
    height: 42px;
    border-radius: 14px;
  }
  .dcc-hero__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .dcc-btn {
    width: 100%;
    min-width: 0;
    min-height: 54px;
    padding: 12px 14px;
    font-size: 14px;
  }
  .dcc-btn--primary {
    grid-column: 1 / -1;
  }
}


/* ===== FINAL HERO 1:1 OVERRIDES 2026-04-26b ===== */
.dcc-hero{
  position:relative;
  min-height:664px;
  padding:26px 20px 22px 20px;
  border-radius:0;
  overflow:hidden;
  background:
    linear-gradient(90deg, rgba(0,0,0,.56) 0%, rgba(0,0,0,.48) 26%, rgba(0,0,0,.30) 40%, rgba(0,0,0,.10) 55%, rgba(0,0,0,0) 68%),
    url("hero-dog.webp") center center / cover no-repeat !important;
  box-shadow:none;
}
.dcc-hero::before{content:none !important;}
.dcc-hero__visual{display:none !important;}
.dcc-hero__copy{
  position:relative;
  z-index:2;
  width:560px;
  max-width:100%;
  min-height:616px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  padding:0 0 0 14px;
}
.dcc-hero .dcc-kicker{
  margin:0;
  padding:10px 18px;
  gap:10px;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#f2d9b2;
  border:1px solid rgba(184,97,36,.90);
  background:linear-gradient(180deg, rgba(63,20,7,.90), rgba(26,9,3,.94));
  box-shadow:inset 0 0 0 1px rgba(255,180,104,.12);
}
.dcc-hero .dcc-kicker > span{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:inline-grid;
  place-items:center;
  border-radius:50%;
  font-size:10px;
  background:radial-gradient(circle at 38% 38%, #ff8d73 0%, #dd4524 58%, #8a1c12 100%);
  box-shadow:0 0 0 1px rgba(255,138,100,.18), 0 0 12px rgba(255,87,42,.22);
}
.dcc-hero h2{
  width:435px;
  max-width:100%;
  margin:18px 0 20px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:80px;
  line-height:.865;
  letter-spacing:-.065em;
  font-weight:700;
  color:#f7efe6;
  text-shadow:none;
}
.dcc-hero h2 .dcc-title-top,
.dcc-hero h2 .dcc-title-bottom{display:block;}
.dcc-hero h2 .dcc-title-bottom{color:#f0c276;}
.dcc-lead{
  width:500px;
  max-width:100%;
  margin:0;
  font-size:18px;
  line-height:1.72;
  color:rgba(190,193,201,.90);
}
.dcc-lead strong{
  color:#f2ddb9;
  font-weight:800;
}
.dcc-emergency-strip{
  position:relative;
  width:556px;
  max-width:100%;
  margin-top:18px;
  padding:24px 26px 24px 96px;
  min-height:118px;
  display:flex;
  align-items:center;
  border-radius:24px;
  border:1px solid rgba(241,64,29,.90);
  background:linear-gradient(180deg, rgba(83,16,9,.92), rgba(53,9,6,.96));
  box-shadow:inset 0 0 0 1px rgba(255,200,183,.05), 0 0 0 1px rgba(120,20,8,.15);
  color:#f6e5d8;
  font-size:17px;
  line-height:1.43;
  font-weight:700;
}
.dcc-emergency-strip::before{
  content:"⚠";
  position:absolute;
  left:22px;
  top:50%;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:14px;
  font-size:24px;
  font-weight:900;
  color:#ff7757;
  border:1px solid rgba(255,91,59,.42);
  background:linear-gradient(180deg, rgba(29,5,4,.58), rgba(70,10,6,.58));
  box-shadow:0 0 16px rgba(255,94,59,.16);
}
.dcc-hero__actions{
  width:620px;
  max-width:100%;
  margin-top:20px;
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.dcc-btn{
  position:relative;
  min-height:58px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:12px 22px;
  border-radius:999px;
  font-size:16px;
  line-height:1.1;
  font-weight:700;
  box-shadow:none;
}
.dcc-btn::before{
  content:"";
  width:28px;
  height:28px;
  flex:0 0 28px;
  border-radius:50%;
  display:inline-grid;
  place-items:center;
  border:1px solid currentColor;
  font-size:14px;
  line-height:1;
}
.dcc-btn:hover{transform:none;}
.dcc-btn span{
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:inline-grid;
  place-items:center;
  border-radius:50%;
  font-size:18px;
}
.dcc-btn--primary{
  min-width:244px;
  justify-content:flex-start;
  padding-left:18px;
  padding-right:14px;
  color:#251005;
  border:1px solid rgba(255,214,144,.95);
  background:linear-gradient(180deg, #ffd388 0%, #eda03b 100%);
  box-shadow:inset 0 0 0 2px rgba(255,236,199,.34), 0 0 20px rgba(255,197,102,.15);
}
.dcc-btn--primary::before{
  content:"⌗";
  background:rgba(78,41,16,.09);
  border-color:rgba(90,49,20,.22);
}
.dcc-btn--primary span{
  background:rgba(64,31,11,.12);
  border:1px solid rgba(84,46,19,.22);
  margin-left:auto;
}
.dcc-btn--ghost{
  min-width:172px;
  justify-content:flex-start;
  padding-left:18px;
  color:#eec27c;
  border:1px solid rgba(183,102,39,.46);
  background:rgba(12,5,4,.66);
}
.dcc-btn--ghost span{display:none;}
.dcc-hero__actions .dcc-btn--ghost:nth-child(2)::before{content:"⌂";}
.dcc-hero__actions .dcc-btn--ghost:nth-child(3)::before{content:"◇";}
.dcc-hero__actions .dcc-btn--ghost:nth-child(4)::before{content:"◔";}

@media (max-width: 860px){
  .dcc-hero{
    min-height:0;
    padding:22px 16px 18px 16px;
    background-position:62% center !important;
  }
  .dcc-hero__copy{
    width:100%;
    min-height:0;
    padding-left:0;
  }
  .dcc-hero h2{
    width:360px;
    font-size:68px;
  }
  .dcc-lead,.dcc-emergency-strip,.dcc-hero__actions{width:100%;}
}
@media (max-width: 640px){
  .dcc-hero{
    padding:18px 14px 16px 14px;
    background-position:64% center !important;
  }
  .dcc-hero .dcc-kicker{
    padding:9px 14px;
    font-size:10px;
    letter-spacing:.12em;
  }
  .dcc-hero h2{
    width:290px;
    font-size:58px;
    margin:16px 0 16px;
  }
  .dcc-lead{
    font-size:15px;
    line-height:1.64;
  }
  .dcc-emergency-strip{
    min-height:0;
    padding:16px 16px 16px 74px;
    font-size:15px;
    line-height:1.5;
  }
  .dcc-emergency-strip::before{
    left:16px;
    width:42px;
    height:42px;
    border-radius:13px;
  }
  .dcc-hero__actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
  }
  .dcc-btn{
    width:100%;
    min-width:0;
    min-height:54px;
    padding:12px 14px;
    font-size:14px;
  }
  .dcc-btn::before{width:26px;height:26px;flex-basis:26px;font-size:13px;}
  .dcc-btn span{width:28px;height:28px;flex-basis:28px;}
  .dcc-btn--primary{grid-column:1/-1;}
}


/* ===== HERO COMPACT FIX 2026-04-26c ===== */
.dcc-hero{
  min-height: 594px;
  padding: 24px 20px 20px 20px;
  background:
    linear-gradient(90deg, rgba(0,0,0,.60) 0%, rgba(0,0,0,.52) 26%, rgba(0,0,0,.33) 40%, rgba(0,0,0,.12) 55%, rgba(0,0,0,0) 68%),
    url("hero-dog.webp") center center / cover no-repeat !important;
}
.dcc-hero__copy{
  min-height: 548px;
}
.dcc-kicker{display:none !important;}
.dcc-hero h2{
  margin: 6px 0 16px;
}
.dcc-lead{
  width: 490px;
  font-size: 17px;
  line-height: 1.64;
}
.dcc-emergency-strip{
  margin-top: 16px;
  width: 548px;
  min-height: 104px;
  padding: 20px 24px 20px 88px;
  font-size: 16px;
}
.dcc-emergency-strip::before{
  left: 20px;
  width: 44px;
  height: 44px;
}
.dcc-hero__actions{
  width: 612px;
  margin-top: 16px;
  gap: 12px;
}
.dcc-btn{
  min-height: 50px;
  padding: 10px 18px;
  font-size: 15px;
  gap: 12px;
}
.dcc-btn::before{
  width: 24px;
  height: 24px;
  flex-basis: 24px;
  font-size: 12px;
}
.dcc-btn span{
  width: 26px;
  height: 26px;
  flex-basis: 26px;
  font-size: 16px;
}
.dcc-btn--primary{
  min-width: 222px;
  padding-left: 16px;
  padding-right: 12px;
}
.dcc-btn--ghost{
  min-width: 164px;
  color: #f2cb8e;
  border-color: rgba(233, 151, 72, 0.70);
  background: linear-gradient(180deg, rgba(28,13,8,0.90), rgba(14,7,5,0.92));
  box-shadow: inset 0 0 0 1px rgba(255,193,112,0.10), 0 0 0 1px rgba(85,41,12,0.14), 0 8px 18px rgba(0,0,0,0.12);
}
.dcc-btn--ghost::before{
  background: rgba(255, 180, 97, 0.05);
  border-color: rgba(235, 156, 79, 0.55);
}
@media (max-width: 860px){
  .dcc-hero{
    min-height: 0;
    padding: 18px 16px 16px 16px;
  }
  .dcc-hero__copy{min-height: 0;}
  .dcc-hero h2{margin-top: 0;}
}
@media (max-width: 640px){
  .dcc-hero{
    padding: 16px 14px 14px 14px;
  }
  .dcc-lead{
    font-size: 14px;
    line-height: 1.56;
  }
  .dcc-emergency-strip{
    min-height: 0;
    padding: 14px 14px 14px 66px;
    font-size: 14px;
  }
  .dcc-emergency-strip::before{
    left: 14px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }
  .dcc-hero__actions{
    gap: 10px;
  }
  .dcc-btn{
    min-height: 48px;
    font-size: 13px;
    padding: 10px 12px;
  }
}


/* ===== IMAGE BUTTONS FROM UPLOADED CROPS 2026-04-26e ===== */
.dcc-hero{
  padding-bottom: 108px;
}
.dcc-hero__copy{
  position: static;
  min-height: 0;
}
.dcc-hero__actions{
  position:absolute !important;
  z-index:5;
  left:20px;
  right:20px;
  bottom:20px;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  align-items:center;
  justify-content:center;
}
.dcc-hero__actions .dcc-btn,
.dcc-hero__actions .dcc-btn--primary,
.dcc-hero__actions .dcc-btn--ghost,
.dcc-hero__actions .dcc-btn--image{
  all:unset;
  box-sizing:border-box;
  display:block;
  width:100%;
  cursor:pointer;
  border-radius:999px;
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.22));
}
.dcc-hero__actions .dcc-btn::before,
.dcc-hero__actions .dcc-btn::after{
  content:none !important;
  display:none !important;
}
.dcc-hero__actions .dcc-btn img{
  display:block;
  width:100%;
  height:auto;
  border-radius:999px;
  pointer-events:none;
}
.dcc-hero__actions .dcc-btn:hover,
.dcc-hero__actions .dcc-btn:focus-visible{
  transform:translateY(-3px);
  filter:drop-shadow(0 16px 24px rgba(0,0,0,.28)) drop-shadow(0 0 12px rgba(255,183,77,.22));
  outline:none;
}
.dcc-hero__actions .dcc-btn:focus-visible{
  box-shadow:0 0 0 3px rgba(255,196,105,.30);
}
@media (max-width: 1040px){
  .dcc-hero{
    padding-bottom:150px;
  }
  .dcc-hero__actions{
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-width:720px !important;
    left:50%;
    right:auto;
    width:min(720px,calc(100% - 32px)) !important;
    transform:translateX(-50%);
  }
  .dcc-hero__actions .dcc-btn:hover,
  .dcc-hero__actions .dcc-btn:focus-visible{
    transform:translateY(-3px);
  }
}
@media (max-width: 560px){
  .dcc-hero{
    padding-bottom:244px;
  }
  .dcc-hero__actions{
    grid-template-columns:1fr;
    gap:10px;
    width:min(360px,calc(100% - 28px)) !important;
  }
}


/* ===== EMERGENCY STRIP COMPACT FIX 2026-04-26f ===== */
.dcc-emergency-strip{
  position:relative;
  width: 500px;
  max-width: 100%;
  min-height: 82px;
  margin-top: 14px;
  padding: 14px 18px 14px 70px;
  border-radius: 20px;
  border: 1px solid rgba(236, 88, 52, .78);
  background: linear-gradient(180deg, rgba(76, 17, 11, .94) 0%, rgba(47, 11, 8, .96) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 10px 24px rgba(0,0,0,.16);
  font-size: 14px;
  line-height: 1.42;
  font-weight: 600;
  color: #f4ddd3;
}
.dcc-emergency-strip span{
  display:block;
  max-width: 100%;
}
.dcc-emergency-strip::before{
  content: "!";
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  font-size: 22px;
  line-height: 1;
  font-weight: 900;
  color: #ff9a80;
  border: 1px solid rgba(255, 128, 101, .42);
  background: radial-gradient(circle at 30% 30%, rgba(255, 154, 128, .12) 0%, rgba(255, 120, 90, .08) 48%, rgba(31, 9, 8, .82) 100%);
  box-shadow: 0 0 0 1px rgba(255, 123, 88, .06), 0 8px 18px rgba(255, 104, 74, .10);
}
@media (max-width: 860px){
  .dcc-emergency-strip{
    width: 100%;
    min-height: 78px;
  }
}
@media (max-width: 640px){
  .dcc-emergency-strip{
    min-height: 0;
    padding: 12px 12px 12px 58px;
    border-radius: 16px;
    font-size: 13px;
    line-height: 1.38;
  }
  .dcc-emergency-strip::before{
    left: 14px;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    font-size: 18px;
  }
}