/* ============================================
   GUIDES — COMBINED STYLES
   Lead Magnet (.lm-), Sales Pages (.sp-),
   Thank You (.ty-)
   ============================================ */

/* ============================================
   LEAD MAGNET PAGE
   ============================================ */

/* --- Hero --- */
.lm-hero {
    padding    : 8rem 0 6rem;
    background : var(--off-white);
    text-align : center;
}

.lm-hero-content {
    max-width : 750px;
    margin    : 0 auto;
}

.lm-hero .section-eyebrow {
    justify-content : center;
}

.lm-hero-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2.5rem, 5vw, 4.2rem);
    font-weight    : 300;
    line-height    : 1.15;
    color          : var(--ink);
    letter-spacing : -0.02em;
    margin-bottom  : 1.5rem;
}

.lm-hero-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.lm-hero-sub {
    font-family   : var(--font-sans);
    font-size     : 1.1rem;
    line-height   : 1.75;
    color         : var(--ink-mid);
    max-width     : 620px;
    margin        : 0 auto;
}

/* --- What You Get --- */
.lm-features {
    padding    : var(--section-pad) 0;
    background : var(--white);
}

.lm-features-header {
    text-align    : center;
    margin-bottom : 4rem;
}

.lm-features-header .section-eyebrow {
    justify-content : center;
}

.lm-features-grid {
    display               : grid;
    grid-template-columns : repeat(3, 1fr);
    gap                   : 2rem;
}

.lm-feature-card {
    padding    : 2.5rem 2rem;
    border     : 1px solid var(--stone-mid);
    background : var(--off-white);
    transition : border-color 0.3s var(--ease), box-shadow 0.3s var(--ease);
}

.lm-feature-card:hover {
    border-color : var(--gold);
    box-shadow   : 0 8px 30px rgba(0, 0, 0, 0.04);
}

.lm-feature-icon {
    font-size     : 2rem;
    margin-bottom : 1.25rem;
    line-height   : 1;
}

.lm-feature-card h3 {
    font-family    : var(--font-serif);
    font-size      : 1.4rem;
    font-weight    : 400;
    color          : var(--ink);
    margin-bottom  : 0.75rem;
    letter-spacing : -0.01em;
}

.lm-feature-card p {
    font-size   : 0.95rem;
    line-height : 1.7;
    color       : var(--ink-mid);
}

/* --- Social Proof Bar --- */
.lm-social-proof {
    padding    : 2.5rem 0;
    background : var(--stone);
    text-align : center;
}

.lm-social-proof p {
    font-family    : var(--font-sans);
    font-size      : 0.85rem;
    font-weight    : 500;
    letter-spacing : 0.08em;
    text-transform : uppercase;
    color          : var(--ink-mid);
}

.lm-social-proof span {
    color       : var(--gold);
    font-weight : 600;
}

/* --- Email Capture --- */
.lm-capture {
    padding    : var(--section-pad) 0;
    background : var(--off-white);
}

.lm-capture-inner {
    max-width  : 600px;
    margin     : 0 auto;
    text-align : center;
}

.lm-capture-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2rem, 4vw, 3rem);
    font-weight    : 300;
    line-height    : 1.2;
    color          : var(--ink);
    letter-spacing : -0.01em;
    margin-bottom  : 1rem;
}

.lm-capture-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.lm-capture-text {
    font-size     : 1rem;
    line-height   : 1.75;
    color         : var(--ink-mid);
    margin-bottom : 2.5rem;
}

.lm-form {
    display   : flex;
    gap       : 0.75rem;
    max-width : 640px;
    margin    : 0 auto 1rem;
}

.lm-form input[type="email"] {
    flex           : 1;
    font-family    : var(--font-sans);
    font-size      : 0.9rem;
    padding        : 1rem 1.25rem;
    border         : 1px solid var(--stone-mid);
    background     : var(--white);
    color          : var(--ink);
    outline        : none;
    transition     : border-color 0.3s var(--ease);
}

.lm-form input[type="email"]::placeholder {
    color : rgba(42, 42, 42, 0.4);
}

.lm-form input[type="email"]:focus {
    border-color : var(--gold);
}

.lm-form button {
    font-family      : var(--font-sans);
    font-size        : 0.8rem;
    font-weight      : 600;
    letter-spacing   : 0.1em;
    text-transform   : uppercase;
    color            : var(--white);
    background-color : var(--ink);
    border           : 1px solid var(--ink);
    padding          : 1rem 1.75rem;
    cursor           : pointer;
    white-space      : nowrap;
    transition       : background 0.3s var(--ease), border-color 0.3s var(--ease);
}

.lm-form button:hover {
    background-color : var(--gold);
    border-color     : var(--gold);
}

.lm-privacy {
    font-size  : 0.75rem;
    color      : rgba(42, 42, 42, 0.45);
    margin-top : 0.75rem;
}

.lm-success,
.lm-error {
    font-size     : 0.95rem;
    line-height   : 1.5;
    padding       : 1rem 1.25rem;
    border-radius : 6px;
    border        : 1px solid;
    margin        : 0;
    text-align    : center;
}

.lm-success {
    color            : #1f6b3a;
    background-color : rgba(52, 168, 83, 0.08);
    border-color     : rgba(52, 168, 83, 0.35);
}

.lm-error {
    color            : #8a2a2a;
    background-color : rgba(200, 50, 50, 0.08);
    border-color     : rgba(200, 50, 50, 0.35);
    margin-top       : 0.75rem;
}

.lm-final-cta .lm-success {
    color            : #a8e6bd;
    background-color : rgba(52, 168, 83, 0.15);
    border-color     : rgba(168, 230, 189, 0.45);
}

.lm-final-cta .lm-error {
    color            : #f5b5b5;
    background-color : rgba(200, 50, 50, 0.15);
    border-color     : rgba(245, 181, 181, 0.45);
}

/* --- About --- */
.lm-about {
    padding    : var(--section-pad) 0;
    background : var(--white);
}

.lm-about-layout {
    display               : grid;
    grid-template-columns : 1fr 1.4fr;
    gap                   : 4rem;
    align-items           : center;
}

.lm-about-image-frame {
    position : relative;
}

.lm-about-photo {
    width           : 100%;
    aspect-ratio    : 4 / 5;
    object-fit      : cover;
    object-position : center top;
}

.lm-about-image-label {
    position        : absolute;
    bottom          : 0;
    left            : 0;
    right           : 0;
    padding         : 1rem 1.25rem;
    background      : rgba(14, 14, 14, 0.85);
    backdrop-filter : blur(6px);
    display         : flex;
    flex-direction  : column;
    gap             : 0.15rem;
}

.lm-about-image-label .label-name {
    font-family : var(--font-serif);
    font-size   : 1.1rem;
    font-weight : 400;
    color       : var(--white);
}

.lm-about-image-label .label-title {
    font-family    : var(--font-sans);
    font-size      : 0.7rem;
    letter-spacing : 0.12em;
    text-transform : uppercase;
    color          : var(--gold-light);
}

.lm-about-text h2 {
    font-family    : var(--font-serif);
    font-size      : clamp(2rem, 3.5vw, 2.8rem);
    font-weight    : 300;
    line-height    : 1.2;
    color          : var(--ink);
    letter-spacing : -0.01em;
    margin-bottom  : 1.5rem;
}

.lm-about-text h2 em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.lm-about-intro {
    font-size     : 1rem;
    line-height   : 1.8;
    color         : var(--ink-mid);
    margin-bottom : 2rem;
}

.lm-credential-list {
    display   : flex;
    flex-wrap : wrap;
    gap       : 0.6rem;
}

.lm-credential-tag {
    font-family    : var(--font-sans);
    font-size      : 0.7rem;
    font-weight    : 600;
    letter-spacing : 0.1em;
    text-transform : uppercase;
    padding        : 0.6rem 1.2rem;
    border         : 1px solid var(--stone-mid);
    color          : var(--ink-mid);
    background     : var(--off-white);
    transition     : border-color 0.3s var(--ease);
}

.lm-credential-tag:hover {
    border-color : var(--gold);
}

/* --- Final CTA (dark) --- */
.lm-final-cta {
    padding    : var(--section-pad) 0;
    background : var(--ink);
    text-align : center;
}

.lm-final-cta-inner {
    max-width : 650px;
    margin    : 0 auto;
}

.lm-final-cta-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2.5rem, 5vw, 4.2rem);
    font-weight    : 300;
    line-height    : 1.15;
    color          : var(--white);
    letter-spacing : -0.02em;
    margin-bottom  : 2.5rem;
}

.lm-final-cta-title em {
    font-style : italic;
    color      : var(--gold-light);
}

.lm-final-cta .lm-form input[type="email"] {
    background   : rgba(255, 255, 255, 0.06);
    border-color : rgba(255, 255, 255, 0.12);
    color        : var(--white);
}

.lm-final-cta .lm-form input[type="email"]::placeholder {
    color : rgba(255, 255, 255, 0.35);
}

.lm-final-cta .lm-form input[type="email"]:focus {
    border-color : var(--gold);
}

.lm-final-cta .lm-form button {
    background-color : var(--gold);
    border-color     : var(--gold);
    color            : var(--white);
}

.lm-final-cta .lm-form button:hover {
    background-color : var(--gold-light);
    border-color     : var(--gold-light);
}

.lm-final-cta .lm-privacy {
    color : rgba(255, 255, 255, 0.25);
}

.lm-final-cta-note {
    margin-top     : 1.5rem;
    font-size      : 0.75rem;
    letter-spacing : 0.1em;
    color          : rgba(255, 255, 255, 0.3);
    text-transform : uppercase;
}


/* ============================================
   SALES PAGES
   ============================================ */

/* --- Hero --- */
.sp-hero {
    padding    : 8rem 0 6rem;
    background : var(--off-white);
    text-align : center;
}

.sp-hero-content {
    max-width : 800px;
    margin    : 0 auto;
}

.sp-hero .section-eyebrow {
    justify-content : center;
}

.sp-hero-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2.5rem, 5vw, 4.2rem);
    font-weight    : 300;
    line-height    : 1.15;
    color          : var(--ink);
    letter-spacing : -0.02em;
    margin-bottom  : 1.5rem;
}

.sp-hero-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.sp-hero-sub {
    font-family : var(--font-sans);
    font-size   : 1.15rem;
    line-height : 1.75;
    color       : var(--ink-mid);
    max-width   : 640px;
    margin      : 0 auto 2.5rem;
}

.sp-cta-btn {
    display          : inline-block;
    font-family      : var(--font-sans);
    font-size        : 0.85rem;
    font-weight      : 600;
    letter-spacing   : 0.1em;
    text-transform   : uppercase;
    color            : var(--white);
    background-color : var(--ink);
    border           : 1px solid var(--ink);
    padding          : 1.1rem 2.5rem;
    text-decoration  : none;
    cursor           : pointer;
    transition       : background 0.3s var(--ease), border-color 0.3s var(--ease);
}

.sp-cta-btn:hover {
    background-color : var(--gold);
    border-color     : var(--gold);
}

.sp-cta-btn.light {
    background-color : var(--gold);
    border-color     : var(--gold);
}

.sp-cta-btn.light:hover {
    background-color : var(--gold-light);
    border-color     : var(--gold-light);
}

/* --- Pain Points --- */
.sp-pain {
    padding    : var(--section-pad) 0;
    background : var(--ink);
}

.sp-pain-header {
    text-align    : center;
    margin-bottom : 4rem;
}

.sp-pain-grid {
    display               : grid;
    grid-template-columns : repeat(2, 1fr);
    gap                   : 1.5rem;
    max-width             : 900px;
    margin                : 0 auto;
}

.sp-pain-card {
    padding    : 2.5rem 2rem;
    border     : 1px solid rgba(255, 255, 255, 0.08);
    background : rgba(255, 255, 255, 0.03);
    transition : border-color 0.3s var(--ease);
}

.sp-pain-card:hover {
    border-color : var(--gold);
}

.sp-pain-card h3 {
    font-family    : var(--font-serif);
    font-size      : 1.35rem;
    font-weight    : 400;
    color          : var(--white);
    margin-bottom  : 0.75rem;
    letter-spacing : -0.01em;
}

.sp-pain-card p {
    font-size   : 0.95rem;
    line-height : 1.7;
    color       : rgba(255, 255, 255, 0.55);
}

/* --- Solution --- */
.sp-solution {
    padding    : var(--section-pad) 0;
    background : var(--off-white);
    text-align : center;
}

.sp-solution-inner {
    max-width : 720px;
    margin    : 0 auto;
}

.sp-solution .section-eyebrow {
    justify-content : center;
}

.sp-solution-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2rem, 4vw, 3.2rem);
    font-weight    : 300;
    line-height    : 1.2;
    color          : var(--ink);
    letter-spacing : -0.01em;
    margin-bottom  : 1.5rem;
}

.sp-solution-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.sp-solution-text {
    font-size     : 1.05rem;
    line-height   : 1.8;
    color         : var(--ink-mid);
    margin-bottom : 2.5rem;
}

/* --- What's Inside --- */
.sp-inside {
    padding    : var(--section-pad) 0;
    background : var(--white);
}

.sp-inside-header {
    text-align    : center;
    margin-bottom : 4rem;
}

.sp-inside .section-eyebrow {
    justify-content : center;
}

.sp-guide-list {
    display        : flex;
    flex-direction : column;
    gap            : 2rem;
    max-width      : 900px;
    margin         : 0 auto;
}

.sp-guide-item {
    display               : grid;
    grid-template-columns : 80px 1fr;
    gap                   : 2rem;
    padding               : 2.5rem;
    border                : 1px solid var(--stone-mid);
    background            : var(--off-white);
    transition            : border-color 0.3s var(--ease), box-shadow 0.3s var(--ease);
}

.sp-guide-item:hover {
    border-color : var(--gold);
    box-shadow   : 0 8px 30px rgba(0, 0, 0, 0.04);
}

.sp-guide-number {
    font-family    : var(--font-serif);
    font-size      : 2.8rem;
    font-weight    : 300;
    color          : var(--gold);
    line-height    : 1;
    letter-spacing : -0.02em;
}

.sp-guide-item h3 {
    font-family    : var(--font-serif);
    font-size      : 1.5rem;
    font-weight    : 400;
    color          : var(--ink);
    margin-bottom  : 0.75rem;
    letter-spacing : -0.01em;
}

.sp-guide-tags {
    display    : flex;
    flex-wrap  : wrap;
    gap        : 0.5rem;
    margin-top : 1rem;
}

.sp-guide-tag {
    font-family    : var(--font-sans);
    font-size      : 0.7rem;
    font-weight    : 600;
    letter-spacing : 0.08em;
    text-transform : uppercase;
    padding        : 0.45rem 0.9rem;
    border         : 1px solid var(--stone-mid);
    color          : var(--ink-mid);
    background     : var(--white);
}

.sp-guide-item p {
    font-size   : 0.95rem;
    line-height : 1.7;
    color       : var(--ink-mid);
}

/* --- Price Reveal --- */
.sp-price {
    padding    : var(--section-pad) 0;
    background : var(--stone);
    text-align : center;
}

.sp-price-inner {
    max-width : 700px;
    margin    : 0 auto;
}

.sp-price .section-eyebrow {
    justify-content : center;
}

.sp-price-amount {
    font-family    : var(--font-serif);
    font-size      : clamp(3.5rem, 7vw, 5.5rem);
    font-weight    : 300;
    color          : var(--ink);
    letter-spacing : -0.03em;
    line-height    : 1;
    margin-bottom  : 0.75rem;
}

.sp-price-label {
    font-family   : var(--font-sans);
    font-size     : 1.1rem;
    color         : var(--ink-mid);
    margin-bottom : 1rem;
}

.sp-price-value {
    font-size     : 0.9rem;
    color         : var(--ink-mid);
    line-height   : 1.7;
    margin-bottom : 2.5rem;
}

/* --- Testimonials --- */
.sp-testimonials {
    padding    : var(--section-pad) 0;
    background : var(--off-white);
}

.sp-testimonials-header {
    text-align    : center;
    margin-bottom : 4rem;
}

.sp-testimonials .section-eyebrow {
    justify-content : center;
}

.sp-testimonials-grid {
    display               : grid;
    grid-template-columns : repeat(2, 1fr);
    gap                   : 2px;
    background            : var(--stone-mid);
}

.sp-testimonial {
    background : var(--off-white);
    padding    : 3rem 2.5rem;
    transition : background 0.3s var(--ease);
}

.sp-testimonial:hover {
    background : var(--white);
}

.sp-testimonial-body {
    margin-bottom : 2rem;
}

.sp-testimonial-body p {
    font-family : var(--font-serif);
    font-size   : clamp(1rem, 1.3vw, 1.15rem);
    font-weight : 400;
    line-height : 1.7;
    color       : var(--ink-soft);
    font-style  : italic;
}

.sp-testimonial-footer {
    padding-top : 1.5rem;
    border-top  : 1px solid var(--stone-mid);
}

.sp-testimonial-name {
    font-family   : var(--font-sans);
    font-size     : 0.85rem;
    font-weight   : 600;
    color         : var(--ink);
    margin-bottom : 0.2rem;
}

.sp-testimonial-role {
    font-size      : 0.78rem;
    color          : #888;
    letter-spacing : 0.03em;
}

/* --- FAQ --- */
.sp-faq {
    padding    : var(--section-pad) 0;
    background : var(--white);
}

.sp-faq-header {
    text-align    : center;
    margin-bottom : 4rem;
}

.sp-faq .section-eyebrow {
    justify-content : center;
}

.sp-faq-list {
    max-width : 780px;
    margin    : 0 auto;
}

.sp-faq-item {
    border-bottom : 1px solid var(--stone-mid);
    padding       : 2rem 0;
}

.sp-faq-item:first-child {
    border-top : 1px solid var(--stone-mid);
}

.sp-faq-question {
    font-family    : var(--font-serif);
    font-size      : 1.3rem;
    font-weight    : 400;
    color          : var(--ink);
    margin-bottom  : 0.75rem;
    letter-spacing : -0.01em;
    cursor         : pointer;
}

.sp-faq-answer {
    font-size   : 0.95rem;
    line-height : 1.75;
    color       : var(--ink-mid);
}

/* --- Guarantee --- */
.sp-guarantee {
    padding    : var(--section-pad) 0;
    background : var(--stone);
    text-align : center;
}

.sp-guarantee-inner {
    max-width : 650px;
    margin    : 0 auto;
}

.sp-guarantee .section-eyebrow {
    justify-content : center;
}

.sp-guarantee-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2rem, 4vw, 3rem);
    font-weight    : 300;
    line-height    : 1.2;
    color          : var(--ink);
    letter-spacing : -0.01em;
    margin-bottom  : 1.5rem;
}

.sp-guarantee-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.sp-guarantee-text {
    font-size   : 1rem;
    line-height : 1.8;
    color       : var(--ink-mid);
}

/* --- Final CTA --- */
.sp-final-cta {
    padding    : var(--section-pad) 0;
    background : var(--ink);
    text-align : center;
}

.sp-final-cta-inner {
    max-width : 700px;
    margin    : 0 auto;
}

.sp-final-cta-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2.5rem, 5vw, 4.2rem);
    font-weight    : 300;
    line-height    : 1.15;
    color          : var(--white);
    letter-spacing : -0.02em;
    margin-bottom  : 1.5rem;
}

.sp-final-cta-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold-light);
}

.sp-final-cta-sub {
    font-size     : 1rem;
    line-height   : 1.75;
    color         : rgba(255, 255, 255, 0.5);
    margin-bottom : 2.5rem;
}

.sp-final-cta-note {
    margin-top     : 1.5rem;
    font-size      : 0.75rem;
    letter-spacing : 0.1em;
    color          : rgba(255, 255, 255, 0.3);
    text-transform : uppercase;
}


/* ============================================
   THANK YOU PAGE
   ============================================ */

.ty-hero {
    padding    : 8rem 0 4rem;
    background : var(--off-white);
    text-align : center;
}

.ty-hero-content {
    max-width : 700px;
    margin    : 0 auto;
}

.ty-hero .section-eyebrow {
    justify-content : center;
}

.ty-hero-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2.5rem, 5vw, 4.2rem);
    font-weight    : 300;
    line-height    : 1.15;
    color          : var(--ink);
    letter-spacing : -0.02em;
    margin-bottom  : 1.5rem;
}

.ty-hero-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.ty-hero-sub {
    font-family : var(--font-sans);
    font-size   : 1.1rem;
    line-height : 1.75;
    color       : var(--ink-mid);
    max-width   : 580px;
    margin      : 0 auto;
}

.ty-hero-sub a {
    color                    : var(--ink);
    text-decoration          : none;
    border-bottom            : 1px solid var(--gold);
    padding-bottom           : 1px;
    transition               : color 0.3s var(--ease), border-color 0.3s var(--ease);
}

.ty-hero-sub a:hover {
    color         : var(--gold);
    border-color  : var(--gold);
}

/* --- Downloads --- */
.ty-downloads {
    padding    : var(--section-pad) 0;
    background : var(--white);
}

.ty-downloads-header {
    text-align    : center;
    margin-bottom : 3rem;
}

.ty-downloads .section-eyebrow {
    justify-content : center;
}

.ty-download-grid {
    display               : grid;
    grid-template-columns : repeat(2, 1fr);
    gap                   : 1.5rem;
    max-width             : 800px;
    margin                : 0 auto;
}

.ty-download-card {
    display         : flex;
    align-items     : center;
    gap             : 1.5rem;
    padding         : 2rem;
    border          : 1px solid var(--stone-mid);
    background      : var(--off-white);
    text-decoration : none;
    transition      : border-color 0.3s var(--ease), box-shadow 0.3s var(--ease);
}

.ty-email-card {
    max-width  : 640px;
    margin     : 0 auto;
    padding    : 2.5rem 2.75rem;
    border     : 1px solid var(--stone-mid);
    background : var(--off-white);
    text-align : center;
}

.ty-email-lead {
    font-family : var(--font-sans);
    font-size   : 1.05rem;
    line-height : 1.6;
    color       : var(--ink);
    margin      : 0 0 1.5rem;
}

.ty-email-note {
    font-family : var(--font-sans);
    font-size   : 0.9rem;
    line-height : 1.6;
    color       : rgba(42, 42, 42, 0.7);
    margin      : 0 0 0.75rem;
}

.ty-email-note:last-child {
    margin-bottom : 0;
}

.ty-email-note a {
    color           : var(--gold);
    text-decoration : underline;
}

.ty-download-card:hover {
    border-color : var(--gold);
    box-shadow   : 0 8px 30px rgba(0, 0, 0, 0.04);
}

.ty-download-number {
    font-family : var(--font-serif);
    font-size   : 2.2rem;
    font-weight : 300;
    color       : var(--gold);
    line-height : 1;
    flex-shrink : 0;
}

.ty-download-info h3 {
    font-family   : var(--font-serif);
    font-size     : 1.2rem;
    font-weight   : 400;
    color         : var(--ink);
    margin-bottom : 0.35rem;
}

.ty-download-info p {
    font-size      : 0.75rem;
    font-weight    : 600;
    letter-spacing : 0.08em;
    text-transform : uppercase;
    color          : var(--gold);
}

/* --- Start Here --- */
.ty-start {
    padding    : var(--section-pad) 0;
    background : var(--stone);
}

.ty-start-inner {
    max-width  : 700px;
    margin     : 0 auto;
    text-align : center;
}

.ty-start .section-eyebrow {
    justify-content : center;
}

.ty-start-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2rem, 4vw, 3rem);
    font-weight    : 300;
    line-height    : 1.2;
    color          : var(--ink);
    letter-spacing : -0.01em;
    margin-bottom  : 1.5rem;
}

.ty-start-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.ty-start-text {
    font-size     : 1rem;
    line-height   : 1.8;
    color         : var(--ink-mid);
    margin-bottom : 0.5rem;
}

.ty-start-steps {
    display        : flex;
    flex-direction : column;
    gap            : 1.25rem;
    max-width      : 520px;
    margin         : 2.5rem auto 0;
    text-align     : left;
}

.ty-start-step {
    display     : flex;
    gap         : 1.25rem;
    align-items : flex-start;
}

.ty-step-number {
    font-family : var(--font-serif);
    font-size   : 1.6rem;
    font-weight : 300;
    color       : var(--gold);
    line-height : 1.2;
    flex-shrink : 0;
}

.ty-step-text {
    font-size   : 0.95rem;
    line-height : 1.7;
    color       : var(--ink-mid);
}

.ty-step-text strong {
    color       : var(--ink);
    font-weight : 600;
}

/* --- Notes --- */
.ty-notes {
    padding    : 3rem 0;
    background : var(--off-white);
    text-align : center;
}

.ty-notes-inner {
    max-width : 600px;
    margin    : 0 auto;
}

.ty-note {
    font-size     : 0.9rem;
    line-height   : 1.7;
    color         : var(--ink-mid);
    margin-bottom : 0.75rem;
}

.ty-note:last-child {
    margin-bottom : 0;
}

.ty-note a {
    color           : var(--gold);
    text-decoration : none;
    border-bottom   : 1px solid transparent;
    transition      : border-color 0.3s var(--ease);
}

.ty-note a:hover {
    border-bottom-color : var(--gold);
}

/* --- Error State --- */
.ty-error {
    padding    : 8rem 0;
    background : var(--off-white);
    text-align : center;
}

.ty-error-inner {
    max-width : 600px;
    margin    : 0 auto;
}

.ty-error .section-eyebrow {
    justify-content : center;
}

.ty-error-title {
    font-family    : var(--font-serif);
    font-size      : clamp(2.5rem, 5vw, 4rem);
    font-weight    : 300;
    line-height    : 1.15;
    color          : var(--ink);
    letter-spacing : -0.02em;
    margin-bottom  : 1.5rem;
}

.ty-error-title em {
    font-style  : italic;
    font-weight : 300;
    color       : var(--gold);
}

.ty-error-text {
    font-size     : 1.05rem;
    line-height   : 1.75;
    color         : var(--ink-mid);
    margin-bottom : 2.5rem;
}

.ty-error-btn {
    display          : inline-block;
    font-family      : var(--font-sans);
    font-size        : 0.85rem;
    font-weight      : 600;
    letter-spacing   : 0.1em;
    text-transform   : uppercase;
    color            : var(--white);
    background-color : var(--ink);
    border           : 1px solid var(--ink);
    padding          : 1.1rem 2.5rem;
    text-decoration  : none;
    transition       : background 0.3s var(--ease), border-color 0.3s var(--ease);
}

.ty-error-btn:hover {
    background-color : var(--gold);
    border-color     : var(--gold);
}

.ty-download-btn {
    display          : inline-block;
    font-family      : var(--font-sans);
    font-size        : 0.9rem;
    font-weight      : 600;
    letter-spacing   : 0.1em;
    text-transform   : uppercase;
    color            : var(--white);
    background-color : var(--ink);
    border           : 1px solid var(--ink);
    padding          : 1.2rem 2.75rem;
    text-decoration  : none;
    transition       : background 0.3s var(--ease), border-color 0.3s var(--ease);
}

.ty-download-btn:hover {
    background-color : var(--gold);
    border-color     : var(--gold);
}


/* --- Discount & Urgency --- */
.sp-urgency-bar {
    padding    : 1rem 0;
    background : var(--gold);
    text-align : center;
}

.sp-urgency-text {
    font-family    : var(--font-sans);
    font-size      : 0.85rem;
    font-weight    : 600;
    letter-spacing : 0.06em;
    text-transform : uppercase;
    color          : var(--white);
    margin         : 0;
}

.sp-countdown {
    font-family    : var(--font-sans);
    font-weight    : 700;
    letter-spacing : 0.12em;
}

.sp-discount-badge {
    display        : inline-block;
    font-family    : var(--font-sans);
    font-size      : 0.75rem;
    font-weight    : 700;
    letter-spacing : 0.15em;
    text-transform : uppercase;
    color          : var(--white);
    background     : var(--gold);
    padding        : 0.5rem 1.5rem;
    margin-bottom  : 1.5rem;
}

.sp-price-original {
    text-decoration : line-through;
    color           : #999;
    font-size       : 0.5em;
    margin-right    : 0.5rem;
}

.cta-original-price {
    text-decoration : line-through;
    opacity         : 0.5;
    margin-left     : 0.5rem;
    font-weight     : 400;
}


/* ============================================
   RESPONSIVE — ALL GUIDE PAGES
   ============================================ */

@media (max-width: 900px) {
    .lm-features-grid {
        grid-template-columns : 1fr;
        max-width             : 500px;
        margin                : 0 auto;
    }

    .lm-about-layout {
        grid-template-columns : 1fr;
        gap                   : 2.5rem;
    }

    .lm-about-image-frame {
        max-width : 400px;
        margin    : 0 auto;
    }

    .sp-pain-grid {
        grid-template-columns : 1fr;
        max-width             : 500px;
        margin                : 0 auto;
    }

    .sp-testimonials-grid {
        grid-template-columns : 1fr;
    }

    .sp-guide-item {
        grid-template-columns : 60px 1fr;
        gap                   : 1.5rem;
    }
}

@media (max-width: 700px) {
    .ty-download-grid {
        grid-template-columns : 1fr;
    }
}

@media (max-width: 600px) {
    .lm-hero {
        padding : 5rem 0 4rem;
    }

    .lm-form {
        flex-direction : column;
    }

    .lm-form button {
        width   : 100%;
        padding : 1rem;
    }

    .sp-hero {
        padding : 5rem 0 4rem;
    }

    .sp-guide-item {
        grid-template-columns : 1fr;
        gap                   : 0.75rem;
    }

    .sp-guide-number {
        font-size : 2rem;
    }

    .sp-testimonial {
        padding : 2rem 1.5rem;
    }

    .sp-pain-card {
        padding : 2rem 1.5rem;
    }

    .ty-hero {
        padding : 5rem 0 3rem;
    }

    .ty-error {
        padding : 5rem 0;
    }

    .ty-download-card {
        padding : 1.5rem;
    }
}