/* LeadTide.ai — shared styles for content pages (trade pages, guides, about,
   reviews, live demo). Plain CSS on top of dist/output.css so new pages need
   no Tailwind rebuild. Colors match tailwind.config.js tokens:
   ink #12161B, paper #FAF7F1 / #F1ECE0, tide #1E7F72 / #175F56, gold #C9A567. */

.lt-crumbs { font-size: 0.8rem; color: rgba(18,22,27,0.55); }
.lt-crumbs ol { display: flex; flex-wrap: wrap; gap: 0.35rem; list-style: none; margin: 0; padding: 0; }
.lt-crumbs li + li::before { content: "/"; margin-right: 0.35rem; color: rgba(18,22,27,0.3); }
.lt-crumbs a { color: rgba(18,22,27,0.6); text-decoration: none; }
.lt-crumbs a:hover { color: #12161B; text-decoration: underline; }

.lt-hero { padding: 2.5rem 0 2.75rem; }
@media (min-width: 640px) { .lt-hero { padding: 3.5rem 0 3.5rem; } }
.lt-h1 { font-family: Lora, Georgia, serif; font-weight: 500; color: #12161B; font-size: clamp(2rem, 4.6vw, 3.1rem); line-height: 1.12; letter-spacing: -0.01em; text-wrap: balance; margin-top: 1rem; max-width: 50rem; }
.lt-lede { margin-top: 1.1rem; font-size: 1.15rem; line-height: 1.6; color: rgba(18,22,27,0.75); max-width: 44rem; }
.lt-hero-ctas { margin-top: 1.75rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.9rem 1.25rem; }
.lt-textlink { font-size: 0.95rem; font-weight: 600; color: #175F56; text-decoration: underline; text-underline-offset: 3px; }
.lt-textlink:hover { color: #0F3B35; }
.lt-meta { margin-top: 1rem; font-size: 0.82rem; color: rgba(18,22,27,0.55); }

.lt-section { padding: 3.5rem 0; border-top: 1px solid rgba(18,22,27,0.08); }
.lt-section--tint { background: #F1ECE0; }
@media (min-width: 640px) { .lt-section { padding: 4.5rem 0; } }
.lt-h2 { font-family: Lora, Georgia, serif; font-weight: 500; color: #12161B; font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.2; text-wrap: balance; }
.lt-h3 { font-family: Lora, Georgia, serif; font-weight: 500; color: #12161B; font-size: 1.2rem; line-height: 1.3; }
.lt-sub { margin-top: 0.75rem; color: rgba(18,22,27,0.68); max-width: 44rem; line-height: 1.65; }

/* Long-form reading column */
.lt-prose { max-width: 46rem; color: rgba(18,22,27,0.82); font-size: 1.02rem; line-height: 1.75; }
.lt-prose > * + * { margin-top: 1.05rem; }
.lt-prose h2 { font-family: Lora, Georgia, serif; font-weight: 500; color: #12161B; font-size: clamp(1.4rem, 2.6vw, 1.8rem); line-height: 1.25; margin-top: 2.6rem; }
.lt-prose h3 { font-family: Lora, Georgia, serif; font-weight: 500; color: #12161B; font-size: 1.2rem; line-height: 1.35; margin-top: 1.9rem; }
.lt-prose ul, .lt-prose ol { padding-left: 1.3rem; }
.lt-prose ul { list-style: disc; }
.lt-prose ol { list-style: decimal; }
.lt-prose li + li { margin-top: 0.45rem; }
.lt-prose a { color: #175F56; text-decoration: underline; text-underline-offset: 2px; }
.lt-prose a:hover { color: #0F3B35; }
.lt-prose strong { color: #12161B; }
.lt-prose blockquote { border-left: 3px solid #C9A567; padding: 0.2rem 0 0.2rem 1rem; color: rgba(18,22,27,0.75); }

.lt-answer { background: #fff; border: 1px solid rgba(18,22,27,0.1); border-left: 4px solid #1E7F72; border-radius: 0.9rem; padding: 1.1rem 1.25rem; font-size: 1.02rem; line-height: 1.65; color: rgba(18,22,27,0.85); max-width: 46rem; }
.lt-answer strong { color: #12161B; }
.lt-note { background: #F1ECE0; border-radius: 0.8rem; padding: 0.9rem 1.1rem; font-size: 0.9rem; line-height: 1.6; color: rgba(18,22,27,0.72); }

.lt-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem; margin-top: 2rem; }
@media (min-width: 720px) { .lt-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lt-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .lt-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.lt-card { background: #fff; border: 1px solid rgba(18,22,27,0.1); border-radius: 1rem; padding: 1.35rem 1.4rem; box-shadow: 0 2px 10px -2px rgba(18,22,27,0.08); }
.lt-card p { margin-top: 0.5rem; font-size: 0.95rem; line-height: 1.6; color: rgba(18,22,27,0.7); }
.lt-card ul { margin-top: 0.6rem; padding-left: 1.1rem; list-style: disc; font-size: 0.93rem; line-height: 1.6; color: rgba(18,22,27,0.72); }
.lt-card ul li + li { margin-top: 0.3rem; }
.lt-card .lt-piece { margin-top: 0.3rem; font-size: 0.82rem; font-weight: 700; color: #175F56; }
a.lt-card { display: block; text-decoration: none; transition: transform 200ms ease, box-shadow 200ms ease; }
a.lt-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px -14px rgba(18,22,27,0.28); }
a.lt-card .lt-go { display: inline-block; margin-top: 0.75rem; font-size: 0.88rem; font-weight: 600; color: #175F56; }

/* Tables */
.lt-table-wrap { overflow-x: auto; margin-top: 1.25rem; border: 1px solid rgba(18,22,27,0.1); border-radius: 0.9rem; background: #fff; }
.lt-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; line-height: 1.5; min-width: 34rem; }
.lt-table th, .lt-table td { text-align: left; vertical-align: top; padding: 0.75rem 0.9rem; border-bottom: 1px solid rgba(18,22,27,0.08); }
.lt-table th { background: #F1ECE0; font-weight: 700; color: #12161B; font-size: 0.85rem; }
.lt-table tr:last-child td { border-bottom: 0; }
.lt-table td { color: rgba(18,22,27,0.78); }

/* Sample conversation (clearly labeled as illustrative, never as a recording) */
.lt-convo { max-width: 40rem; background: #fff; border: 1px solid rgba(18,22,27,0.1); border-radius: 1rem; padding: 1.2rem; margin-top: 1.25rem; }
.lt-convo-label { font-size: 0.8rem; color: rgba(18,22,27,0.55); margin-bottom: 0.8rem; }
.lt-msg { max-width: 88%; padding: 0.65rem 0.9rem; border-radius: 1rem; font-size: 0.93rem; line-height: 1.5; margin-top: 0.55rem; }
.lt-msg b { display: block; font-size: 0.72rem; font-weight: 700; margin-bottom: 0.15rem; opacity: 0.7; }
.lt-msg--caller { background: #F1ECE0; color: #12161B; border-bottom-left-radius: 0.3rem; }
.lt-msg--ai { background: #1E7F72; color: #fff; margin-left: auto; border-bottom-right-radius: 0.3rem; }
.lt-msg--sys { background: transparent; color: rgba(18,22,27,0.6); font-size: 0.82rem; font-style: italic; max-width: 100%; text-align: center; padding: 0.3rem; }

/* Templates (copyable text blocks) */
.lt-template { background: #fff; border: 1px dashed rgba(18,22,27,0.22); border-radius: 0.8rem; padding: 0.9rem 1rem; font-size: 0.95rem; line-height: 1.6; color: #12161B; margin-top: 0.6rem; }
.lt-template-label { font-size: 0.82rem; font-weight: 700; color: #175F56; margin-top: 1.2rem; }

/* Price summary */
.lt-prices { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; margin-top: 1.5rem; max-width: 52rem; }
@media (min-width: 720px) { .lt-prices { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.lt-price { background: #fff; border: 1px solid rgba(18,22,27,0.1); border-radius: 1rem; padding: 1.2rem 1.25rem; }
.lt-price--featured { border-color: rgba(30,127,114,0.45); box-shadow: 0 0 0 1px rgba(30,127,114,0.2); }
.lt-price-name { font-size: 0.85rem; font-weight: 700; color: #175F56; }
.lt-price-amt { font-family: Lora, Georgia, serif; font-size: 1.7rem; color: #12161B; margin-top: 0.3rem; }
.lt-price-amt small { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.8rem; color: rgba(18,22,27,0.55); }
.lt-price p { margin-top: 0.35rem; font-size: 0.88rem; line-height: 1.55; color: rgba(18,22,27,0.68); }

/* Steps */
.lt-steps { counter-reset: lt-step; margin-top: 1.5rem; display: grid; gap: 0.9rem; max-width: 46rem; }
.lt-step { position: relative; padding: 1rem 1.1rem 1rem 3.4rem; background: #fff; border: 1px solid rgba(18,22,27,0.1); border-radius: 0.9rem; font-size: 0.97rem; line-height: 1.6; color: rgba(18,22,27,0.78); }
.lt-step::before { counter-increment: lt-step; content: counter(lt-step); position: absolute; left: 1rem; top: 1rem; width: 1.6rem; height: 1.6rem; border-radius: 999px; background: #1E7F72; color: #fff; font-size: 0.82rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.lt-step strong { color: #12161B; }

/* Review cards */
.lt-review { background: #fff; border-radius: 0.9rem; padding: 1.2rem 1.3rem; box-shadow: 0 1px 2px rgba(18,22,27,0.06), 0 12px 30px -10px rgba(18,22,27,0.2); }
.lt-review blockquote { margin-top: 0.6rem; font-size: 0.97rem; line-height: 1.65; color: rgba(18,22,27,0.8); }
.lt-review figcaption { font-weight: 700; color: #12161B; font-size: 0.95rem; }
.lt-review figcaption small { display: block; font-weight: 400; font-size: 0.8rem; color: rgba(18,22,27,0.55); }
.lt-stars { display: flex; gap: 2px; margin-top: 0.4rem; }

/* FAQ (details) */
.lt-faq { margin-top: 1.75rem; display: grid; gap: 0.75rem; max-width: 46rem; }
.lt-faq details { background: #fff; border: 1px solid rgba(18,22,27,0.1); border-radius: 1rem; padding: 1.1rem 1.25rem; }
.lt-faq summary { cursor: pointer; list-style: none; font-weight: 600; color: #12161B; display: flex; justify-content: space-between; gap: 1rem; }
.lt-faq summary::-webkit-details-marker { display: none; }
.lt-faq summary::after { content: "+"; font-weight: 400; font-size: 1.3rem; line-height: 1; color: rgba(18,22,27,0.45); }
.lt-faq details[open] summary::after { content: "\2013"; }
.lt-faq details p { margin-top: 0.7rem; font-size: 0.95rem; line-height: 1.65; color: rgba(18,22,27,0.7); }
.lt-faq details a { color: #175F56; text-decoration: underline; }

/* Closing CTA band */
.lt-cta-band { padding: 4rem 0; text-align: center; border-top: 1px solid rgba(18,22,27,0.08); background: radial-gradient(560px circle at 50% 40%, rgba(30,127,114,0.14), transparent 70%); }
.lt-cta-band p { margin: 0.9rem auto 0; max-width: 36rem; color: rgba(18,22,27,0.7); line-height: 1.6; }
.lt-cta-band .lt-hero-ctas { justify-content: center; }

/* Founder block */
.lt-founder { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; align-items: center; }
@media (min-width: 900px) { .lt-founder { grid-template-columns: 0.7fr 1.3fr; } }
.lt-founder img { width: 100%; max-width: 300px; height: auto; margin: 0 auto; display: block; }

/* Sources list */
.lt-sources { font-size: 0.85rem; line-height: 1.6; color: rgba(18,22,27,0.65); max-width: 46rem; }
.lt-sources li + li { margin-top: 0.4rem; }
.lt-sources a { color: #175F56; text-decoration: underline; word-break: break-word; }

/* Footer extras */
.lt-foot-contact { margin-top: 1.1rem; font-size: 0.875rem; line-height: 1.9; color: rgba(18,22,27,0.7); }
.lt-foot-contact a:hover { color: #12161B; }