/* Additional interior-page components: pricing, contact, security, changelog. */
/* Loaded after interior.css on pricing.html, about.html, contact.html, faq.html, security.html, changelog.html only. */

/* Shared callout box (used on pricing.html + security.html) */
.callout{border-left:2px solid #f2fca7;padding:5px 0 5px 25px;margin:45px 0;max-width:740px}
.callout p{font-size:16px;margin:8px 0}
.callout p:first-child{margin-top:0}
.fineprint{font-size:13px;opacity:.7;max-width:700px;margin-top:16px}

/* Pricing: billing toggle */
.billing-toggle{display:flex;gap:10px;flex-wrap:wrap;margin:40px 0 10px}
.billing-toggle button{font:inherit;font-size:15px;border:1px solid #ffffff88;background:none;color:#fff;padding:13px 22px;border-radius:30px;cursor:pointer}
.billing-toggle button span{margin-left:8px;font-size:12px;color:#f2fca7}
.billing-toggle button[aria-pressed=true]{background:#f2fca7;color:#30217f;border-color:#f2fca7}
.billing-toggle button[aria-pressed=true] span{color:#30217f}

/* Pricing: tier cards */
.tier-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:35px;align-items:stretch}
.tier-card{border:1px solid #ffffff35;border-radius:22px;padding:32px 26px;display:flex;flex-direction:column;gap:16px;background:#ffffff08;position:relative}
.tier-card.featured{border-color:#f2fca7;background:#f2fca712}
.tier-badge{position:absolute;top:-14px;left:26px;background:#f2fca7;color:#30217f;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 14px;border-radius:20px}
.tier-name{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#f2fca7;margin:0}
.tier-price{font-size:44px;font-weight:500;letter-spacing:-.04em;line-height:1}
.tier-price small{font-size:15px;font-weight:400;opacity:.7;letter-spacing:0}
.tier-price .price-period-annual{display:none}
[data-billing=annual] .tier-price .price-period-monthly{display:none}
[data-billing=annual] .tier-price .price-period-annual{display:inline}
.tier-sub{font-size:14px;opacity:.85;margin:0}
.tier-minutes{font-size:14px;font-weight:700;color:#f2fca7;margin:0}
.tier-features{list-style:none;padding:0;margin:6px 0 0;display:flex;flex-direction:column;gap:11px;font-size:14.5px;flex:1}
.tier-features li{padding-left:22px;position:relative;line-height:1.4}
.tier-features li:before{content:'+';position:absolute;left:0;color:#f2fca7}
.tier-cta{display:block;text-align:center;background:#f2fca7;color:#30217f;padding:14px;border-radius:30px;font-weight:700;font-size:14.5px;margin-top:auto}
.tier-card.team{border-style:dashed}
.tier-card.team .tier-cta{background:none;border:1px solid #ffffff88;color:#fff}

/* Pricing: comparison table */
.table-scroll{overflow-x:auto;margin-top:60px}
.compare-table{width:100%;min-width:760px;border-collapse:collapse;font-size:14.5px}
.compare-table th,.compare-table td{padding:16px 14px;text-align:left;border-top:1px solid #ffffff30}
.compare-table thead th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#f2fca7;border-top:0;vertical-align:bottom}
.compare-table td:not(:first-child),.compare-table th:not(:first-child){text-align:center}
.compare-table tbody th{font-weight:400}
.compare-table .category-row th{padding:34px 14px 10px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#f2fca7;border-top:1px solid #ffffff55}

/* Contact */
.contact-card{border:1px solid #ffffff35;border-radius:24px;padding:48px;margin-top:45px;display:flex;flex-direction:column;gap:18px;align-items:flex-start;max-width:640px}
.contact-card a.text-link{font-size:clamp(26px,4vw,42px);font-weight:500;letter-spacing:-.03em;color:#f2fca7;border-bottom-width:1px;padding:0 0 8px}
.contact-card p{margin:0;font-size:16px;opacity:.85}

/* Security / sub-processors */
.subprocessor-list{list-style:none;padding:0;margin:35px 0 0;display:flex;flex-direction:column}
.subprocessor-list li{display:grid;grid-template-columns:220px 1fr;gap:25px;border-top:1px solid #ffffff30;padding:22px 0;font-size:15px}
.subprocessor-list strong{font-size:17px;font-weight:500}

/* Changelog */
.changelog-list{margin-top:45px;display:flex;flex-direction:column}
.changelog-entry{border-top:1px solid #ffffff30;padding:36px 0;display:grid;grid-template-columns:150px 1fr;gap:30px}
.changelog-date{font-size:13px;letter-spacing:.08em;color:#f2fca7;padding-top:5px}
.changelog-tag{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:#ffffff18;padding:5px 12px;border-radius:20px;margin-bottom:14px}
.changelog-entry h3{margin-bottom:10px}
.changelog-entry p{margin-bottom:0}

/* About */
.placeholder-note{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#30217f;background:#f2fca7;padding:5px 10px;border-radius:14px;margin-bottom:10px}
.refine .placeholder-note,.learn .placeholder-note,.practice .placeholder-note{background:#30217f;color:#f2fca7}
blockquote.founder-quote{border-left:2px solid #f2fca7;margin:35px 0;padding:5px 0 5px 25px;font-size:clamp(22px,2.6vw,32px);line-height:1.3;letter-spacing:-.02em;max-width:740px}
.refine blockquote.founder-quote,.learn blockquote.founder-quote,.practice blockquote.founder-quote{border-left-color:#30217f}

@media(max-width:900px){.tier-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.tier-grid{grid-template-columns:1fr}.changelog-entry{grid-template-columns:1fr;gap:8px}.contact-card{padding:30px}.subprocessor-list li{grid-template-columns:1fr;gap:6px}}