/* DEALS FLOW — landscape studio visual system */
.df-container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.df-home > section:not(.df-hero) { padding-block: clamp(56px, 6.5vw, 96px); }
.df-home > section { scroll-margin-top: 86px; }
.df-home h2 { letter-spacing: -.035em; line-height: 1.22; }
.df-home h3 { letter-spacing: -.02em; }
.df-home p { text-wrap: pretty; }
.df-home .df-hero::after, .df-stats::after, .df-guide::after, .df-cta::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url('/assets/flow-topography.svg') center / cover no-repeat; opacity: .5;
}
.df-hero { background-color: #082b1d; }
.df-hero h1 { letter-spacing: -.04em; line-height: 1.28; }
.df-hero-visual::after {
  content: "OUTDOOR / 01"; position: absolute; bottom: -21px; left: 18px;
  color: #b6e8c6; font: 10px/1.2 Tahoma,sans-serif; letter-spacing: .24em;
}
.df-hero-frame { box-shadow: 0 36px 90px #001d164d; }
.df-float-chip { box-shadow: 0 14px 34px #001a1240; }
.df-benefits { background: linear-gradient(135deg,#f8fbf6 0%,#eef5ed 100%); }
.df-benefits > div:last-child > div:last-child { margin-top: 44px; }
.df-benefits .group { position: relative; overflow: hidden; border-color: #d9e6d8; box-shadow: 0 8px 32px #103f1f05; }
.df-benefits .group::after { content: ""; position: absolute; width: 70px; height: 70px; border: 1px solid #d5e8d3; border-radius: 50%; left: -35px; top: -35px; }
.df-benefits .group:hover { border-color: #6bb286; box-shadow: 0 16px 40px #1348290d; }
.df-stats { background: linear-gradient(145deg,#06271c,#0e3f2c); }
.df-stats [dir="ltr"] { font-size: clamp(1.65rem,2.8vw,2.45rem); letter-spacing: -.045em; line-height: 1.3; }
.df-calculator { background-image: radial-gradient(ellipse at 10% 35%,#2d805d35,transparent 55%),linear-gradient(160deg,#062b20,#0d3e2d); }
.df-calculator-card { box-shadow: 0 28px 80px #001e1447; }
.df-calc-results { position: relative; min-width: 0; overflow: hidden; }
.df-calc-results::after { content: ""; position: absolute; width: 180px; height: 180px; bottom: -100px; left: -70px; border: 1px solid #8be5af33; border-radius: 50%; box-shadow: 0 0 0 30px #8be5af08,0 0 0 60px #8be5af05; pointer-events: none; }
.df-calculator [role="slider"] { width: 24px; height: 24px; box-shadow: 0 0 0 5px #8be5af12; }
.df-calculator [role="slider"]:focus-visible { outline-offset: 4px; }
.df-audiences { background: #f8faf5; }
.df-audiences .group { border: 1px solid #dae5d9; box-shadow: 0 8px 30px #153b200c; }
.df-audiences .group:hover img { filter: saturate(1.06); }
.df-deliverables { background-image: linear-gradient(#ecf2e9d9,#ecf2e9d9),url('/assets/flow-topography.svg'); }
.df-deliverables .group { background: #fffef9; border-color: #d4e4d1; }
.df-process { background: #f9fbf5; }
.df-process h3 { color: #16472e; }
.df-guide { background: linear-gradient(150deg,#0a2b1e,#104c34); }
.df-guide-description-image { border-color: #8be5af40; }
.df-guide .guide-description-image { margin-top: 8px; }
.df-insights { background: #f4f7ef; }
.df-insights article, .df-insights .group { box-shadow: 0 12px 40px #173f2610; }
.df-faq { background: #f9fbf5; }
.df-faq button { min-height: 58px; }
.df-cta { background-color: #082b1d; }
.df-icon { display: inline-block; flex: 0 0 auto; width: 22px; height: 22px; }
.df-eyebrow { display: inline-flex; align-items: center; gap: 9px; color: #217749; font-size: 12px; font-weight: 700; letter-spacing: .06em; }
.df-eyebrow::before { content: ""; width: 26px; height: 1px; background: #65ae7f; }
.df-eyebrow .df-icon { width: 17px; height: 17px; }
.df-section-intro { max-width: 720px; margin: 0 auto 42px; text-align: center; }
.df-section-intro h2 { margin: 16px 0; font-size: clamp(29px,3.3vw,45px); font-weight: 700; color: #103d27; }
.df-section-intro p { margin: 0 auto; max-width: 640px; font-size: 17px; line-height: 1.9; color: #506757; }
.df-lead-section { position: relative; overflow: hidden; border-top: 1px solid #e0e9dd; background: radial-gradient(ellipse at 10% 25%,#daebdb80,transparent 45%),#fcfdf8; }
.df-lead-section::before { content: ""; position: absolute; top: 0; right: 50%; height: 36px; width: 1px; background: linear-gradient(#b6d2ba,transparent); }
.df-lead-layout { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px,5vw,76px); align-items: center; }
.df-lead-layout > * { min-width: 0; }
.df-lead-card { position: relative; border: 1px solid #cddfcc; border-radius: 26px; background: #fff; box-shadow: 0 26px 70px #143c2012,0 4px 12px #123a2007; overflow: hidden; }
.df-lead-card::after { content: ""; pointer-events: none; position: absolute; top: 0; inset-inline: 28px; height: 3px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg,transparent,#2d8b56,#a7e5b8,transparent); }
.df-lead-toolbar { min-height: 55px; padding: 14px 24px; border-bottom: 1px solid #e8eee5; display: flex; gap: 12px; justify-content: space-between; align-items: center; background: #f7faf3; }
.df-demo-badge { display: inline-flex; align-items: center; gap: 8px; color: #3b6450; font-size: 11px; font-weight: 700; }
.df-demo-dot { width: 6px; height: 6px; background: #519264; border-radius: 50%; }
.df-window-dots { display: flex; gap: 5px; }
.df-window-dots i { width: 5px; height: 5px; border-radius: 50%; background: #ccdaca; }
.df-lead-content { padding: 25px; }
.df-lead-person { display: flex; gap: 12px; align-items: center; margin-bottom: 23px; flex-wrap: wrap; }
.df-avatar { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 17px; background: linear-gradient(135deg,#e7f3e5,#c9e5cf); color: #25663c; font-size: 21px; font-weight: 700; box-shadow: inset 0 0 0 1px #c9ddc9; }
.df-small-label { display: block; font-size: 11px; font-weight: 400; color: #6a7b6d; line-height: 1.6; }
.df-lead-person h3 { margin: 2px 0 0; font-size: 25px; color: #173d29; font-weight: 700; line-height: 1.3; }
.df-person-status { margin-inline-start: auto; align-self: center; padding: 6px 9px; border: 1px solid #d2e7d4; border-radius: 30px; background: #f0f8ec; color: #2b7144; font-size: 10px; white-space: nowrap; display: flex; align-items: center; gap: 4px; }
.df-person-status .df-icon { width: 12px; height: 12px; }
.df-lead-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 21px 15px; margin: 0 0 23px; }
.df-lead-field { min-width: 0; }
.df-lead-field dt { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #71816f; margin-bottom: 6px; }
.df-lead-field .df-icon { width: 15px; height: 15px; color: #62866a; }
.df-lead-field dd { margin: 0; font-weight: 700; font-size: 14px; line-height: 1.7; color: #274c34; overflow-wrap: anywhere; }
.df-lead-field bdi { display: inline-block; white-space: nowrap; letter-spacing: .025em; }
.df-lead-budget { display: flex; align-items: center; justify-content: space-between; border: 1px solid #d7e8d3; border-radius: 17px; padding: 17px 20px; background: linear-gradient(110deg,#eaf5e4,#f5faef); margin-bottom: 22px; }
.df-lead-budget strong { display: block; font-size: clamp(27px,3vw,35px); line-height: 1.4; color: #1b5a32; letter-spacing: -.04em; }
.df-budget-icon { display: flex; align-items: center; justify-content: center; width: 45px; height: 45px; border: 1px solid #c3dcbd; color: #599766; border-radius: 50%; }
.df-project-brief h4 { font-size: 12px; font-weight: 700; color: #264c32; margin: 0 0 7px; }
.df-project-brief p { font-size: 13px; line-height: 1.9; color: #607161; margin: 0; }
.df-project-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.df-project-chips span { padding: 5px 9px; border: 1px solid #e1e8db; border-radius: 6px; color: #537247; background: #fafcf7; font-size: 10px; line-height: 1.5; }
.df-lead-details { border-top: 1px solid #e4ecdf; border-bottom: 1px solid #e4ecdf; margin-top: 21px; }
.df-lead-details summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 49px; padding-block: 8px; color: #376844; font-size: 11px; font-weight: 700; cursor: pointer; list-style: none; }
.df-lead-details summary::-webkit-details-marker { display: none; }
.df-details-plus { font-size: 20px; font-weight: 400; transition: transform .2s; }
.df-lead-details[open] .df-details-plus { transform: rotate(45deg); }
.df-lead-details ul { margin: 0 0 14px; padding: 0; list-style: none; display: grid; gap: 9px; }
.df-lead-details li { display: flex; align-items: flex-start; gap: 8px; color: #56765a; font-size: 11px; line-height: 1.8; }
.df-lead-details .df-icon { width: 14px; height: 14px; margin-top: 2px; }
.df-demo-note { margin: 14px 0 0; color: #75816d; font-size: 10px; line-height: 1.8; }
.df-blueprint { position: relative; margin: 0; overflow: hidden; border: 1px solid #d2e2cd; border-radius: 22px; box-shadow: 0 14px 35px #1c4e2710; background: #eff5ef; }
.df-blueprint-top { display: flex; justify-content: space-between; padding: 17px 20px 0; direction: ltr; font-size: 8px; letter-spacing: .15em; color: #648068; }
.df-blueprint > img { display: block; width: 100%; height: auto; }
.df-blueprint figcaption { display: flex; gap: 10px 15px; align-items: center; padding: 0 20px 17px; flex-wrap: wrap; }
.df-blueprint figcaption > span { display: inline-flex; gap: 5px; align-items: center; font-size: 10px; color: #4f6f51; }
.df-plan-dot { width: 6px; height: 6px; border-radius: 50%; background: #6aa997; }
.df-plan-dot--b { background: #b6a17d; }.df-plan-dot--c { background: #6a9f70; }
.df-blueprint figcaption small { margin-inline-start: auto; color: #81987d; font-size: 8px; }
.df-context-copy { padding: 25px 3px 0; }
.df-context-copy h3 { margin: 12px 0; max-width: 410px; color: #1b4a2d; font-size: clamp(22px,2.3vw,30px); line-height: 1.4; font-weight: 700; }
.df-context-copy > p { font-size: 14px; line-height: 1.9; color: #6b7c65; margin: 0 0 21px; }
.df-quality-list { display: flex; flex-wrap: wrap; gap: 13px 18px; margin: 0; padding: 0; list-style: none; }
.df-quality-list li { display: flex; align-items: center; gap: 5px; font-size: 10px; color: #3f6845; }
.df-quality-list .df-icon { width: 17px; height: 17px; color: #57916a; }
.df-text-link { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; margin-top: 17px; color: #246a3c; font-size: 12px; font-weight: 700; text-decoration: none; }
.df-text-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.df-text-link .df-icon { width: 17px; height: 17px; }
.df-guide-preview { position: relative; display: grid; place-items: center; padding: 24px 10px 22px; margin: 0 0 19px; min-width: 0; }
.df-book-orbit { position: absolute; width: 230px; height: 230px; border: 1px solid #8be5af24; border-radius: 50%; top: 58px; left: 50%; transform: translateX(-50%); box-shadow: 0 0 0 35px #8be5af06,0 0 0 70px #8be5af04; }
.df-book { position: relative; width: 185px; transform: rotate(-7deg); border-radius: 2px 7px 7px 2px; box-shadow: 17px 19px 25px #001c1959,-5px 0 0 #c6d7be; }
.df-book img { display: block; width: 100%; height: auto; border-radius: inherit; }
.df-book::before { content: ""; position: absolute; z-index: 1; top: 0; bottom: 0; left: 6px; width: 3px; background: linear-gradient(90deg,#0003,#fff1); }
.df-guide-preview figcaption { display: flex; align-items: center; gap: 10px; margin-top: 31px; position: relative; color: #cae9d3; font-size: 11px; }
.df-guide-preview figcaption span { color: #a6e2bd; border: 1px solid #8be5af44; border-radius: 4px; padding: 3px 5px; font-size: 9px; }
.df-guide-download-card { box-shadow: 0 30px 70px #001f2033; }
.df-site-header button { min-height: 44px; min-width: 44px; }
@media (min-width: 1280px) {
  .df-hero h1 { font-size: 49px; }
}
@media (max-width: 900px) {
  .df-lead-layout { gap: 28px; }
  .df-lead-content { padding: 20px; }
  .df-person-status { margin-inline-start: 68px; margin-top: -2px; }
}
@media (max-width: 700px) {
  .df-container { width: calc(100% - 36px); }
  .df-lead-layout { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .df-section-intro { text-align: start; margin-bottom: 27px; }
  .df-section-intro h2 { font-size: 30px; line-height: 1.35; }
  .df-section-intro p { font-size: 15px; line-height: 1.85; }
  .df-lead-card { border-radius: 21px; }
  .df-lead-person h3 { font-size: 23px; }
  .df-person-status { margin-top: 0; margin-inline-start: auto; }
  .df-lead-toolbar { padding-inline: 20px; }
  .df-context-copy h3 { font-size: 25px; }
  .df-quality-list { flex-direction: column; gap: 12px; }
  .df-quality-list li { font-size: 12px; }
  .df-blueprint-top { font-size: 8px; }
  .df-guide-preview { padding-top: 13px; }
  .df-book { width: 160px; transform: rotate(-5deg); }
  .df-book-orbit { width: 180px; height: 180px; top: 35px; }
}
@media (max-width: 640px) {
  .df-site-header > div { gap: 12px; padding-inline: 18px; }
  .df-site-header .df-logo-mark { width: 35px; height: 35px; }
  .df-site-header .df-wordmark { font-size: 15px; letter-spacing: .13em; }
  .df-site-header .df-wordmark-sub { font-size: 8px; letter-spacing: .2em; }
  .df-site-header [dir="ltr"] { gap: 9px; }
  .df-hero { padding-top: 108px; padding-bottom: 53px; }
  .df-hero h1 { font-size: clamp(28px,7.6vw,39px); line-height: 1.32; letter-spacing: -.04em; }
  .df-hero h1 .whitespace-nowrap { display: inline-block; }
  .df-hero .max-w-xl { font-size: 16px; line-height: 1.85; }
  .df-hero .flex.flex-col.items-start { min-width: 0; }
  .df-hero .inline-flex.rounded-full { max-width: 100%; font-size: 11px; line-height: 1.7; }
  .df-home [data-slot="button"] { max-width: 100%; white-space: normal; min-height: 48px; text-align: center; line-height: 1.6; }
  .df-hero .flex.flex-wrap.gap-4 { width: 100%; }
  .df-hero .flex.flex-wrap.gap-4 > a { width: 100%; min-height: 50px; justify-content: center; padding-inline: 12px; font-size: 14px; }
  .df-hero-visual { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; max-width: 360px; }
  .df-hero-frame { width: 100%; border-radius: 26px; }
  .df-float-chip { position: relative !important; inset: auto !important; margin-top: 6px; transform: none !important; padding: 7px 9px; font-size: 10px; border-radius: 9px; }
  .df-float-chip svg { width: 13px; height: 13px; }
  .df-hero-visual::after { display: none; }
  .df-benefits > div:last-child > div:last-child { margin-top: 28px; }
  .df-calc-field > div:first-child { flex-direction: column; align-items: stretch; gap: 12px; }
  .df-calc-field > div:first-child > div { width: 100%; justify-content: space-between; }
  .df-calc-field button { min-width: 44px; min-height: 44px; }
  .df-calculator-card { padding: 19px; gap: 26px; border-radius: 23px; }
  .df-calc-results { padding: 20px; border-radius: 18px; }
  .df-calc-results .tabular-nums { font-size: clamp(26px,7.4vw,37px); white-space: nowrap; }
  .df-calculator p.text-xs { font-size: 11px; line-height: 1.9; }
  .df-guide-download-card { padding: 22px; border-radius: 25px; }
  .df-home h2 { font-size: clamp(27px,7.3vw,36px); }
  .df-home [data-slot="accordion-trigger"] { font-size: 14px; line-height: 1.7; }
  .df-home [data-slot="accordion-trigger"] > svg { flex-shrink: 0; }
  .df-lead-details summary { min-height: 52px; font-size: 12px; }
  .df-demo-note { font-size: 12px; }
  .df-lead-field dt, .df-project-chips span { font-size: 12px; }
  .df-home a:focus-visible, .df-home summary:focus-visible { outline: 3px solid #2f9860; outline-offset: 5px; }
}
@media (max-width: 359px) {
  .df-lead-content { padding: 17px; }
  .df-person-status { margin-inline-start: 68px; }
  .df-lead-field dd { font-size: 12px; }
  .df-project-chips { gap: 5px; }
  .df-lead-budget { padding: 15px; }
  .df-calc-results { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .df-details-plus, .df-benefits .group { transition: none; }
  .df-book { transform: none; }
}