@charset "UTF-8";

:root {
    color-scheme: dark;
    --fj-bg: #101a19;
    --fj-surface: #1c2b28;
    --fj-surface-raised: #253832;
    --fj-text: #edf3ed;
    --fj-muted: #b9c8bd;
    --fj-accent: #a7d58c;
    --fj-metal: #8ea5a0;
    --fj-line: #52685f;
    --fj-warning: #f2c66d;
    --fj-danger: #ff8a82;
    --fj-serif: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", Georgia, serif;
    --fj-sans: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    --fj-width: 1280px;
}

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

html {
    background: var(--fj-bg);
    color: var(--fj-text);
    scroll-padding-top: 24px;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    background: var(--fj-bg);
    color: var(--fj-text);
    font: 15px/1.85 var(--fj-sans);
    overflow-wrap: anywhere;
}

body,
button,
input,
select,
textarea {
    font-family: var(--fj-sans);
}

a {
    color: #c5e5b5;
    text-underline-offset: 0.25em;
    text-decoration-thickness: 1px;
}

a:hover {
    color: #e2f4d7;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--fj-warning);
    outline-offset: 4px;
}

:where(button, input, select, textarea) {
    font: inherit;
    max-width: 100%;
}

button,
select,
input[type="checkbox"],
input[type="radio"] {
    cursor: pointer;
}

button {
    touch-action: manipulation;
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
    cursor: not-allowed;
}

img,
svg,
video {
    max-width: 100%;
}

img {
    display: block;
    height: auto;
}

figure {
    margin: 0;
}

fieldset {
    min-inline-size: 0;
}

textarea {
    resize: vertical;
}

input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--fj-accent);
}

input[type="file"] {
    min-width: 0;
    width: 100%;
}

input[type="file"]::file-selector-button {
    margin: 0 14px 6px 0;
    padding: 10px 14px;
    border: 1px solid var(--fj-metal);
    border-radius: 0;
    background: #263b32;
    color: var(--fj-text);
    font: inherit;
    cursor: pointer;
}

[hidden] {
    display: none !important;
}

::selection {
    background: #a7d58c;
    color: #101a19;
}

.fj-wrap {
    width: min(var(--fj-width), calc(100% - 80px));
    margin-inline: auto;
}

.fj-skip {
    position: absolute;
    z-index: 100;
    top: -120px;
    left: 16px;
    padding: 12px 20px;
    background: var(--fj-text);
    color: var(--fj-bg);
    font-weight: 700;
}

.fj-skip:focus {
    top: 12px;
    color: var(--fj-bg);
}

.fj-header {
    position: relative;
    z-index: 5;
    border-bottom: 1px solid var(--fj-line);
    background: #101a19;
    color: var(--fj-text);
}

.fj-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 96px;
    padding-block: 20px;
}

.fj-brand {
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 2px;
    color: var(--fj-text);
    font: 30px/1.2 Georgia, var(--fj-serif);
    letter-spacing: -0.035em;
    text-decoration: none;
}

.fj-brand:hover {
    color: var(--fj-text);
}

.fj-brand small,
.fj-brand-sub {
    color: var(--fj-muted);
    font: 9px/1.6 var(--fj-sans);
    letter-spacing: 0.2em;
}

.fj-nav,
.fj-header nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px 23px;
    font-size: 12px;
}

.fj-nav a,
.fj-header nav a {
    color: var(--fj-text);
    text-decoration: none;
}

.fj-nav a:hover,
.fj-header nav a:hover {
    color: var(--fj-accent);
    text-decoration: underline;
}

.fj-account-link {
    padding: 8px 14px;
    border: 1px solid var(--fj-metal);
}

.fj-safety-bar,
.fj-notice-bar,
.fj-safety-strip {
    padding: 13px 0;
    border-bottom: 1px solid #796a49;
    background: #29291f;
    color: #f8dda8;
    font-size: 12px;
    line-height: 1.8;
}

.fj-safety-bar p,
.fj-notice-bar p,
.fj-safety-strip p {
    margin-block: 0;
}

.fj-safety-bar a,
.fj-notice-bar a,
.fj-safety-strip a {
    color: #ffe3a5;
}

.fj-hero {
    position: relative;
    isolation: isolate;
    min-height: 650px;
    overflow: hidden;
    border-bottom: 1px solid var(--fj-line);
    background: #14221e;
    color: var(--fj-text);
}

.fj-hero-inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    align-items: center;
    gap: 48px;
    min-height: 650px;
    padding-block: 72px;
}

.fj-hero-content,
.fj-hero-copy {
    position: relative;
    z-index: 2;
    min-width: 0;
    padding-block: 24px;
}

.fj-kicker,
.fj-eyebrow,
.fj-section-label,
.fj-overline {
    margin: 0 0 20px;
    color: #bfd0c3;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.2em;
    line-height: 1.8;
    text-transform: uppercase;
}

.fj-kicker::before,
.fj-eyebrow::before {
    display: inline-block;
    width: 30px;
    height: 1px;
    margin-right: 12px;
    background: var(--fj-metal);
    vertical-align: middle;
    content: "";
}

.fj-hero h1 {
    margin: 22px 0 28px;
    font: 500 clamp(34px, 4.4vw, 66px)/1.55 var(--fj-serif);
    letter-spacing: 0.035em;
}

.fj-hero h1 span {
    color: #d6e8cc;
}

.fj-hero-description,
.fj-hero-lead,
.fj-lead {
    max-width: 40em;
    margin: 0 0 30px;
    color: #d3ded4;
    font-size: 15px;
    line-height: 2.1;
}

.fj-hero-actions,
.fj-actions,
.fj-button-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.fj-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
    min-height: 54px;
    max-width: 100%;
    padding: 13px 23px;
    border: 1px solid var(--fj-accent);
    border-radius: 0;
    background: var(--fj-accent);
    color: #142018;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.6;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 160ms ease, border-color 160ms ease;
}

.fj-button:hover {
    border-color: #c6e8b3;
    background: #c6e8b3;
    color: #142018;
}

.fj-button-secondary {
    border-color: var(--fj-metal);
    background: #17251f;
    color: var(--fj-text);
}

.fj-button-secondary:hover {
    border-color: #c4d3ca;
    background: #2b4036;
    color: var(--fj-text);
}

.fj-button span[aria-hidden="true"] {
    font-size: 20px;
    font-weight: 400;
}

.fj-hero-small {
    max-width: 40em;
    margin: 19px 0 0;
    color: #c3d0c5;
    font-size: 11px;
}

.fj-hero-visual,
.fj-hero-media {
    position: relative;
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--fj-metal);
    background: #17251f;
}

.fj-hero-visual::before,
.fj-hero-media::before {
    position: absolute;
    z-index: 1;
    top: -1px;
    right: -1px;
    width: 26px;
    height: 26px;
    border-bottom: 1px solid var(--fj-metal);
    background: #14221e;
    clip-path: polygon(0 0, 100% 0, 100% 100%);
    content: "";
    pointer-events: none;
}

.fj-hero-image {
    width: 100%;
    height: auto;
    max-height: 620px;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    object-position: center;
}

.fj-hero-caption,
.fj-hero-visual figcaption,
.fj-hero-media figcaption {
    padding: 12px 0 0;
    color: #c2d0c5;
    font-size: 10px;
    letter-spacing: 0.08em;
}

[data-aib-image-surface] {
    position: relative;
    isolation: isolate;
    background-color: #14221e;
    color: #ffffff;
}

[data-aib-image-surface]::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, rgb(8 18 15 / 92%), rgb(8 18 15 / 72%));
    content: "";
    pointer-events: none;
}

[data-aib-image-surface] > img {
    position: relative;
    z-index: -2;
}

[data-aib-image-surface] :where(h1, h2, h3, p, figcaption) {
    color: #ffffff;
}

[data-aib-image-surface] a:not(.fj-button) {
    color: #e1f3d5;
}

.fj-section {
    padding-block: 88px;
}

.fj-section-heading,
.fj-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 32px;
}

.fj-section h2,
.fj-pricing h2,
.fj-tools h2,
.fj-world h2,
.fj-process h2 {
    margin: 8px 0 18px;
    font: 500 clamp(25px, 2.8vw, 39px)/1.6 var(--fj-serif);
    letter-spacing: 0.025em;
}

.fj-section-intro,
.fj-muted {
    color: var(--fj-muted);
}

.fj-section-heading p,
.fj-section-head p {
    max-width: 34em;
    margin: 0;
}

.fj-tools-grid,
.fj-tool-grid,
.fj-tools-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.fj-tool {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    min-height: 225px;
    padding: 28px;
    border: 1px solid var(--fj-line);
    border-top: 2px solid var(--fj-metal);
    background: var(--fj-surface);
    color: var(--fj-text);
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease;
}

.fj-tool:hover {
    border-color: var(--fj-accent);
    background: #263b32;
    color: var(--fj-text);
}

.fj-tool-number,
.fj-tool-index {
    color: #bfd0c3;
    font: 11px/1.6 Georgia, serif;
    letter-spacing: 0.12em;
}

.fj-tool-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    margin-bottom: 20px;
    border: 1px solid var(--fj-metal);
    color: #d4e7ca;
    font-size: 23px;
}

.fj-tool h3,
.fj-tool strong {
    display: block;
    margin: 17px 0 10px;
    font-size: 20px;
    font-weight: 500;
}

.fj-tool p {
    margin: 0 0 24px;
    color: #c4d1c7;
    font-size: 13px;
}

.fj-tool-arrow {
    align-self: flex-end;
    margin-top: auto;
    color: var(--fj-accent);
    font-size: 24px;
}

.fj-world {
    border-block: 1px solid var(--fj-line);
    background: #15221e;
    color: var(--fj-text);
}

.fj-world-grid,
.fj-world-cards,
.fj-habitat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.fj-world-card,
.fj-habitat-card {
    min-width: 0;
    border: 1px solid var(--fj-line);
    background: #1c2b28;
    color: var(--fj-text);
}

.fj-world img,
.fj-world-grid img,
.fj-world-cards img,
.fj-habitat-grid img {
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
}

.fj-world-card-content,
.fj-world-card-body,
.fj-habitat-body {
    padding: 22px;
}

.fj-world-card h3,
.fj-habitat-card h3 {
    margin: 0 0 9px;
    font: 500 23px/1.6 var(--fj-serif);
}

.fj-world-card p,
.fj-habitat-card p {
    margin: 0;
    color: var(--fj-muted);
    font-size: 13px;
}

.fj-world figure > figcaption {
    padding: 18px 20px;
    color: var(--fj-muted);
    font-size: 12px;
}

.fj-image-note {
    margin: 20px 0 0;
    color: var(--fj-muted);
    font-size: 11px;
}

.fj-steps,
.fj-process-grid,
.fj-steps-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
    padding: 0;
    list-style: none;
}

.fj-step {
    min-width: 0;
    padding-top: 22px;
    border-top: 1px solid var(--fj-metal);
}

.fj-step-number,
.fj-step-index {
    color: #c4ddba;
    font: 30px/1.4 Georgia, serif;
}

.fj-step h3 {
    margin: 16px 0 10px;
    font-size: 18px;
    font-weight: 500;
}

.fj-step p {
    margin: 0;
    color: var(--fj-muted);
    font-size: 13px;
}

.fj-pricing {
    padding-block: 76px;
    border-block: 1px solid var(--fj-line);
    background: #1c2b28;
    color: var(--fj-text);
}

.fj-pricing-inner,
.fj-pricing-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 48px;
}

.fj-price,
.fj-monthly-price {
    margin-block: 20px;
    color: #edf3ed;
    font: 500 48px/1.3 Georgia, var(--fj-serif);
    font-variant-numeric: tabular-nums;
}

.fj-price small,
.fj-monthly-price small {
    margin-left: 6px;
    color: #c5d2c8;
    font: 13px/1.8 var(--fj-sans);
}

.fj-ticket-list,
.fj-price-list {
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}

.fj-ticket-list li,
.fj-price-list li,
.fj-ticket-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 20px;
    padding: 18px 0;
    border-bottom: 1px solid #60766a;
    font-variant-numeric: tabular-nums;
}

.fj-ticket-list strong,
.fj-price-list strong {
    font-size: 21px;
    font-weight: 500;
}

.fj-price-note,
.fj-pricing-note {
    color: #c9d5cc;
    font-size: 12px;
    line-height: 1.9;
}

.fj-safety-grid,
.fj-safety-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    align-items: start;
    gap: 56px;
}

.fj-safety-list {
    margin: 0;
    padding-left: 1.3em;
    color: #d4ded5;
}

.fj-safety-list li {
    padding-left: 4px;
}

.fj-safety-list li + li {
    margin-top: 18px;
}

.fj-warning,
.fj-safety-notice {
    padding: 20px 24px;
    border: 1px solid #b39a67;
    border-left: 3px solid var(--fj-warning);
    background: #2a291f;
    color: #f8dda8;
}

.fj-danger {
    padding: 20px 24px;
    border: 1px solid #ff8a82;
    border-left: 3px solid #ff8a82;
    background: #352320;
    color: #ffbeb7;
}

.fj-footer {
    padding-block: 38px;
    border-top: 1px solid var(--fj-line);
    background: #0d1714;
    color: var(--fj-muted);
    font-size: 12px;
}

.fj-footer-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 28px;
}

.fj-footer nav,
.fj-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
}

.fj-footer a {
    color: #cbd8ce;
}

.fj-footer p {
    margin: 0 0 10px;
}

.fj-footer-brand {
    color: var(--fj-text);
    font: 25px/1.5 Georgia, serif;
}

.fj-copyright {
    margin-top: 28px;
    color: var(--fj-muted);
    font-size: 10px;
    letter-spacing: 0.08em;
}

:where(.cp-wrap, .en-wrap, .cl-wrap, .bl-wrap, .ac-wrap, .ad-wrap) {
    min-width: 0;
}

:where(.cp-panel, .en-panel, .cl-panel, .bl-panel, .ac-panel, .ad-panel) {
    min-width: 0;
}

:where(.cp-panel, .en-panel, .cl-panel, .bl-panel) :where(p, li, dd) {
    overflow-wrap: anywhere;
}

:where(.cp-photo, .cp-preview, .cp-result-photo, .cl-photo, .cl-history-photo, .en-photo, .en-personal-photo) {
    width: 100%;
    max-height: 560px;
    aspect-ratio: 4 / 3;
    background: #101a19;
    object-fit: cover;
}

:where(.cp-preview, .cp-result-photo, .en-personal-photo) {
    object-fit: contain;
}

:where(.en-card, .cl-card) {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--fj-line);
    border-top: 2px solid var(--fj-metal);
    background: var(--fj-surface);
    color: var(--fj-text);
}

:where(.en-card, .cl-card) :where(h3, p) {
    overflow-wrap: anywhere;
}

:where(.en-card-number, .cl-card-number) {
    color: var(--fj-muted);
    font-size: 10px;
    letter-spacing: 0.12em;
}

:where(.en-stars, .cl-stars, .cp-stars) {
    color: #e4d6a8;
    letter-spacing: 0.08em;
}

:where(.en-band, .cl-band, .cp-band) {
    padding: 10px 14px;
    border-block: 1px solid #738278;
    background: #26352e;
    color: #edf3ed;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.7;
}

:where(.en-band, .cl-band, .cp-band):where(.toxic, .danger, .is-danger, .is-toxic),
:where(.en-band-danger, .cl-band-danger, .cp-band-danger) {
    border-color: #c3756e;
    background: #352320;
    color: #ffbeb7;
}

:where(.en-band, .cl-band, .cp-band):where(.specialist, .warning, .is-warning),
:where(.en-band-warning, .cl-band-warning, .cp-band-warning) {
    border-color: #b39a67;
    background: #2a291f;
    color: #f8dda8;
}

:where(.en-band, .cl-band, .cp-band):where(.insufficient, .unknown, .is-unknown),
:where(.en-band-unknown, .cl-band-unknown, .cp-band-unknown) {
    border-color: #8d9eaa;
    background: #253139;
    color: #e2e9ee;
}

:where(.en-memo, .cp-result-summary, .cl-memo) {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

:where(.cp-map, .cl-map) {
    display: block;
    width: 100%;
    min-height: 320px;
    border: 1px solid var(--fj-metal);
    background: #1c2b28;
}

:where(.cp-advertisement, .cp-ad, .fj-advertisement) {
    max-width: 100%;
    margin-block: 24px;
    padding: 16px;
    border: 1px solid var(--fj-line);
    background: #16231f;
    color: var(--fj-muted);
}

:where(.cp-advertisement, .cp-ad, .fj-advertisement) img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

:where(.cp-ad-label, .fj-ad-label) {
    display: block;
    margin-bottom: 10px;
    color: #cbd6cd;
    font-size: 11px;
}

:where(form)[aria-busy="true"] {
    cursor: progress;
}

:where(form)[aria-busy="true"] button[type="submit"],
:where(button)[aria-busy="true"],
:where(button).is-loading {
    border-style: dashed;
    opacity: 0.75;
    cursor: progress;
}

:where(.fj-error, .cp-error, .en-error, .cl-error, .bl-error) {
    border: 1px solid #ff8a82;
    background: #352320;
    color: #ffbeb7;
}

:where(.fj-success, .cp-success, .en-success, .cl-success, .bl-success) {
    border: 1px solid #a7d58c;
    background: #203327;
    color: #e0f1d5;
}

.fj-empty {
    padding: 36px 24px;
    border: 1px dashed var(--fj-metal);
    background: #17251f;
    color: #cfdbd1;
    text-align: center;
}

.fj-empty h2,
.fj-empty h3 {
    color: var(--fj-text);
}

.fj-table-wrap {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

.fj-table {
    width: 100%;
    border-collapse: collapse;
    background: #1c2b28;
    color: #edf3ed;
    text-align: left;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.fj-table th,
.fj-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--fj-line);
    vertical-align: top;
}

.fj-table th {
    background: #14211d;
    color: #d5e0d6;
    font-weight: 600;
}

.fj-motion-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 8px 14px;
    border: 1px solid var(--fj-metal);
    background: #17251f;
    color: var(--fj-text);
    font-size: 12px;
}

.fj-reveal,
.fj-result-enter {
    animation: fj-appear 220ms ease-out both;
}

@keyframes fj-appear {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

html[data-motion="off"] *,
body[data-motion="off"] *,
body.motion-paused *,
body.fj-motion-paused * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
}

@media (min-width: 1200px) {
    .fj-world-grid > :nth-child(2),
    .fj-world-cards > :nth-child(2),
    .fj-habitat-grid > :nth-child(2) {
        margin-top: 36px;
    }
}

@media (max-width: 1100px) {
    .fj-wrap {
        width: calc(100% - 48px);
    }

    .fj-header-inner {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
    }

    .fj-nav,
    .fj-header nav {
        justify-content: flex-start;
        gap: 12px 20px;
    }

    .fj-hero-inner {
        gap: 30px;
        min-height: 590px;
        padding-block: 48px;
    }

    .fj-hero {
        min-height: 0;
    }

    .fj-hero h1 {
        font-size: clamp(32px, 4.5vw, 50px);
    }

    .fj-tool {
        padding: 23px;
    }

    .fj-pricing-inner,
    .fj-pricing-grid,
    .fj-safety-grid,
    .fj-safety-content {
        gap: 32px;
    }
}

@media (max-width: 800px) {
    .fj-section {
        padding-block: 56px;
    }

    .fj-hero-inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
        gap: 24px;
    }

    .fj-hero-content,
    .fj-hero-copy {
        padding-block: 0;
    }

    .fj-hero h1 {
        font-size: clamp(29px, 4.5vw, 39px);
    }

    .fj-hero-description,
    .fj-hero-lead {
        font-size: 13px;
    }

    .fj-hero-actions,
    .fj-button-row {
        align-items: stretch;
        flex-direction: column;
    }

    .fj-section-heading,
    .fj-section-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .fj-tools-grid,
    .fj-tool-grid,
    .fj-tools-list {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .fj-tool {
        min-height: 0;
        padding: 24px;
    }

    .fj-tool h3,
    .fj-tool strong {
        margin-top: 10px;
    }

    .fj-tool p {
        max-width: 55em;
        margin-bottom: 12px;
    }

    .fj-world-grid,
    .fj-world-cards,
    .fj-habitat-grid {
        grid-template-columns: 1fr;
    }

    .fj-world img,
    .fj-world-grid img,
    .fj-world-cards img,
    .fj-habitat-grid img {
        max-height: 360px;
        aspect-ratio: 16 / 9;
    }

    .fj-steps,
    .fj-process-grid,
    .fj-steps-grid {
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .fj-step {
        padding-top: 18px;
    }

    .fj-step h3 {
        margin-top: 8px;
    }

    .fj-pricing {
        padding-block: 52px;
    }

    .fj-pricing-inner,
    .fj-pricing-grid,
    .fj-safety-grid,
    .fj-safety-content {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}

@media (max-width: 600px) {
    .fj-wrap {
        width: calc(100% - 32px);
    }

    .fj-header-inner {
        min-height: 0;
        padding-block: 20px;
    }

    .fj-brand {
        font-size: 28px;
    }

    .fj-nav,
    .fj-header nav {
        gap: 10px 17px;
        font-size: 12px;
    }

    .fj-account-link {
        padding: 6px 10px;
    }

    .fj-hero-inner {
        grid-template-columns: 1fr;
        gap: 28px;
        padding-block: 34px;
    }

    .fj-hero h1 {
        margin-block: 15px 22px;
        font-size: clamp(32px, 8.6vw, 46px);
        line-height: 1.6;
    }

    .fj-hero-description,
    .fj-hero-lead {
        max-width: none;
        font-size: 14px;
        line-height: 2;
    }

    .fj-hero-actions,
    .fj-button-row {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .fj-hero-actions .fj-button,
    .fj-button-row .fj-button {
        flex: 1 1 150px;
    }

    .fj-button {
        gap: 14px;
        min-height: 52px;
        padding: 12px 17px;
        font-size: 13px;
    }

    .fj-hero-image {
        max-height: 380px;
        aspect-ratio: 6 / 5;
        object-position: center 52%;
    }

    .fj-hero-visual,
    .fj-hero-media {
        padding: 8px;
    }

    .fj-section {
        padding-block: 44px;
    }

    .fj-section h2,
    .fj-pricing h2,
    .fj-tools h2,
    .fj-world h2,
    .fj-process h2 {
        font-size: 26px;
    }

    .fj-kicker,
    .fj-eyebrow,
    .fj-section-label,
    .fj-overline {
        font-size: 9px;
        letter-spacing: 0.15em;
    }

    .fj-section-heading,
    .fj-section-head {
        margin-bottom: 24px;
    }

    .fj-world-card-content,
    .fj-world-card-body,
    .fj-habitat-body {
        padding: 20px;
    }

    .fj-price,
    .fj-monthly-price {
        font-size: 42px;
    }

    .fj-ticket-list strong,
    .fj-price-list strong {
        font-size: 19px;
    }

    .fj-warning,
    .fj-danger,
    .fj-safety-notice {
        padding: 18px;
    }

    .fj-footer {
        padding-block: 28px;
    }

    .fj-footer-inner {
        flex-direction: column;
        gap: 22px;
    }

    .fj-footer nav,
    .fj-footer-links {
        gap: 12px 20px;
    }

    :where(.cp-map, .cl-map) {
        min-height: 300px;
        height: 340px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}

@media (forced-colors: active) {
    .fj-button,
    .fj-tool,
    .fj-account-link,
    .fj-warning,
    .fj-danger,
    .fj-safety-notice {
        border: 1px solid ButtonText;
    }

    :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
        outline-color: Highlight;
    }
}

@media print {
    html,
    body {
        background: #ffffff !important;
        color: #000000 !important;
    }

    .fj-header,
    .fj-footer,
    .fj-skip,
    .fj-motion-toggle,
    .fj-hero-actions,
    .fj-button-row,
    .cp-advertisement,
    .cp-ad,
    .fj-advertisement {
        display: none !important;
    }

    .fj-wrap {
        width: 100%;
    }

    .fj-hero,
    .fj-world,
    .fj-pricing,
    .fj-tool,
    .fj-warning,
    .fj-danger,
    .fj-safety-notice {
        background: #ffffff !important;
        color: #000000 !important;
        border-color: #555555 !important;
    }

    .fj-section,
    .fj-pricing {
        padding-block: 24px;
    }

    .fj-hero-inner,
    .fj-pricing-inner,
    .fj-pricing-grid,
    .fj-safety-grid,
    .fj-safety-content {
        display: block;
        min-height: 0;
    }

    .fj-hero-image {
        max-height: 250px;
        width: auto;
    }

    h1,
    h2,
    h3 {
        break-after: avoid;
    }

    figure,
    .fj-tool,
    .en-card,
    .cl-card {
        break-inside: avoid;
    }

    a {
        color: #000000 !important;
    }
}
/* Shared account/guide screens use the same dark palette as the core app. */
.auth-wrap{min-height:100svh;display:grid;place-items:center;padding:40px 20px}
.auth-card{width:100%;max-width:520px;background:var(--fj-surface);border:1px solid var(--fj-line);padding:clamp(24px,5vw,40px);border-radius:20px;color:var(--fj-text)}
.auth-brand{display:block;color:var(--fj-accent);font-weight:800;letter-spacing:.12em;text-decoration:none}
.auth-brand span{display:block;color:var(--fj-muted);font-size:11px;letter-spacing:.05em;font-weight:400;margin-top:5px}
.auth-card h1{font-size:clamp(24px,5vw,30px);line-height:1.5;margin:8px 0 16px;font-family:var(--fj-serif)}
.auth-card .eyebrow{color:var(--fj-accent);font-size:12px;margin:30px 0 4px}
.auth-intro,.muted,.text-muted{color:var(--fj-muted)}
.auth-intro{font-size:14px;line-height:1.8;margin-bottom:24px}
.form-group{display:grid;gap:7px;margin:18px 0}
.form-group label{font-size:14px;font-weight:700}
.form-group input:not([type=checkbox]):not([type=radio]),.form-group select,.form-group textarea{width:100%;min-height:46px;background:#101a19;border:1px solid #6e867a;border-radius:8px;color:#edf3ed;padding:10px 12px}
.form-group small{color:var(--fj-muted);font-size:12px;line-height:1.7}
.consent-row{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.8;margin:14px 0}
.consent-row input{width:18px;height:18px;flex:0 0 18px;margin:3px 0 0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:10px 18px;border:1px solid var(--fj-line);border-radius:9px;background:#293e35;color:var(--fj-text);font-weight:700;text-decoration:none;cursor:pointer}
.btn:hover{background:#344d41;color:var(--fj-text)}
.btn-primary,.auth-card button[type=submit]{background:var(--fj-accent);color:#101a19;border-color:var(--fj-accent)}
.btn-primary:hover,.auth-card button[type=submit]:hover{background:#c5e5b5;color:#101a19}
.btn-block{width:100%;margin-top:14px}
.auth-alt{text-align:center;border-top:1px solid var(--fj-line);padding-top:22px;margin:24px 0 16px;font-size:14px}
.auth-footer{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;font-size:12px}
.alert{padding:14px 16px;border-radius:9px;border:1px solid var(--fj-line);background:#253832;color:var(--fj-text);line-height:1.8;margin:16px 0;overflow-wrap:anywhere}
.alert.error,.alert-danger{border-color:#b66e66;background:#3c2926;color:#ffd9d3}
.alert.success{border-color:#7aa26e;background:#243825;color:#d1edc5}
.container{width:min(1100px,calc(100% - 40px));margin:40px auto 80px}
.navbar{background:#17241f;border-bottom:1px solid var(--fj-line)}
.nav-inner{width:min(1180px,calc(100% - 40px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0;flex-wrap:wrap}
.nav-brand{font-family:var(--fj-serif);font-size:20px;font-weight:700;text-decoration:none}
.nav-links{display:flex;gap:18px;flex-wrap:wrap;font-size:14px}
.container .hero{background:var(--fj-surface);padding:28px;border:1px solid var(--fj-line);margin-bottom:24px;border-radius:14px}
.grid{display:grid;gap:20px}.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:var(--fj-surface);border:1px solid var(--fj-line);padding:24px;border-radius:12px;min-width:0}
.card-title{font-size:18px;font-weight:700;color:var(--fj-accent);margin-bottom:12px}
.card p{line-height:1.9}.card table{width:100%;border-collapse:collapse}
.card th,.card td{padding:12px;text-align:left;border-bottom:1px solid var(--fj-line)}
.badge{display:inline-block;font-size:12px;background:#2d4437;border:1px solid var(--fj-line);color:var(--fj-text);padding:3px 8px;border-radius:6px}
@media(max-width:640px){.grid.cols-2{grid-template-columns:1fr}.auth-wrap{padding:20px 12px}.auth-card{border-radius:14px}.container{width:calc(100% - 28px);margin-top:24px}.nav-inner{width:calc(100% - 28px)}.nav-links{gap:12px}.card{padding:18px}}