.body-content { padding: 0; }

.template-landing {
    --tl-ink: #142f49;
    --tl-muted: #586b7e;
    --tl-accent: #2463a4;
    --tl-green: #00845d;
    --tl-green-hover: #006d4d;
    color: var(--tl-ink);
    background: #fff;
    font-family: inherit;
    overflow: clip;
}
.template-landing h1, .template-landing h2, .template-landing h3, .template-landing h4 { color: var(--tl-ink); font-family: inherit; font-weight: 700; letter-spacing: -.025em; margin: 0 0 1rem; }
.template-landing h2 { font-size: clamp(2.4rem, 4vw, 3.65rem); line-height: 1.08; letter-spacing: -.045em; }
.template-landing p { color: var(--tl-muted); line-height: 1.75; margin: 0 0 1rem; }
.template-landing a { color: var(--tl-accent); text-underline-offset: 4px; }
.template-landing a:focus-visible, .template-landing button:focus-visible { outline: 3px solid var(--tl-accent); outline-offset: 5px; }
.template-landing .pill { display: inline-block; margin-bottom: 1rem; padding: 0; color: var(--tl-accent); background: none; border: 0; font-size: .85rem; font-weight: 700; line-height: 1.5; letter-spacing: .065em; text-transform: uppercase; }
.template-landing .btn, .template-landing .rt-cta { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; min-height: 56px; padding: 1.05rem 1.4rem; border-radius: 6px; font-size: .95rem; font-weight: 700; line-height: 1.5; text-decoration: none; white-space: normal; transition: background .2s, border-color .2s; }
.template-landing .btn-primary, .template-landing .rt-cta { color: #fff; background: var(--tl-green); border: 1px solid var(--tl-green); box-shadow: 0 5px 14px #0076531f; }
.template-landing .btn-primary:hover, .template-landing .btn-primary:focus-visible, .template-landing .rt-cta:hover { color: #fff; background: var(--tl-green-hover); border-color: var(--tl-green-hover); }
.template-landing .btn-ghost, .template-landing .btn-outline-secondary { color: #007653; background: #fff; border: 1px solid #007653; }
.template-landing .btn-ghost:hover, .template-landing .btn-outline-secondary:hover { color: #fff; background: var(--tl-green); border-color: var(--tl-green); }

.template-landing .rt-hero { padding: 5rem 0 4rem; background: linear-gradient(115deg, #f5f8fc 30%, #e5eff9); overflow: hidden; }
.template-landing .rt-hero h1 { max-width: 620px; font-size: clamp(3.2rem, 5.5vw, 5.25rem); line-height: 1.02; letter-spacing: -.06em; margin-bottom: 1.5rem; }
.template-landing .rt-hero .hero-lead { max-width: 540px; padding: 0 !important; margin: 0 0 1.8rem !important; font-size: 1.1rem; color: #4a6073; }
.template-landing .hero-cta { gap: .8rem !important; }
.template-landing .trust-line { padding-top: 1.35rem; margin-top: 0 !important; color: var(--tl-muted) !important; font-size: .9rem; }
.template-landing .rt-hero .trust { color: var(--tl-muted); font-size: .9rem; }
.template-landing .hero-image { position: relative; height: 520px; display: flex; align-items: center; justify-content: center; perspective: 1000px; }
.template-landing .hero-image::before { content: ''; position: absolute; inset: 4% 0; border-radius: 50%; background: #cbdff1; }
.template-landing .hero-image-inner { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: transform .8s; }
.template-landing .hero-image.flipped .hero-image-inner { transform: rotateY(180deg); }
.template-landing .hero-image img { position: absolute; top: 50%; left: 50%; max-width: 100%; max-height: 100%; width: auto; height: auto; transform: translate(-50%, -50%); backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.template-landing .hero-image img:last-child { transform: translate(-50%, -50%) rotateY(180deg); }
.template-landing .resume-hero-preview { display: block; width: 100%; max-width: 640px; height: auto; margin: 0 auto; }

.template-landing .templates { padding: 5.5rem 0; background: #f0f5f9; scroll-margin-top: 100px; }
.template-landing .templates > .container > .pill, .template-landing .templates > .container > h3, .template-landing .templates > .container > p { display: block; max-width: 760px; margin-left: auto; margin-right: auto; text-align: center; }
.template-landing .templates > .container > h3 { font-size: clamp(2.4rem, 4vw, 3.65rem); line-height: 1.08; letter-spacing: -.045em; }
.template-landing .templates > .container > p { font-size: 1.05rem; }
.template-landing .fp-template-stage { margin-top: 3rem; }
.template-landing .fp-template-carousel.slick-dotted { margin-bottom: 0; }
.template-landing .fp-template-card { color: var(--fp-ink); text-decoration: none; }
.template-landing .fp-template-caption h3 { font-size: 1.2rem; margin: 0; letter-spacing: normal; }
.template-landing .fp-template-caption p { margin: .65rem 0 0; font-size: .9rem; }

.template-landing > section.container { padding-top: 2.5rem; padding-bottom: 2.5rem; margin-top: 0 !important; }
.template-landing > section.container > .row { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; margin: 0 !important; }
.template-landing > section.container .col { min-width: 0; margin: 0 !important; }
.template-landing > section.container .grayscale { display: flex; align-items: center; justify-content: center; min-height: 72px; }
.template-landing > section.container img { max-width: 100%; max-height: 72px; width: 260px; height: auto; object-fit: contain; filter: grayscale(100%) brightness(80%); opacity: .8; }
.template-landing > section.container img[width="175"] { width: 175px; }
.template-landing > section.container img[width="200"] { width: 200px; }
.template-landing .rt-band { padding: 5.5rem 0 !important; background: linear-gradient(135deg, #f0f6fc, #e2edf9); }
.template-landing .rt-feature { height: 100%; padding: 2rem; border: 1px solid #d6e3f0; border-radius: 12px; background: #fff; }
.template-landing .rt-feature h3 { font-size: 1.5rem; line-height: 1.35; }
.template-landing .rt-feature p { font-size: .95rem; }
.template-landing .rt-feature > :last-child { margin-bottom: 0; }
.template-landing .rt-check { color: var(--tl-green); font-weight: 700; }
.template-landing .cta-panel { padding: 4rem 0; }
.template-landing .cta-box { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 3rem; border: 1px solid #d6e3f0; border-radius: 12px; background: #e3eefb; }
.template-landing .cta-box h2 { margin: 0 0 1rem !important; }
.template-landing .cta-box p { margin: 0; }
.template-landing .cta-box > div:last-child { flex-shrink: 0; max-width: 320px; }
.template-landing .p-block-8 { padding: 4rem 0; }
.template-landing .p-block-8 h3:not(.h1) { font-size: clamp(1.7rem, 2.5vw, 2.2rem); line-height: 1.25; }
.template-landing .stats-box { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 160px; height: 100%; padding: 1.5rem; border: 1px solid #d6e3f0; border-radius: 12px; background: #edf4fc; text-align: center; }
.template-landing .stats-box h3 { font-size: clamp(2.25rem, 3.5vw, 3rem); margin: 0 0 .5rem; }
.template-landing .text-secondary-active { color: var(--tl-accent); }
.template-landing > section.py-5 { padding: 5.5rem 0 !important; }
.template-landing .templates-header { max-width: 760px; margin: 0 auto 3rem; text-align: center; }
.template-landing .testimonials-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.template-landing .testimonial-card { display: flex; flex-direction: column; padding: 1.75rem; border: 1px solid #e1e8ec; border-radius: 12px; background: #fff; }
.template-landing .testimonial-card > p { flex: 1; font-size: .9rem; color: var(--tl-ink); margin-bottom: 1.5rem; }
.template-landing .author { display: flex; align-items: center; gap: .75rem; }
.template-landing .author-img { width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%; object-fit: cover; }
.template-landing .author-info > span { display: block; font-size: .85rem; font-weight: 700; line-height: 1.4; }
.template-landing .author-info .mt-1 { display: flex; gap: .25rem; margin: .5rem 0 !important; color: var(--tl-green); font-size: .94rem; }
.template-landing .author-info small { display: block; color: var(--tl-muted); }
.template-landing .rt-faq { padding: 5.5rem 0 !important; background: #f7f9fb; }
.template-landing .rt-faq .row { --bs-gutter-x: 3rem; }
.template-landing .rt-faq .sticky-top { top: 100px; }
.template-landing .faq-nav a { display: block; padding: .65rem 0; color: var(--tl-accent); font-weight: 600; line-height: 1.6; }
.template-landing .rt-faq .item { padding: 0; margin-bottom: 1.5rem; border: 0; scroll-margin-top: 100px; }
.template-landing .rt-faq .rt-feature { border-color: #dce5ef; border-radius: 14px; }
.template-landing .rt-faq h3 { font-size: 1.5rem; }
.template-landing .rt-faq .a { color: var(--tl-muted); font-size: .95rem; line-height: 1.75; }

/* Keep content visible immediately; the existing reveal hooks can still run. */
.template-landing .reveal { opacity: 1; transform: none; }
@media (max-width: 991.98px) {
    .template-landing .rt-hero { padding: 3rem 0; }
    .template-landing .rt-hero .col-lg-6:first-child { text-align: center; }
    .template-landing .rt-hero h1, .template-landing .rt-hero .hero-lead { margin-left: auto !important; margin-right: auto !important; }
    .template-landing .hero-cta { justify-content: center; }
    .template-landing .hero-image { max-width: 470px; height: 460px; margin: 1rem auto 0; }
    .template-landing .templates, .template-landing .rt-band, .template-landing .rt-faq, .template-landing > section.py-5 { padding: 4rem 0 !important; }
    .template-landing .testimonials-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .template-landing .testimonials-grid > :last-child { grid-column: 1 / -1; }
    .template-landing .cta-box { flex-direction: column; text-align: center; padding: 2rem; }
    .template-landing .rt-faq .sticky-top { position: static; }
}
@media (max-width: 575.98px) {
    .template-landing .fp-template-caption h3 { font-size: 1.1rem; }
    .template-landing .container { padding-left: 1.25rem; padding-right: 1.25rem; }
    .template-landing .rt-hero h1 { font-size: clamp(2.75rem, 11vw, 3.45rem); }
    .template-landing h2, .template-landing .templates > .container > h3 { font-size: 2.5rem; }
    .template-landing .hero-cta { flex-direction: column; align-items: stretch !important; }
    .template-landing .hero-cta form, .template-landing .hero-cta .btn { width: 100%; }
    .template-landing .hero-image { height: 350px; }
    .template-landing .templates, .template-landing .rt-band, .template-landing .rt-faq, .template-landing > section.py-5 { padding: 3rem 0 !important; }
    .template-landing > section.container > .row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
    .template-landing .rt-feature, .template-landing .cta-box { padding: 1.5rem; }
    .template-landing .testimonials-grid { grid-template-columns: 1fr; }
    .template-landing .cta-panel, .template-landing .p-block-8 { padding: 3rem 0; }
    .template-landing .templates-header { margin-bottom: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
    .template-landing *, .template-landing *::before, .template-landing *::after { transition: none !important; scroll-behavior: auto !important; }
}

.cv-templates-page .rt-hero .pill { display: inline-flex; align-items: center; gap: .65rem; }
.cv-templates-page .rt-hero .pill::before { content: ''; width: 22px; height: 2px; background: currentColor; flex-shrink: 0; }
.cv-templates-page .rt-hero h1 em { color: var(--tl-accent); font-family: Georgia, 'Times New Roman', serif; font-size: .94em; font-style: italic; font-weight: 400; letter-spacing: -.06em; }

.cv-hero-preview-panel { min-width: 0; padding: 1.25rem 1.5rem; border: 1px solid #fff; border-radius: 14px; background: #ffffff80; box-shadow: 0 20px 60px #183b6310; }
.cv-hero-preview-heading { display: flex; align-items: center; gap: .5rem; color: #56718c; font-size: .62rem; letter-spacing: .09em; font-weight: 700; text-transform: uppercase; text-align: left; }
.cv-hero-preview-heading > span { width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: var(--tl-green); }
.cv-hero-preview-canvas { padding: 2rem 0; }
.cv-hero-preview-footer { padding-top: 1rem; border-top: 1px solid #d5e2ed; }
.cv-hero-preview-footer a { display: inline-flex; align-items: center; min-height: 44px; padding: .65rem .85rem; font-size: .8rem; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
@media (max-width: 991.98px) { .cv-hero-preview-panel { max-width: 560px; margin: auto; } }
@media (max-width: 575.98px) { .cv-hero-preview-panel { padding: 1rem; } .cv-hero-preview-canvas { padding: 1.5rem 0; } }

.cv-templates-page .fp-template-select { top: 50%; bottom: auto; transform: translate(-50%, -50%); }

.cv-templates-page #importresume[aria-busy="true"] button::before {
    content: '';
    width: 1.1rem;
    height: 1.1rem;
    flex: 0 0 1.1rem;
    border: 2px solid #ffffff50;
    border-top-color: #fff;
    border-radius: 50%;
    animation: cv-import-spin .8s linear infinite;
}
.cv-templates-page #importresume[aria-busy="true"] button { cursor: wait; }
@keyframes cv-import-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .cv-templates-page #importresume[aria-busy="true"] button::before { animation: none; }
}
