/* ===== Testimonials Rene / Content 2 (live nafas.com/id-en/testimonials-rene-suhardono, frames "Content 2":
   desktop framer-o1z555, tablet + phone framer-1simany) =====
   One heading + one body text. Desktop: a row (heading 333px | body 800px, space-between). Tablet / phone: one column.
   Copy generated from live (tools/generators/rs-content-2/gen.py). Both text boxes fade in (opacity only) at 50% visible
   and fade out again below 50% at either edge (js/40-content-2.js); curve sampled on live (0.42s spring).
   No links, hover, press or click states on live. */

/* Live declares this face with weight 600 (base.css has no weight, so Chrome would fake-bold it at 600 here).
   Same file as base.css. The quote asks for font-style italic on a face declared normal: Chrome slants it again
   (synthetic oblique), exactly as on live. */
/* SF Pro Display Semibold Italic (weight 600, as live) is declared in css/base.css */
/* Phone quote: Inter Medium Italic, live's own latin file (framerusercontent Bo5CNzBv77CafbxOtKIkpw9egw.woff2, identical bytes) */
@font-face { font-family: Inter; src: url("../../../assets/fonts/inter-500-italic-latin.woff2") format("woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

.nf-rs-content-2 {
  --nf-rs-c2-ease: linear(0, 0.02 1.4%, 0.074 5.2%, 0.154 9.2%, 0.24 13.3%, 0.334 17.3%, 0.426 21.1%, 0.508 24.9%, 0.588 28.9%, 0.658 32.9%, 0.72 37%, 0.773 41%, 0.816 44.8%, 0.854 48.8%, 0.884 52.8%, 0.91 56.6%, 0.93 60.4%, 0.947 64.5%, 0.961 68.5%, 0.972 72.5%, 0.979 76.3%, 0.986 80.3%, 0.99 84.4%, 0.994 88.2%, 0.996 92.2%, 0.998 96.2%, 1);
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 100px;
  flex: 0 0 auto; width: 100%; height: min-content; padding: 80px 60px; position: relative; overflow: hidden;
}

/* ---------- Framer rich text ---------- */
.nf-rs-content-2__t {
  margin: 0; padding: 0; color: rgb(0, 0, 0); text-transform: none; text-decoration: none; font-style: normal;
  white-space: pre-wrap; word-break: break-word; overflow-wrap: break-word;
}
.nf-rs-content-2__t--head {
  font-family: "SF Pro Display Medium", "SF Pro Display Medium Placeholder", sans-serif; font-size: 42px; font-weight: 500;
  line-height: 125%; letter-spacing: normal; text-align: start;
  font-feature-settings: "blwf" on, "cv09" on, "cv03" on, "cv04" on, "cv11" on;
}
.nf-rs-content-2__t--body {
  --nf-rs-c2-lh: 1.6em;
  font-family: "SF Pro Display Regular", "SF Pro Display Regular Placeholder", sans-serif; font-size: 20px; font-weight: 400;
  line-height: var(--nf-rs-c2-lh); letter-spacing: normal; text-align: left;
}
/* quote: Framer re-resolves the line height on the 24px span (1.6em of 24px = 38.4px) */
.nf-rs-content-2__q {
  font-family: "SF Pro Display Semibold Italic", "SF Pro Display Semibold Italic Placeholder", sans-serif;
  font-size: 24px; font-weight: 600; line-height: var(--nf-rs-c2-lh);
}
.nf-rs-content-2__q em { font-style: italic; }

/* text boxes (Framer RichTextContainer) */
.nf-rs-content-2__box {
  display: flex; flex-direction: column; justify-content: flex-start; flex: 0 0 auto;
  max-width: 100%; height: auto; position: relative; will-change: transform;
}

/* scroll appear (JS adds .is-js; without JS the text stays visible) */
.nf-rs-content-2.is-js [data-rs-reveal] { opacity: 0; transition: opacity 0.422s var(--nf-rs-c2-ease); }
.nf-rs-content-2.is-js [data-rs-reveal].is-in { opacity: 1; }

/* ---------- Desktop (>= 1440, base) ---------- */
.nf-rs-content-2__row {
  display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start;
  flex: 0 0 auto; width: 100%; height: min-content; padding: 0; position: relative; overflow: clip;
}
.nf-rs-content-2__box--head { width: 333px; }
.nf-rs-content-2__box--body { width: 800px; }

/* ---------- Tablet (810 to 1439.98) ---------- */
@media (max-width: 1439.98px) {
  .nf-rs-content-2 { gap: 48px; padding: 60px 40px; }
  .nf-rs-content-2__row { flex-direction: column; justify-content: flex-start; gap: 32px; }
  .nf-rs-content-2__box--head, .nf-rs-content-2__box--body { width: 100%; }
}

/* ---------- Phone (<= 809.98) ---------- */
@media (max-width: 809.98px) {
  .nf-rs-content-2 { gap: 32px; padding: 32px 16px; }
  .nf-rs-content-2__row { gap: 16px; }
  .nf-rs-content-2__t--head { font-size: 29px; }
  .nf-rs-content-2__t--body { --nf-rs-c2-lh: 140%; letter-spacing: 0.03em; }
  /* the phone quote is Inter Medium Italic at the body size (live Framer variant) */
  .nf-rs-content-2__q { font-family: Inter, "Inter Placeholder", sans-serif; font-size: inherit; font-weight: 500; font-style: italic; }
}
