:root {
      /* Цветовая палитра проекта */
      --green: #004d30;
      --green-mid: #1a6645;
      --green-light: #e8f0eb;
      --brown: #4a2c10;
      --ivory: #faf7f2;
      --text-main: #1a1a18;
      --text-muted: #6b6b63;
      --text-subtle: #9a9a90;
      --border: rgba(0, 0, 0, 0.09);
      --white: #ffffff;
      --radius-sm: 8px;
      --radius-md: 12px;
      --radius-lg: 16px;

      /* Акцентные переменные карточек */
      --rtd-accent: var(--green);
      --rtd-accent-soft: rgba(0, 77, 48, 0.10);
      --rtd-card-bg: #f4ece2;
      --rtd-shadow: 0 4px 20px rgba(26, 26, 24, 0.07);
      --rtd-max-width: 1280px;
    }

    *, *::before, *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    /*body {
      background: var(--ivory);
      color: var(--text-main);
      font-family: 'Inter', "Segoe UI", sans-serif;
      font-size: 16px;
      line-height: 1.65;
      -webkit-font-smoothing: antialiased;
    }*/

    .rtd-wrapper {
      width: min(var(--rtd-max-width), calc(100% - 40px));
      margin: 0 auto;
      padding: 32px 0 56px;
    }

    /* ─── PAGE HEADER ─── */
    .rtd-page-head {
      margin-bottom: 24px;
      padding: 24px 28px;
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      box-shadow: var(--rtd-shadow);
    }

    .rtd-page-head h1 {
      margin: 0 0 10px;
      font-family: 'Charis SIL', serif;
      font-size: clamp(26px, 4vw, 40px);
      font-weight: 700;
      line-height: 1.12;
      letter-spacing: -0.02em;
      color: var(--text-main);
    }

    .rtd-page-head > p {
      max-width: 860px;
      margin: 0;
      color: var(--text-muted);
      font-size: 16px;
    }

    /* ─── NAV PILLS ─── */
    .rtd-nav {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin: 20px 0 0;
    }

    .rtd-nav a {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      padding: 5px 12px;
      border: 1px solid var(--border);
      border-radius: 100px;
      background: #e6e1da;
      color: var(--text-main);
      font-size: 13px;
      font-weight: 500;
      line-height: 1.2;
      text-decoration: none;
      transition: background 0.2s ease, border-color 0.2s ease;
    }

    .rtd-nav a:hover {
      background: var(--white);
      border-color: rgba(0, 77, 48, 0.3);
    }

    /* ─── SECTION ─── */
    .rtd-section {
      margin: 0 0 20px;
      scroll-margin-top: 22px;
    }

    .rtd-section-label {
      display: none;
    }

    /* ─── CARD ─── */
    .rtd-card {
      position: relative;
      overflow: hidden;
      padding: clamp(20px, 3vw, 30px);
      background:
        radial-gradient(ellipse at top right, var(--rtd-accent-soft) 0%, transparent 55%),
        var(--rtd-card-bg);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      box-shadow: var(--rtd-shadow);
    }

    .rtd-card::before {
      content: attr(data-number);
      position: absolute;
      top: 14px;
      right: 20px;
      color: rgba(26, 26, 24, 0.045);
      font-family: 'Inter', sans-serif;
      font-size: clamp(52px, 8vw, 96px);
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.06em;
      pointer-events: none;
    }

    .rtd-card > * {
      position: relative;
      z-index: 1;
    }

    /* Категорийные акценты */
    .rtd-card--city    { --rtd-accent: #004d30; --rtd-accent-soft: rgba(0, 77, 48, 0.18); }
    .rtd-card--nature  { --rtd-accent: #2e8b50; --rtd-accent-soft: rgba(46, 139, 80, 0.20); }
    .rtd-card--mountain { --rtd-accent: #8a5c0a; --rtd-accent-soft: rgba(138, 92, 10, 0.22); }
    .rtd-card--favela  { --rtd-accent: #b83d5a; --rtd-accent-soft: rgba(184, 61, 90, 0.18); }
    .rtd-card--water   { --rtd-accent: #1b6fa8; --rtd-accent-soft: rgba(27, 111, 168, 0.19); }
    .rtd-card--night   { --rtd-accent: #5e3db3; --rtd-accent-soft: rgba(94, 61, 179, 0.19); }
    .rtd-card--gastro  { --rtd-accent: #7a4318; --rtd-accent-soft: rgba(122, 67, 24, 0.20); }

    /* ─── EYEBROW ─── */
    .rtd-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      margin: 0 0 10px;
      color: var(--rtd-accent);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.1em;
      line-height: 1;
      text-transform: uppercase;
    }

    .rtd-eyebrow::before {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--rtd-accent);
      flex-shrink: 0;
    }

    /* ─── HEADINGS ─── */
    .rtd-card h2 {
      max-width: 920px;
      margin: 0 0 12px;
      font-family: 'Charis SIL', serif;
      font-size: clamp(20px, 2.8vw, 28px);
      font-weight: 700;
      line-height: 1.2;
      letter-spacing: -0.02em;
      color: var(--text-main);
    }

    /* ─── LEAD TEXT ─── */
    .rtd-lead {
      max-width: 980px;
      margin: 0;
      color: #4a4438;
      font-size: clamp(15px, 1.8vw, 17px);
      line-height: 1.7;
    }

    /* ─── TAGS ─── */
    .rtd-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin: 18px 0 0;
      padding: 0;
      list-style: none;
    }

    .rtd-tags li {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      padding: 5px 12px;
      border: 1px solid rgba(0, 0, 0, 0.07);
      border-radius: 100px;
      background: rgba(255, 255, 255, 0.7);
      color: #4a4438;
      font-size: 13px;
      font-weight: 500;
      line-height: 1.25;
    }

    /* ─── CONTENT GRID ─── */
    .rtd-content-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      margin-top: 20px;
    }

    .rtd-content-grid--four {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    /* ─── MINI CARD ─── */
    .rtd-mini-card {
      padding: 16px 18px;
      background: rgba(255, 255, 255, 0.74);
      border: 1px solid rgba(74, 47, 27, 0.1);
      border-radius: var(--radius-md);
    }

    .rtd-mini-card-icon {
      display: none;
    }

    .rtd-mini-card strong {
      display: block;
      margin-bottom: 5px;
      color: var(--text-main);
      font-size: 15px;
      font-weight: 600;
      line-height: 1.3;
    }

    .rtd-mini-card p {
      margin: 0;
      color: var(--text-muted);
      font-size: 14px;
      line-height: 1.55;
    }

    /* ─── ROUTE ─── */
    .rtd-route {
      position: relative;
      display: grid;
      gap: 12px;
      margin-top: 20px;
      padding-left: 14px;
    }

    .rtd-route::before {
      content: "";
      position: absolute;
      top: 8px;
      bottom: 8px;
      left: 27px;
      width: 2px;
      background: linear-gradient(to bottom, var(--rtd-accent), rgba(0, 0, 0, 0.07));
    }

    .rtd-route-item {
      position: relative;
      display: grid;
      grid-template-columns: 42px 1fr;
      gap: 12px;
      align-items: start;
    }

    .rtd-route-dot {
      position: relative;
      z-index: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      margin-top: 4px;
      border: 2px solid var(--rtd-card-bg);
      border-radius: 50%;
      background: var(--rtd-accent);
      color: #fff;
      font-size: 12px;
      font-weight: 700;
      line-height: 1;
      box-shadow: 0 0 0 3px var(--rtd-accent-soft);
    }

    .rtd-route-body {
      padding: 14px 16px;
      background: rgba(255, 255, 255, 0.74);
      border: 1px solid rgba(74, 47, 27, 0.1);
      border-radius: var(--radius-md);
    }

    .rtd-route-body strong {
      display: block;
      margin-bottom: 4px;
      color: var(--text-main);
      font-size: 15px;
      font-weight: 600;
      line-height: 1.35;
    }

    .rtd-route-body p {
      margin: 0;
      color: var(--text-muted);
      font-size: 14px;
      line-height: 1.58;
    }

    /* ─── SPLIT ─── */
    .rtd-split {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 12px;
      margin-top: 20px;
    }

    /* ─── NOTE / GOOD-FOR ─── */
    .rtd-note,
    .rtd-good-for {
      padding: 16px 18px;
      border-radius: var(--radius-md);
      background: rgba(255, 255, 255, 0.74);
      border: 1px solid rgba(74, 47, 27, 0.1);
    }

    .rtd-note {
      border-left: 3px solid var(--brown);
      border-radius: 0 var(--radius-md) var(--radius-md) 0;
    }

    .rtd-note strong,
    .rtd-good-for strong {
      display: block;
      margin-bottom: 5px;
      color: var(--text-main);
      font-size: 15px;
      font-weight: 600;
      line-height: 1.35;
    }

    .rtd-note p,
    .rtd-good-for p {
      margin: 0;
      color: var(--text-muted);
      font-size: 14px;
      line-height: 1.6;
    }

    .rtd-good-for ul {
      display: grid;
      gap: 7px;
      margin: 7px 0 0;
      padding: 0;
      list-style: none;
      color: var(--text-muted);
      font-size: 14px;
      line-height: 1.55;
    }

    .rtd-good-for li {
      position: relative;
      padding-left: 20px;
    }

    .rtd-good-for li::before {
      content: "✓";
      position: absolute;
      left: 0;
      top: 0;
      color: var(--green-mid);
      font-weight: 700;
    }

    /* ─── DETAILS / SPOILER ─── */
    /* Drone video card */
    .rtd-drone-section {
      margin: 0 0 24px;
    }

    .rtd-drone-card {
      display: grid;
      grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1fr);
      grid-template-areas:
        "media heading"
        "media copy";
      align-items: start;
      gap: clamp(18px, 3vw, 32px);
      padding: clamp(18px, 3vw, 26px);
      overflow: visible;
      border: 1px solid rgba(74, 47, 27, 0.1);
      border-radius: var(--radius-lg);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: var(--rtd-shadow);
    }

    .rtd-drone-heading {
      grid-area: heading;
      min-width: 0;
      align-self: start;
    }

    .rtd-drone-media {
      grid-area: media;
      position: relative;
      min-height: 360px;
      overflow: visible;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      border-radius: var(--radius-md);
      background:
        linear-gradient(135deg, rgba(184, 61, 90, 0.16), rgba(0, 77, 48, 0.12)),
        rgba(26, 26, 24, 0.05);
    }

    .rtd-drone-video {
      display: block;
      width: auto;
      height: min(520px, 48vw);
      max-width: 100%;
      min-height: 320px;
      object-fit: contain;
      border-radius: 14px;
      background: #1a1a18;
      box-shadow: 0 18px 32px rgba(26, 26, 24, 0.18);
    }

    .rtd-drone-copy {
      grid-area: copy;
      min-width: 0;
      align-self: start;
    }

    .rtd-drone-eyebrow {
      margin: 0 0 10px;
      color: #9a9a90;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.08em;
      line-height: 1;
      text-transform: uppercase;
      gap: 6px;
    }

    .rtd-drone-heading h3,
    .rtd-drone-copy h3 {
      margin: 0 0 10px;
      color: var(--text-main);
      font-family: 'Charis SIL', serif;
      font-size: clamp(20px, 2.4vw, 26px);
      font-weight: 700;
      line-height: 1.2;
    }

    .rtd-drone-copy > p:not(.rtd-drone-eyebrow) {
      margin: 0;
      color: var(--text-muted);
      font-size: 15px;
      line-height: 1.65;
    }

    .rtd-drone-copy > p:not(.rtd-drone-eyebrow) + p {
      margin-top: 10px;
    }

    .rtd-drone-alert {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      margin-top: 32px;
      padding: 12px 14px;
      border: 1px solid rgba(204, 146, 29, 0.24);
      border-radius: var(--radius-md);
      background: rgba(255, 214, 102, 0.16);
    }

    .rtd-drone-alert-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 24px;
      height: 24px;
      flex: 0 0 24px;
      border-radius: 50%;
      background: rgba(255, 193, 7, 0.22);
      color: #9a6500;
    }

    .rtd-drone-alert-icon svg {
      width: 15px;
      height: 15px;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .rtd-drone-alert-content {
      display: grid;
      gap: 8px;
    }

    .rtd-drone-alert-content h4 {
      margin: 0;
      color: #5f4300;
      font-size: 15px;
      font-weight: 700;
      line-height: 1.35;
    }

    .rtd-drone-alert-content p {
      margin: 0;
      color: #4a4438;
      font-size: 14px;
      line-height: 1.55;
    }

    .rtd-drone-alert-content strong {
      color: #5f4300;
      font-weight: 700;
    }

    .rtd-drone-soft-card {
      position: relative;
      min-height: 118px;
      margin: 16px 0 0;
      overflow: hidden;
      padding: 18px 160px 18px 18px;
      border: 1px solid rgba(36, 107, 130, 0.18);
      border-radius: var(--radius-md);
      background:
    linear-gradient(
        90deg,
        rgba(221, 142, 157, 0.96) 5%,
        rgba(221, 142, 157, 0.78) 65%,
        rgba(221, 142, 157, 0.12) 100%
    ),
    url("../img/dji-backg.png") right center / auto 100% no-repeat,
    #dd8e9d;
    }

    .rtd-drone-soft-card h3 {
      position: relative;
      z-index: 1;
      max-width: 360px;
      margin: 0;
      color: var(--text-main);
      font-size: 20px;
      font-weight: 700;
      line-height: 1.35;
    color: #ffffff;
   text-transform: uppercase;
    }

    .rtd-drone-faq {
      margin-top: 12px;
      padding: clamp(18px, 3vw, 24px);
      border: 1px solid rgba(74, 47, 27, 0.1);
      border-radius: var(--radius-lg);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: var(--rtd-shadow);
    }

    .rtd-drone-faq > h3 {
      margin: 0 0 12px;
      color: var(--text-main);
      font-family: 'Charis SIL', serif;
      font-size: clamp(20px, 2.2vw, 25px);
      font-weight: 700;
      line-height: 1.2;
    }

    .rtd-drone-faq-item {
      border-top: 1px solid rgba(74, 47, 27, 0.1);
    }

    .rtd-drone-faq-item:last-child {
      border-bottom: 1px solid rgba(74, 47, 27, 0.1);
    }

    .rtd-drone-faq-item summary {
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 14px 0;
      color: var(--text-main);
      font-size: 15px;
      font-weight: 700;
      line-height: 1.35;
      list-style: none;
      user-select: none;
    }

    .rtd-drone-faq-item summary::-webkit-details-marker {
      display: none;
    }

    .rtd-drone-faq-item summary::after {
      content: "+";
      flex: 0 0 auto;
      color: var(--text-subtle);
      font-size: 18px;
      font-weight: 400;
      line-height: 1;
    }

    .rtd-drone-faq-item[open] summary::after {
      content: "-";
    }

    .rtd-drone-faq-item div {
      padding: 0 0 14px;
    }

    .rtd-drone-faq-item p {
      margin: 0;
      color: var(--text-muted);
      font-size: 14px;
      line-height: 1.65;
    }

    .rtd-details {
      margin-top: 16px;
      border-top: 1px solid rgba(74, 47, 27, 0.1);
      padding-top: 12px;
    }

    .rtd-details summary {
      cursor: pointer;
      color: var(--brown);
      font-size: 14px;
      font-weight: 700;
      list-style: none;
      user-select: none;
    }

    .rtd-details summary::-webkit-details-marker {
      display: none;
    }

    .rtd-details summary::after {
      content: "+";
      float: right;
      color: var(--text-subtle);
      font-size: 18px;
      font-weight: 400;
      line-height: 1;
    }

    .rtd-details[open] summary::after {
      content: "−";
    }

    .rtd-details-content {
      padding: 10px 0 0;
      color: var(--text-muted);
      font-size: 14px;
      line-height: 1.65;
    }

    .rtd-details-content p {
      margin: 0 0 8px;
    }

    .rtd-details-content p:last-child {
      margin-bottom: 0;
    }

    /* ─── RESPONSIVE ─── */
    @media (max-width: 1024px) {
      .rtd-content-grid,
      .rtd-content-grid--four,
      .rtd-split {
        grid-template-columns: 1fr 1fr;
      }

      .rtd-drone-card {
        grid-template-columns: 1fr;
        grid-template-areas:
          "heading"
          "media"
          "copy";
        align-items: stretch;
      }

      .rtd-drone-media {
        min-height: 420px;
      }

      .rtd-drone-video {
        height: min(560px, 74vw);
      }
    }

    @media (max-width: 720px) {
      body { font-size: 15px; }

      .rtd-wrapper {
        width: min(100% - 24px, var(--rtd-max-width));
        padding-top: 16px;
      }

      .rtd-page-head { padding: 20px 16px; }

      .rtd-card {
        padding: 20px 16px;
        border-left-width: 3px;
      }

      .rtd-card::before {
        top: 10px;
        right: 12px;
      }

      .rtd-content-grid,
      .rtd-content-grid--four,
      .rtd-split {
        grid-template-columns: 1fr;
      }

      .rtd-drone-card {
        gap: 16px;
        padding: 14px;
      }

      .rtd-drone-media {
        min-height: 0;
        padding: 14px;
      }

      .rtd-drone-video {
        width: auto;
        height: min(520px, 118vw);
        min-height: 300px;
      }

      .rtd-drone-alert {
        padding: 11px 12px;
      }

      .rtd-drone-soft-card {
        min-height: 104px;
        padding: 16px 112px 16px 14px;
      }

      .rtd-drone-soft-card h3 {
        font-size: 18px;
      }

      .rtd-drone-faq {
        padding: 16px 14px;
      }

      .rtd-route { padding-left: 0; }
      .rtd-route::before { left: 14px; }

      .rtd-route-item {
        grid-template-columns: 32px 1fr;
        gap: 10px;
      }
    }

    .rtd-section--sticker-cards .rtd-tags {
      margin-bottom: 28px;
    }

    .rtd-section--sticker-cards .rtd-content-grid {
      gap: 18px;
      margin-top: 58px;
      margin-bottom: 38px;
      overflow: visible;
    }

    .rtd-section--sticker-cards .rtd-mini-card--with-visual {
      position: relative;
      min-height: 112px;
      overflow: visible;
      padding-right: 142px;
    }

    .rtd-section--sticker-cards .rtd-mini-card--with-visual strong,
    .rtd-section--sticker-cards .rtd-mini-card--with-visual p {
      position: relative;
      z-index: 2;
    }

    .rtd-section--sticker-cards .rtd-mini-card-visual {
      position: absolute;
      z-index: 4;
      pointer-events: none;
      user-select: none;
    }

    .rtd-section--sticker-cards .rtd-mini-card-visual--christ {
      top: -48px;
      right: 30px;
      width: 132px;
      max-width: 42%;
      height: auto;
      
      transform-origin: center center;
    }

    .rtd-section--sticker-cards .rtd-mini-card-visual--placeholder {
      top: -42px;
      right: 28px;
      width: 112px;
      height: 124px;
      max-width: 38%;
      border: 1px dashed rgba(0, 77, 48, 0.24);
      border-radius: 12px;
      background: rgba(0, 77, 48, 0.035);
      
    }

    .rtd-section--sticker-cards .rtd-note {
      margin-top: 46px !important;
    }

    @media (max-width: 1024px) {
      .rtd-section--sticker-cards .rtd-content-grid {
        gap: 16px;
      }

      .rtd-section--sticker-cards .rtd-mini-card--with-visual {
        min-height: 128px;
        padding-right: 132px;
      }
    }

    @media (max-width: 720px) {
      .rtd-section--sticker-cards .rtd-content-grid {
        gap: 14px;
        margin-top: 48px;
        margin-bottom: 30px;
      }

      .rtd-section--sticker-cards .rtd-mini-card--with-visual {
        min-height: 126px;
        padding-right: 118px;
      }

      .rtd-section--sticker-cards .rtd-mini-card-visual--christ {
        top: -34px;
        right: 16px;
        width: 92px;
        max-width: 30%;
      }

      .rtd-section--sticker-cards .rtd-mini-card-visual--placeholder {
        top: -30px;
        right: 18px;
        width: 84px;
        height: 98px;
        max-width: 28%;
      }
    }