/* A Doctor in Your Family | TAP Films */
html:has(.ff-page), body:has(.ff-page) { margin: 0; padding: 0; background: #f8f5ec; }
.ff-page {
  --ink: #183d38; --green: #073f36; --forest: #07382f; --gold: #e0bc6a;
  --cream: #f8f5ec; --subtle: #52645a; --rule: #d7d9ca; --serif: Georgia, "Times New Roman", serif;
  width: 100%; min-height: 100vh; background: var(--cream); color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 16px; line-height: 1.53; -webkit-font-smoothing: antialiased;
}
.ff-page *, .ff-page *::before, .ff-page *::after { box-sizing: border-box; }
.ff-page :is(h1,h2,h3,p,blockquote,figure) { margin: 0; }
.ff-page :is(h1,h2,h3) { color: inherit; font-family: var(--serif); font-weight: 400; text-wrap: balance; }
.ff-page a { color: inherit; text-underline-offset: .2em; }
.ff-page a:focus-visible, .ff-page button:focus-visible, .ff-page video:focus-visible { outline: 3px solid #d89429; outline-offset: 4px; }
.ff-page [hidden] { display: none !important; }
.ff-page .ff-bound { width: min(1240px, calc(100% - clamp(40px, 9vw, 132px))); margin-inline: auto; }
.ff-page .ff-skip { position: absolute; z-index: 20; top: 10px; left: 12px; padding: 8px 18px; background: white; color: #07382f; transform: translateY(-150%); }
.ff-page .ff-skip:focus { transform: none; }
.ff-page .ff-mast { margin: 0; padding: 0; border-bottom: 1px solid var(--rule); background: var(--cream); color: var(--ink); }
.ff-page .ff-mast-in { display: flex; gap: 15px; min-height: 70px; align-items: center; }
.ff-page .ff-home { display: inline-flex; align-items: center; max-width: 88px; min-height: 44px; }
.ff-page .ff-home img { max-width: 100%; width: 84px; height: auto; display: block; }
.ff-page .ff-section-name { display: inline-flex; align-items: center; min-height: 20px; border-left: 1px solid #c5c9ba; padding-left: 16px; font-size: 13px; font-weight: 650; }
.ff-page .ff-mast nav { display: flex; gap: clamp(12px,3vw,32px); align-items: center; margin-left: auto; }
.ff-page .ff-mast nav a, .ff-page .ff-footer a { display: inline-flex; gap: 7px; min-height: 44px; align-items: center; font-size: 14px; font-weight: 570; text-decoration: none; }
.ff-page .ff-mast nav a:hover, .ff-page .ff-footer a:hover, .ff-page .ff-browse:hover, .ff-page .ff-link:hover { text-decoration: underline; }
.ff-page .ff-mast svg, .ff-page .ff-footer svg, .ff-page .ff-browse svg, .ff-page .ff-link svg { width: 17px; height: 17px; flex: none; }
.ff-page .ff-intro { background: var(--forest); color: #fcf6e6; padding: clamp(31px,4.6vw,68px) 0 clamp(28px,4.2vw,56px); }
.ff-page .ff-titlepiece { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(230px,.69fr); gap: clamp(25px,5vw,82px); align-items: end; padding-bottom: clamp(22px,3.1vw,43px); }
.ff-page .ff-eyebrow { display: flex; gap: 10px; align-items: center; color: #415d53; font-size: 12px; font-weight: 750; text-transform: uppercase; letter-spacing: .13em; line-height: 1.4; }
.ff-page .ff-kicker { margin: 0 0 10px; font-size: 11px; color: #e6ce8f; }
.ff-page .ff-kicker span { width: 24px; height: 2px; background: var(--gold); }
.ff-page .ff-titlepiece h1 { max-width: 880px; font-size: clamp(43px,6.05vw,90px); line-height: 1.00; letter-spacing: -.053em; }
.ff-page .ff-titlepiece em { font-weight: 400; color: #f1d995; }
.ff-page .ff-intro-copy { max-width: 37ch; color: #e0e8d9; font-size: clamp(15px,1.2vw,18px); line-height: 1.5; }
.ff-page .ff-feature { display: grid; grid-template-columns: minmax(0,1.75fr) minmax(240px,.82fr); background: #f3eddc; color: var(--ink); border-radius: 7px; overflow: hidden; }
.ff-page .ff-feature-film { display: flex; align-items: center; background: #001d19; }
.ff-page .ff-screen { position: relative; width: 100%; background: #0f2621; aspect-ratio: 16/9; display: block; color: #142e27; }
.ff-page .ff-screen video { display: block; width: 100%; height: 100%; max-width: none; aspect-ratio: 16/9; object-fit: contain; background: #0f2621; }
.ff-page .ff-screen ::cue { color: white; background: rgb(8 22 20 / .84); }
.ff-page .ff-play { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%,-50%); display: grid; place-items: center; appearance: none; width: 58px; height: 58px; padding: 0; border-radius: 50%; border: 1px solid #eee8d2; color: #163e34; background: rgba(250,245,225,.96); box-shadow: 0 2px 15px #00150e59; cursor: pointer; }
.ff-page .ff-play svg { width: 22px; height: 22px; margin-left: 2px; }
.ff-page .ff-screen--lead .ff-play { width: clamp(63px,5.5vw,80px); height: clamp(63px,5.5vw,80px); }
.ff-page .ff-screen--lead .ff-play svg { width: 26px; height: 26px; }
.ff-page .ff-play:hover { background: #ffe6a2; color: #123e31; }
.ff-page .ff-feature-text { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(22px,2.7vw,44px); }
.ff-page .ff-feature-bullet { width: 7px; height: 7px; background: #ad7135; border-radius: 100%; }
.ff-page .ff-feature h2 { font-size: clamp(34px,3.35vw,54px); line-height: 1.05; letter-spacing: -.046em; margin: 8px 0 8px; }
.ff-page .ff-markers { display: flex; gap: 10px; align-items: center; font-size: 12px; font-weight: 650; color: #526357; }
.ff-page .ff-markers span + span { border-left: 1px solid #b4bbaa; padding-left: 10px; font-variant-numeric: tabular-nums; }
.ff-page .ff-feature blockquote { font: italic 400 clamp(19px,1.6vw,26px)/1.26 var(--serif); letter-spacing: -.015em; padding: 0; border: none; margin-top: clamp(14px,1.6vw,25px); color: #284839; }
.ff-page .ff-feature-desc { margin-top: 9px; font-size: clamp(14px,1.08vw,16px); line-height: 1.5; color: #3d5145; }
.ff-page .ff-browse, .ff-page .ff-link { display: inline-flex; gap: 8px; align-items: center; min-height: 42px; font-size: 14px; font-weight: 650; text-decoration: none; }
.ff-page .ff-browse { margin-top: 8px; }
.ff-page .ff-more { padding: clamp(32px,5.2vw,80px) 0 clamp(42px,5.8vw,92px); scroll-margin: 20px; }
.ff-page .ff-original { display: grid; grid-template-columns: minmax(0,.82fr) minmax(0,1.35fr); gap: clamp(28px,6vw,92px); align-items: center; }
.ff-page .ff-original-copy { max-width: 43ch; }
.ff-page .ff-duration { border-left: 1px solid #9bad9b; padding-left: 10px; letter-spacing: .04em; }
.ff-page .ff-original h2, .ff-page .ff-story h2 { font-size: clamp(34px,3.6vw,53px); letter-spacing: -.045em; line-height: 1.04; }
.ff-page .ff-original h2 { margin: 12px 0; }
.ff-page .ff-original .ff-original-description { max-width: 43ch; font-size: clamp(16px,1.25vw,19px); color: var(--subtle); }
.ff-page .ff-original .ff-screen, .ff-page .ff-original video { border-radius: 5px; }
.ff-page .ff-story { background: #e8ebdd; padding: clamp(38px,5.5vw,80px) 0; }
.ff-page .ff-story-in { display: grid; grid-template-columns: .83fr 1fr; gap: clamp(28px,7vw,108px); align-items: center; }
.ff-page .ff-story figure { margin: 0; }
.ff-page .ff-story img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; border-radius: 4px; }
.ff-page .ff-story figcaption { font-size: 12px; color: #50604f; margin-top: 7px; }
.ff-page .ff-story h2 { max-width: 21ch; margin-bottom: 16px; }
.ff-page .ff-story p { max-width: 62ch; margin: 0 0 11px; font-size: 16px; color: #344d3e; }
.ff-page .ff-link { color: #064f3c; border-bottom: 1px solid #6e917e; }
.ff-page .ff-footer { background: var(--cream); color: #3f584b; }
.ff-page .ff-footer-in { display: flex; min-height: 78px; justify-content: space-between; gap: 15px; align-items: center; }
.ff-page .ff-footer-in p { font-size: 13px; }
@media (max-width: 930px) {
  .ff-page .ff-feature { grid-template-columns: minmax(0,1.44fr) minmax(245px,.9fr); }
  .ff-page .ff-titlepiece { grid-template-columns: 1.45fr 1fr; gap: 27px; }
  .ff-page .ff-feature-text { padding: 20px; }
  .ff-page .ff-browse { min-height: 35px; margin-top: 4px; }
}
@media (max-width: 740px) {
  .ff-page .ff-feature { display: flex; flex-direction: column; }
  .ff-page .ff-feature-text { padding: 22px 25px 16px; }
  .ff-page .ff-feature blockquote { margin-top: 12px; }
  .ff-page .ff-titlepiece { display: block; }
  .ff-page .ff-titlepiece h1 { max-width: 570px; }
  .ff-page .ff-intro-copy { max-width: 53ch; margin-top: 15px; }
  .ff-page .ff-story-in { grid-template-columns: 1fr; }
  .ff-page .ff-story figure { max-width: 560px; width: 100%; }
  .ff-page .ff-home { max-width: 67px; }
  .ff-page .ff-mast-in { min-height: 59px; }
  .ff-page .ff-original { grid-template-columns: 1fr; gap: 18px; }
}
@media (max-width: 540px) {
  .ff-page .ff-section-name { display: none; }
  .ff-page .ff-mast nav { gap: 18px; }
  .ff-page .ff-mast nav a { font-size: 12px; }
  .ff-page .ff-titlepiece h1 { font-size: clamp(43px,12vw,62px); }
  .ff-page .ff-footer-in { min-height: 72px; }
  .ff-page .ff-footer a { font-size: 12px; }
}
@media (prefers-reduced-motion: no-preference) { .ff-page .ff-play { transition: background-color .15s ease; } }