body.page-template-demandscience-dark{margin:0;background:#070b1a;overflow-x:clip}body.page-template-demandscience-dark .wp-site-blocks>*{margin-block-start:0!important}body.page-template-demandscience-dark .wp-block-post-content,body.page-template-demandscience-dark .entry-content.alignfull.wp-block-post-content{display:block!important;max-width:none!important;padding-right:0!important;padding-left:0!important}.ds-dark,.ds-dark *{box-sizing:border-box}.ds-dark{font-family:Inter,system-ui,sans-serif}.ds-dark h1,.ds-dark h2,.ds-dark h3,.ds-dark h4,.ds-dark h5{font-family:Poppins,Inter,sans-serif}.ds-dark a:focus-visible{border-radius:4px;outline:3px solid #8fb8ff;outline-offset:4px}.ds-dark-outline-letter{color:transparent!important;-webkit-text-stroke:1.5px rgba(143,184,255,.5);paint-order:stroke fill}.ds-dark-results-metric-grid{overflow:hidden}.ds-dark-results-metric-grid>.wp-block-column{margin:0!important}.ds-dark-results-metric-value{white-space:nowrap}.ds-dark-btn .wp-block-button__link{transition:transform .16s ease,background-color .16s ease,box-shadow .16s ease}.ds-dark-btn:hover .wp-block-button__link,.ds-dark-btn .wp-block-button__link:focus-visible{color:#fff!important;background:#d52c5a!important;box-shadow:0 10px 28px rgba(244,2,86,.22);transform:translateY(-1px)}.ds-dark-card{transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}.ds-dark-card:hover{border-color:rgba(143,184,255,.48)!important;box-shadow:0 16px 38px rgba(0,0,0,.22);transform:translateY(-2px)}@media(max-width:782px){.ds-dark-science-method>.wp-block-column>.wp-block-group{padding-bottom:28px!important;border-right:0!important;border-bottom:1px solid rgba(143,184,255,.16)!important}.ds-dark-science-method>.wp-block-column:last-child>.wp-block-group{border-bottom:0!important}.ds-dark-results-metric-grid .ds-dark-results-metric-card{border-right:0!important;border-bottom:1px solid rgba(143,184,255,.16)!important}.ds-dark-results-metric-grid>.wp-block-column:last-child .ds-dark-results-metric-card{border-bottom:0!important}}@media(prefers-reduced-motion:reduce){.ds-dark *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}body.page-template-demandscience-dark:has(.fn-page) {
background: #030f3d;
}
.fn-page,
.fn-page * {
box-sizing: border-box;
}
.fn-page {
--fn-ink: #030f3d;
--fn-blue: #0066fc;
--fn-blue-soft: #9cc4ff;
--fn-paper: #faf7f0;
--fn-purple: #5b2bd9;
position: relative;
isolation: isolate;
margin: 0;
color: #fff;
background: var(--fn-ink);
font-family: "DS Dark Inter", Inter, sans-serif;
overflow: hidden;
}
.fn-page > * {
position: relative;
z-index: 1;
}
.fn-page .fn-topography,
.fn-page .fn-fireflies {
position: absolute;
inset: 0;
z-index: 0;
margin: 0;
pointer-events: none;
}
.fn-page .fn-topography {
background-position: 0 0;
background-repeat: repeat;
background-size: 720px 720px;
}
.fn-page p,
.fn-page h1,
.fn-page h2,
.fn-page h3,
.fn-page ul,
.fn-page .wp-block-columns,
.fn-page .wp-block-buttons {
margin-top: 0;
}
.fn-page .fn-badge {
display: inline-flex;
align-items: center;
width: max-content;
max-width: 100%;
min-height: 28px;
margin-bottom: 0;
padding: 6px 13px;
border: 1px solid currentcolor;
border-radius: 7px;
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 12px;
font-weight: 600;
line-height: 1.2;
letter-spacing: .08em;
text-transform: uppercase;
}
.fn-page .fn-gallery-shell > .fn-badge {
display: flex;
margin-inline: auto;
}
.fn-page .fn-badge-on-dark {
color: var(--fn-blue-soft);
background: rgba(3, 15, 61, .5);
}
#field-notes-page .fn-gallery-shell > .fn-badge-on-dark {
color: #fff;
border-color: #fff;
}
.fn-page .fn-badge-blue {
color: #fff;
border-color: transparent;
background: linear-gradient(100deg, #0047b3 0%, #0066fc 50%, #4d9aff 100%);
background-size: 200% 100%;
transition: background-position .6s cubic-bezier(.2, .7, .2, 1), box-shadow .4s ease;
}
.fn-page .fn-badge-blue:hover {
background-position: 100% 50%;
box-shadow: 0 0 22px rgba(0, 102, 252, .6);
}
.fn-page .fn-badge-navy {
color: #05195f;
background: transparent;
}
.fn-page .fn-primary-button .wp-block-button__link,
.fn-page .fn-outline-button .wp-block-button__link {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 0 24px;
border-radius: 24px;
font-family: "DS Dark Inter", Inter, sans-serif;
font-size: 14px;
font-weight: 600;
line-height: 1.2;
text-decoration: none;
white-space: nowrap;
transition: background .35s ease, border-color .35s ease, box-shadow .35s ease, transform .35s ease;
}
.fn-page .fn-primary-button .wp-block-button__link {
border: 2px solid var(--fn-purple) !important;
color: #fff;
background: var(--fn-purple);
}
.fn-page .fn-primary-button .wp-block-button__link:hover,
.fn-page .fn-primary-button .wp-block-button__link:focus-visible {
color: #fff;
box-shadow: 0 0 28px rgba(124, 77, 255, .55);
transform: translateY(-1px);
}
.fn-page .fn-outline-button .wp-block-button__link {
border: 1px solid #fff !important;
color: #fff;
background: transparent;
}
.fn-page .fn-outline-button .wp-block-button__link:hover,
.fn-page .fn-outline-button .wp-block-button__link:focus-visible {
color: #fff;
border-color: #fff;
background: #3a1d99;
box-shadow: 0 0 28px rgba(124, 77, 255, .55);
} #field-notes-page {
min-height: 100vh;
}
#field-notes-page .fn-gallery-shell {
width: min(1080px, calc(100% - 56px));
max-width: 1080px;
margin: 0 auto;
padding: 120px 0 96px;
text-align: center;
}
#field-notes-page .fn-gallery-title {
margin: 24px 0;
color: #fff;
font-size: clamp(36px, 6vw, 58px);
font-weight: 700;
line-height: 1.08;
}
#field-notes-page .fn-gallery-intro {
max-width: 620px;
margin: 0 auto 56px;
color: #e6eefc;
font-size: 18px;
line-height: 1.7;
}
#field-notes-page .fn-gallery-grid {
display: grid;
grid-template-columns: minmax(280px, 520px);
justify-content: center;
margin: 0;
text-align: left;
}
#field-notes-page .fn-story-card {
position: relative;
display: flex;
min-height: 0;
margin: 0;
padding: 24px;
border: 1px solid transparent;
border-radius: 10px;
background: transparent;
flex-direction: column;
gap: 16px;
isolation: isolate;
transition: transform .45s cubic-bezier(.2, .7, .2, 1);
}
#field-notes-page .fn-story-card::before {
position: absolute;
inset: -4px;
z-index: -2;
border-radius: 14px;
background: radial-gradient(38% 55% at 12% 25%, #0066fc, transparent 70%), radial-gradient(34% 48% at 88% 68%, #7c4dff, transparent 72%), radial-gradient(28% 42% at 62% 12%, rgba(77, 154, 255, .7), transparent 70%), radial-gradient(36% 52% at 28% 92%, #9b6bff, transparent 72%), radial-gradient(22% 30% at 92% 15%, rgba(0, 102, 252, .6), transparent 70%);
background-repeat: no-repeat;
background-size: 160% 160%;
content: "";
filter: blur(14px);
opacity: 0;
pointer-events: none;
transition: opacity .5s ease;
}
#field-notes-page .fn-story-card::after {
position: absolute;
inset: 0;
z-index: -1;
border: 1px solid rgba(156, 196, 255, .35);
border-radius: 10px;
background: #030f3d;
content: "";
pointer-events: none;
transition: border-color .45s ease;
}
#field-notes-page .fn-story-card:hover {
transform: translateY(-8px);
}
#field-notes-page .fn-story-card:hover::after {
border-color: #6ea8ff;
}
#field-notes-page .fn-story-card:hover::before {
animation: field-notes-card-glow 7s ease-in-out infinite;
opacity: 1;
}
@keyframes field-notes-card-glow {
0% {
background-position: 0 0;
}
33% {
background-position: 100% 35%;
}
66% {
background-position: 30% 100%;
}
100% {
background-position: 0 0;
}
}
#field-notes-page .fn-card-title {
margin: 0;
font-size: 26px;
font-weight: 700;
line-height: 1.2;
}
#field-notes-page .fn-story-card .fn-badge {
min-height: 26px;
padding: 5px 12px;
border-radius: 6px;
font-family: "DS Dark Inter", Inter, sans-serif;
font-size: 11px;
letter-spacing: .14em;
line-height: 14px;
}
#field-notes-page .fn-card-title a {
color: #fff;
text-decoration: none;
} #field-notes-page .fn-card-title a::after {
position: absolute;
inset: 0;
z-index: 2;
border-radius: 10px;
content: "";
}
#field-notes-page .fn-story-card:focus-within::after {
border-color: #6ea8ff;
}
#field-notes-page .fn-card-link a {
position: relative;
z-index: 3;
}
#field-notes-page .fn-card-title span,
#field-notes-story-page .fn-story-title-accent {
color: transparent;
background: linear-gradient(100deg, #d9c8ff 0%, #b79bff 55%, #9f7bff 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
}
.fn-page .fn-location {
position: relative;
margin: 0;
padding-left: 24px;
color: var(--fn-blue-soft);
font-size: 14px;
font-weight: 600;
}
.fn-page .fn-location::before {
position: absolute;
top: .1em;
left: 2px;
width: 10px;
height: 14px;
border: 2px solid currentcolor;
border-radius: 50% 50% 50% 0;
content: "";
transform: rotate(-45deg);
}
.fn-page .fn-location-blue {
color: var(--fn-blue);
}
#field-notes-page .fn-location {
display: flex;
padding-left: 0;
align-items: center;
gap: 8px;
line-height: normal;
}
#field-notes-page .fn-location::before {
position: static;
width: 16px;
height: 16px;
border: 0;
border-radius: 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239cc4ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.9 16.1C1 12.2 1 5.8 4.9 1.9'/%3E%3Cpath d='M7.8 4.7a6.14 6.14 0 0 0-.8 7.5'/%3E%3Ccircle cx='12' cy='9' r='2'/%3E%3Cpath d='M16.2 4.8c2 2 2.26 5.11.8 7.47'/%3E%3Cpath d='M19.1 1.9a9.96 9.96 0 0 1 0 14.1'/%3E%3Cpath d='M9.5 18h5'/%3E%3Cpath d='m8 22 4-11 4 11'/%3E%3C/svg%3E");
background-position: center;
background-repeat: no-repeat;
background-size: 16px 16px;
content: "";
flex: 0 0 16px;
transform: none;
}
#field-notes-page .fn-card-summary {
margin: 0;
color: #94a3b8;
font-size: 16px;
line-height: 1.6;
transition: color .45s ease;
}
#field-notes-page .fn-story-card:hover .fn-card-summary {
color: #fff;
}
#field-notes-page .fn-card-link {
margin: auto 0 0;
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 12px;
font-weight: 600;
letter-spacing: .14em;
line-height: normal;
}
#field-notes-page .fn-card-link a {
color: var(--fn-blue-soft);
text-decoration: none;
}
#field-notes-page .fn-gallery-actions {
margin-top: 56px;
}
#field-notes-page .fn-gallery-actions .wp-block-button__link {
min-height: 44px;
padding-inline: 28px;
font-size: 15px;
} #field-notes-book-page {
display: flex;
min-height: 100vh;
padding: 48px 16px;
align-items: center;
justify-content: center;
background: #030f3d;
}
#field-notes-book-page .fn-book {
position: relative;
z-index: 1;
display: grid;
width: min(1120px, 100%);
min-height: 640px;
margin: 0;
border-radius: 14px;
box-shadow: 8px 0 #e2dccb, 16px 0 #cfc7b2, 0 30px 80px rgba(0, 0, 0, .55);
grid-template-columns: 1fr 1fr;
overflow: hidden;
perspective: 2200px;
transition: box-shadow .6s cubic-bezier(.4, 0, .2, 1);
gap: 0;
font-size: 16px;
}
#field-notes-book-page .fn-book.has-previous {
box-shadow: 8px 0 #e2dccb, 16px 0 #cfc7b2, -8px 0 #e2dccb, -16px 0 #cfc7b2, 0 30px 80px rgba(0, 0, 0, .55);
}
#field-notes-book-page .fn-book::after {
position: absolute;
top: 0;
bottom: 0;
left: calc(50% - 1px);
z-index: 4;
border-left: 2px dashed rgba(3, 15, 61, .6);
content: "";
pointer-events: none;
}
#field-notes-book-page .fn-book-panel {
display: none;
min-width: 0;
min-height: 640px;
margin: 0;
}
#field-notes-book-page .fn-book-panel.is-visible {
display: flex;
}
#field-notes-book-page .fn-book-cover {
position: relative;
color: #fff;
background: #000d3c;
overflow: hidden;
}
#field-notes-book-page .fn-book-cover .fn-topography {
background-size: 560px 560px;
}
#field-notes-book-page .fn-book-cover-content {
display: flex;
width: 100%;
min-height: 640px;
margin: 0;
padding: 64px;
flex-direction: column;
gap: 0;
}
#field-notes-book-page .fn-book-cover-badge,
#field-notes-book-page .fn-book-story > .fn-badge {
min-height: 0;
padding: 5px 12px;
border-radius: 6px;
font-family: "DS Dark Inter", Inter, sans-serif;
font-size: 11px;
font-weight: 600;
line-height: normal;
letter-spacing: .14em;
gap: 6px;
}
#field-notes-book-page .fn-book-cover-badge {
border-color: rgba(255, 255, 255, .5);
color: #fff;
background: transparent;
}
#field-notes-book-page .fn-book-story > .fn-badge {
border-color: #05195f;
color: #05195f;
background: transparent;
}
#field-notes-book-page .fn-book-title {
margin: 28px 0 24px;
color: #fff;
font-size: 100px;
font-weight: 600;
line-height: 1.02;
letter-spacing: -.04em;
}
#field-notes-book-page .fn-book-intro {
max-width: 420px;
margin: 0;
color: #e6eefc;
font-size: 17px;
line-height: 1.7;
}
#field-notes-book-page .fn-book-cover-actions {
margin-top: auto;
padding-top: 32px;
align-items: center;
flex-wrap: nowrap;
}
#field-notes-book-page .fn-book-story {
position: relative;
min-height: 640px;
padding: 64px;
color: #030f3d;
background: #faf7f0;
flex-direction: column;
gap: 14px;
}
#field-notes-book-page .fn-book-story-title {
margin: 0;
color: #030f3d;
font-size: 28px;
font-weight: 700;
line-height: 1.15;
}
#field-notes-book-page .fn-book-story-title span {
color: var(--fn-purple);
}
#field-notes-book-page .fn-location {
display: flex;
padding-left: 0;
align-items: center;
gap: 8px;
line-height: normal;
}
#field-notes-book-page .fn-location::before {
position: static;
width: 16px;
height: 16px;
border: 0;
border-radius: 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230066fc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.9 16.1C1 12.2 1 5.8 4.9 1.9'/%3E%3Cpath d='M7.8 4.7a6.14 6.14 0 0 0-.8 7.5'/%3E%3Ccircle cx='12' cy='9' r='2'/%3E%3Cpath d='M16.2 4.8c2 2 2.26 5.11.8 7.47'/%3E%3Cpath d='M19.1 1.9a9.96 9.96 0 0 1 0 14.1'/%3E%3Cpath d='M9.5 18h5'/%3E%3Cpath d='m8 22 4-11 4 11'/%3E%3C/svg%3E");
background-position: center;
background-repeat: no-repeat;
background-size: 16px 16px;
content: "";
flex: 0 0 16px;
transform: none;
}
#field-notes-book-page .fn-book-summary {
margin: 0;
color: #1e293b;
font-size: 15px;
line-height: 1.6;
}
#field-notes-book-page .fn-book-stats {
display: grid;
margin: 4px 0 0;
grid-template-columns: 1fr 1fr;
gap: 16px 24px;
}
#field-notes-book-page .fn-book-stat {
margin: 0;
}
#field-notes-book-page .fn-book-stat p {
margin: 6px 0 0;
color: #475569;
font-size: 13px;
line-height: 1.5;
}
#field-notes-book-page .fn-book-stat .fn-book-stat-value {
margin: 0;
color: #030f3d;
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 30px;
font-weight: 700;
line-height: 1;
}
#field-notes-book-page .fn-book-story-actions {
margin-top: auto;
padding-top: 8px;
align-items: center;
justify-content: flex-start !important;
flex-wrap: nowrap;
gap: 0;
}
#field-notes-book-page .fn-book-story-actions .wp-block-buttons,
#field-notes-book-page .fn-book-story-actions .wp-block-button,
#field-notes-book-page .fn-book-story-actions .wp-block-button__link {
width: auto !important;
}
#field-notes-book-page .fn-primary-button .wp-block-button__link,
#field-notes-book-page .fn-outline-button .wp-block-button__link {
min-width: 0 !important;
width: auto !important;
line-height: normal;
}
#field-notes-book-page .fn-book-flip {
position: absolute;
top: 0;
bottom: 0;
z-index: 50;
width: 50%;
transform-style: preserve-3d;
will-change: transform;
pointer-events: none;
}
#field-notes-book-page .fn-book-flip.is-forward {
left: 50%;
transform-origin: left center;
animation: fn-book-turn-forward 1.2s cubic-bezier(.4, 0, .25, 1) forwards;
}
#field-notes-book-page .fn-book-flip.is-backward {
left: 0;
transform-origin: right center;
animation: fn-book-turn-backward 1.2s cubic-bezier(.4, 0, .25, 1) forwards;
}
#field-notes-book-page .fn-book-flip-face {
position: absolute;
inset: 0;
display: flex;
background: #faf7f0;
overflow: hidden;
backface-visibility: hidden !important;
-webkit-backface-visibility: hidden !important;
}
#field-notes-book-page .fn-book-flip-front {
transform: rotateY(0deg) translateZ(1px);
}
#field-notes-book-page .fn-book-flip-face::after {
position: absolute;
inset: 0;
background: linear-gradient(90deg, transparent, rgba(0, 0, 0, .28));
content: "";
pointer-events: none;
}
#field-notes-book-page .fn-book-flip-back {
transform: rotateY(180deg) translateZ(1px);
}
#field-notes-book-page .fn-book-flip-back::after {
background: linear-gradient(90deg, rgba(0, 0, 0, .22), transparent);
}
#field-notes-book-page .fn-book-flip-face > .fn-book-panel {
display: flex !important;
width: 100%;
height: 100%;
min-height: 100%;
}
#field-notes-book-page .fn-book.is-turning {
pointer-events: none;
}
@keyframes fn-book-turn-forward {
0% { transform: rotateY(0deg) skewY(0deg); }
45% { transform: rotateY(-82deg) skewY(-5deg); }
100% { transform: rotateY(-180deg) skewY(0deg); }
}
@keyframes fn-book-turn-backward {
0% { transform: rotateY(0deg) skewY(0deg); }
45% { transform: rotateY(82deg) skewY(5deg); }
100% { transform: rotateY(180deg) skewY(0deg); }
}
.fn-page .fn-firefly {
position: absolute;
width: var(--fn-firefly-size);
height: var(--fn-firefly-size);
border-radius: 50%;
background: #fffad7;
box-shadow: 0 0 8px 3px rgba(255, 220, 120, .7), 0 0 22px 10px rgba(255, 200, 90, .22);
opacity: .2;
animation: fn-firefly 4s ease-in-out infinite alternate;
}
@keyframes fn-firefly {
50% { opacity: 1; transform: translate(8px, -7px); }
100% { opacity: .15; transform: translate(-6px, 5px); }
} #field-notes-story-page {
padding: 0 !important;
background: #030f3d;
font-size: 16px;
line-height: normal;
}
#field-notes-story-page .fn-topography {
background-size: 640px 640px;
}
#field-notes-story-page .fn-story-shell {
width: min(816px, 100%);
max-width: 816px;
margin: 0 auto;
padding-right: 28px;
padding-left: 28px;
}
#field-notes-story-page .fn-story-header {
position: static !important;
width: 100%;
max-width: none !important;
margin: 0;
padding: 120px 0 96px !important;
background: transparent !important;
}
#field-notes-story-page .fn-story-header > * {
width: 100% !important;
min-width: 100%;
max-width: 100% !important;
}
#field-notes-story-page .fn-story-kicker {
margin: 0;
color: var(--fn-blue-soft);
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 12px;
font-weight: 600;
line-height: normal;
letter-spacing: .18em;
text-transform: uppercase;
flex-wrap: wrap !important;
gap: 12px;
}
#field-notes-story-page .fn-story-code {
margin: 0 0 0 auto;
color: var(--fn-blue-soft);
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 12px;
font-weight: 600;
line-height: normal;
letter-spacing: .18em;
}
#field-notes-story-page .fn-badge-compass::before {
width: 22px;
height: 22px;
margin-right: 0;
background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolygon points='16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76'/%3E%3C/svg%3E");
content: "";
}
#field-notes-story-page .fn-story-kicker .fn-badge {
min-height: 36px;
padding: 7px 14px;
border: 0;
background: linear-gradient(to right, #0a2a8f, #0066fc);
background-size: auto;
box-shadow: none;
font-size: 14.4px;
line-height: normal;
letter-spacing: .15em;
gap: 10px;
transition: none;
}
#field-notes-story-page .fn-story-kicker .fn-badge:hover,
#field-notes-story-page .fn-story-kicker .fn-badge:focus {
background-position: 0 0;
box-shadow: none;
}
#field-notes-story-page .fn-story-title {
margin: 32px 0 24px;
color: #fff;
font-size: clamp(36px, 6vw, 58px);
font-weight: 700;
line-height: 1.08;
text-wrap: balance;
}
#field-notes-story-page .fn-story-subtitle {
margin: 0 0 40px;
color: var(--fn-blue-soft);
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 20px;
font-weight: 500;
line-height: 1.5;
}
#field-notes-story-page .fn-story-meta {
display: flex;
flex-wrap: wrap !important;
margin: 0;
padding-top: 20px;
border-top: 1px solid rgba(156, 196, 255, .3);
gap: 20px 32px;
justify-content: space-between;
}
#field-notes-story-page .fn-story-meta > .wp-block-column {
min-width: 112px;
flex: 0 1 auto !important;
}
#field-notes-story-page .fn-story-meta > .wp-block-column:nth-child(2) {
min-width: 175px;
}
#field-notes-story-page .fn-story-meta > .wp-block-column:nth-child(3) {
min-width: 230px;
}
#field-notes-story-page .fn-story-meta p {
margin: 0;
color: #fff;
font-size: 14px;
line-height: 1.5;
}
#field-notes-story-page .fn-story-meta .fn-meta-label {
display: flex;
align-items: center;
margin-bottom: 4px;
color: var(--fn-blue-soft);
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 11px;
font-weight: 600;
line-height: normal;
letter-spacing: .16em;
white-space: nowrap;
gap: 8px;
}
#field-notes-story-page .fn-story-meta .fn-meta-label::before {
display: block;
width: 14px;
height: 14px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
content: "";
flex: 0 0 14px;
}
#field-notes-story-page .fn-story-meta .fn-meta-date::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239cc4ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v3M16 2v3'/%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M3 9h18m-9 4-3 3 2 2 4-4'/%3E%3C/svg%3E");
}
#field-notes-story-page .fn-story-meta .fn-meta-location::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239cc4ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.9 16.1C1 12.2 1 5.8 4.9 1.9M7.8 4.7a6.14 6.14 0 0 0-.8 7.5'/%3E%3Ccircle cx='12' cy='9' r='2'/%3E%3Cpath d='M16.2 4.8c2 2 2.26 5.11.8 7.47M19.1 1.9a9.96 9.96 0 0 1 0 14.1M9.5 18h5m-6.5 4 4-11 4 11'/%3E%3C/svg%3E");
}
#field-notes-story-page .fn-story-meta .fn-meta-intel::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239cc4ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z'/%3E%3C/svg%3E");
}
#field-notes-story-page .fn-story-section {
margin: 0;
padding: 40px 0 72px;
}
#field-notes-story-page .fn-waypoint {
margin: 0 0 12px;
color: var(--fn-blue-soft);
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 13px;
font-weight: 600;
line-height: normal;
letter-spacing: .18em;
text-transform: uppercase;
}
#field-notes-story-page .fn-section-heading {
margin: 0 0 40px;
color: #fff;
font-size: 38px;
font-weight: 700;
line-height: 1.15;
}
#field-notes-story-page .fn-heading-highlight {
margin-left: -12px;
padding: 2px 12px;
background: linear-gradient(var(--fn-purple), var(--fn-purple)) no-repeat right center / 0 100%;
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
transition: background-size .9s cubic-bezier(.65, 0, .35, 1);
}
#field-notes-story-page .fn-section-heading.is-visible .fn-heading-highlight {
background-position: left center;
background-size: 100% 100%;
}
#field-notes-story-page .fn-story-section h3 {
margin: 0 0 16px;
color: #fff;
font-size: 24px;
font-weight: 600;
line-height: 1.3;
}
#field-notes-story-page .fn-story-section > p:not(.fn-waypoint) {
margin-bottom: 20px;
color: #e6eefc;
font-size: 18px;
line-height: 1.7;
}
#field-notes-story-page .fn-story-section > ul {
display: grid;
margin: 0;
padding-left: 22px;
color: #e6eefc;
font-size: 18px;
line-height: 1.6;
gap: 12px;
}
#field-notes-story-page .fn-story-section > ul > li {
color: inherit;
font-size: inherit;
line-height: inherit;
}
#field-notes-story-page .fn-story-section > p.fn-section-gap,
#field-notes-story-page .fn-story-section > ul.fn-section-gap {
margin-bottom: 56px !important;
}
#field-notes-story-page .fn-story-section > p.fn-list-intro {
margin-bottom: 16px;
}
#field-notes-story-page .fn-metrics-intro {
margin-bottom: 32px !important;
}
#field-notes-story-page .fn-metrics {
display: grid;
margin: 0;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 16px;
}
#field-notes-story-page .fn-metric-card {
position: relative;
margin: 0;
padding: 24px;
border: 1px solid rgba(156, 196, 255, .35);
border-radius: 10px;
background: rgba(3, 15, 61, .85);
backdrop-filter: blur(4px);
overflow: hidden;
transition: box-shadow .25s ease;
}
#field-notes-story-page .fn-metric-card:hover {
box-shadow: 0 0 36px rgba(0, 102, 252, .4);
}
#field-notes-story-page .fn-metric-rim {
position: absolute;
inset: 0;
padding: 1px;
border-radius: inherit;
background: radial-gradient(180px circle at var(--fn-rim-x, 50%) var(--fn-rim-y, 50%), rgba(191, 224, 255, .95), rgba(110, 168, 255, .4) 50%, transparent 80%);
content: "";
opacity: 0;
pointer-events: none;
transition: opacity .3s;
-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite: xor;
mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
#field-notes-story-page .fn-metric-card:hover .fn-metric-rim {
opacity: 1;
}
#field-notes-story-page .fn-word {
transition: opacity .3s;
}
#field-notes-story-page .fn-map-layer {
position: absolute;
inset: 0;
z-index: 2;
margin: 0;
pointer-events: none;
overflow: hidden;
}
#field-notes-story-page .fn-map-mark {
position: absolute;
display: flex;
color: #9cc4ff;
flex-direction: column;
gap: 8px;
opacity: 0;
transform: translateY(14px);
transition: opacity .7s, transform .7s;
}
#field-notes-story-page .fn-map-mark.is-visible {
opacity: .45;
transform: none;
}
#field-notes-story-page .fn-map-shape {
display: block;
width: var(--fn-mark-size, 12px);
height: var(--fn-mark-size, 12px);
background: #6ea8ff;
}
#field-notes-story-page .fn-map-shape.is-hollow::after {
display: block;
width: 42%;
height: 42%;
margin: 29%;
background: #030f3d;
content: "";
}
#field-notes-story-page .fn-map-shape.is-triangle {
width: 0;
height: 0;
border-right: calc(var(--fn-mark-size, 12px) / 2) solid transparent;
border-bottom: var(--fn-mark-size, 12px) solid #6ea8ff;
border-left: calc(var(--fn-mark-size, 12px) / 2) solid transparent;
background: transparent;
}
#field-notes-story-page .fn-map-label {
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 9px;
font-weight: 600;
font-variant-numeric: tabular-nums;
line-height: 1.7;
letter-spacing: .12em;
white-space: nowrap;
}
#field-notes-story-page .fn-map-note {
opacity: .65;
}
#field-notes-story-page .fn-metric-card p {
margin: 10px 0 0;
color: #cfe0ff;
font-size: 16px;
line-height: 1.5;
}
#field-notes-story-page .fn-metric-card .fn-metric-value {
margin: 0;
color: #fff;
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 44px;
font-weight: 700;
line-height: 1;
}
#field-notes-story-page .fn-demo {
margin: 40px 0 72px;
padding: 48px;
border: 1px solid rgba(156, 196, 255, .25);
border-radius: 28px;
background: linear-gradient(135deg, #121a6e 0%, #2a1a8f 60%, #341099 100%);
text-align: center;
}
#field-notes-story-page .fn-demo h2 {
margin: 0 0 24px;
color: #fff;
font-size: clamp(28px, 4vw, 40px);
font-weight: 600;
line-height: 1.2;
}
#field-notes-story-page .fn-demo.fn-story-section > p {
max-width: 640px;
margin: 0 auto 40px;
color: #fff;
font-size: 18px;
line-height: 1.7;
}
#field-notes-story-page .fn-form-frame {
max-width: 640px;
min-height: 500px;
margin: 0 auto;
border-radius: 16px;
background: #fff;
overflow: hidden;
}
#field-notes-story-page .fn-form-iframe {
display: block;
width: 100%;
min-height: 500px;
border: 0;
background: #fff;
}
#field-notes-story-page .fn-story-footer {
margin: 0;
padding: 48px 0 96px;
gap: 24px;
}
#field-notes-story-page .fn-story-footer p {
margin: 0;
}
#field-notes-story-page .fn-story-footer .wp-block-buttons,
#field-notes-story-page .fn-story-footer .wp-block-button {
display: flex;
margin: 0;
padding: 0;
}
#field-notes-story-page .fn-story-footer .fn-outline-button .wp-block-button__link {
transition: background .3s, border-width .2s, padding .2s, box-shadow .3s;
}
#field-notes-story-page .fn-story-footer .fn-outline-button .wp-block-button__link:hover,
#field-notes-story-page .fn-story-footer .fn-outline-button .wp-block-button__link:focus-visible {
padding: 0 23px;
border-width: 2px !important;
}
#field-notes-story-page .fn-story-signoff {
margin-bottom: 12px !important;
color: #fff;
font-family: "DS Dark Poppins", Poppins, sans-serif;
font-size: 22px;
font-weight: 700;
line-height: 1.3;
}
#field-notes-story-page .fn-story-copyright {
color: var(--fn-blue-soft);
font-size: 13px;
line-height: normal;
}
@media (max-width: 782px) {
#field-notes-page .fn-gallery-shell {
width: min(100% - 40px, 760px);
}
#field-notes-story-page .fn-story-shell {
width: 100%;
}
#field-notes-page .fn-gallery-shell {
padding: 88px 0 72px;
}
#field-notes-page .fn-story-card {
padding: 24px;
}
#field-notes-book-page {
padding: 36px 16px;
}
#field-notes-book-page .fn-book {
display: block;
min-height: 640px;
}
#field-notes-book-page .fn-book::after {
display: none;
}
#field-notes-book-page .fn-book-panel {
width: 100%;
}
#field-notes-book-page .fn-book-cover-content {
padding: 36px 26px;
}
#field-notes-book-page .fn-book-title {
font-size: clamp(56px, 18vw, 88px);
}
#field-notes-book-page .fn-book-story {
padding: 26px;
}
#field-notes-book-page .fn-book-flip {
left: 0 !important;
width: 100%;
}
#field-notes-book-page .fn-book-flip.is-forward {
transform-origin: left center;
}
#field-notes-book-page .fn-book-flip.is-backward {
transform-origin: right center;
}
}
@media (prefers-reduced-motion: reduce) {
.fn-page *,
.fn-page *::before,
.fn-page *::after {
animation-duration: 0s !important;
transition-duration: 0s !important;
}
}