/* ═══════════════════════════════════════════════════════════
   SEO Call Pages — Shared Stylesheet
   Used by all /free-templates/{country}/*.html pages
   ═══════════════════════════════════════════════════════════ */

/* ── Base ── */
html,body{overflow-x:hidden}

/* ── Hero ── */
.ft-hero{padding:100px 0 64px;background:var(--hero-gradient);border-bottom:1px solid var(--border-default)}
.ft-hero-inner{max-width:760px}

/* ── Breadcrumb ── */
.ft-breadcrumb{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);margin-bottom:24px}
.ft-breadcrumb a{color:var(--text-muted);text-decoration:none;transition:color .2s}
.ft-breadcrumb a:hover{color:var(--text-primary)}
.ft-breadcrumb span{opacity:.4}

/* ── Tags ── */
.ft-tags{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.ft-tag{padding:5px 14px;border-radius:6px;font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase}
.ft-tag--category{background:var(--bg-hover);color:var(--text-secondary)}
.ft-tag--country{background:transparent;color:var(--text-secondary);border:1.5px solid var(--border-strong)}
[data-theme="light"] .ft-tag--category{background:#fff;color:#333;box-shadow:0 1px 3px rgba(0,0,0,.08)}
[data-theme="light"] .ft-tag--country{border-color:#ccc;color:#555}

/* ── Typography ── */
.ft-h1{font-size:clamp(28px,5vw,48px);font-weight:800;letter-spacing:-1.5px;line-height:1.1;color:var(--text-primary);margin-bottom:18px}
.ft-lead{font-size:17px;color:var(--text-muted);line-height:1.7;max-width:640px;margin-bottom:32px}
.ft-h2{font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-.8px;line-height:1.2;color:var(--text-primary);margin-bottom:16px}
.ft-h3{font-size:17px;font-weight:700;color:var(--text-primary);margin:28px 0 8px}
.ft-p{font-size:15px;color:var(--text-secondary);line-height:1.75;margin-bottom:16px}
.ft-p:last-child{margin-bottom:0}

/* ── CTA Row ── */
.ft-cta-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ft-cta-note{font-size:12px;color:var(--text-faint)}
[data-theme="light"] .ft-btn-sample{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;font-size:15px;font-weight:500;color:#333;background:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s;font-family:Inter,system-ui,sans-serif;box-shadow:0 1px 4px rgba(0,0,0,.08)}
[data-theme="light"] .ft-btn-sample:hover{box-shadow:0 2px 8px rgba(0,0,0,.12);transform:translateY(-1px)}
[data-theme="light"] .ft-btn-sample:hover .ft-search-icon{animation:ftSearchBounce .6s ease}
@keyframes ftSearchBounce{0%{transform:scale(1) rotate(0)}30%{transform:scale(1.2) rotate(-15deg)}60%{transform:scale(.95) rotate(5deg)}100%{transform:scale(1) rotate(0)}}
[data-theme="light"] .ft-cta-note{width:100%;font-size:13px;color:#777;font-weight:500;margin-top:4px}

/* ── Sections ── */
.ft-section{padding:64px 0;border-bottom:1px solid var(--border-default)}
.ft-section:last-of-type{border-bottom:none}
.ft-section-alt{background:var(--bg-section)}
.ft-content{max-width:760px}

/* ── Clause Cards ── */
.ft-clauses{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:28px}
.ft-clause-card{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:var(--radius-md);padding:16px 18px;display:flex;align-items:flex-start;gap:12px}
.ft-clause-icon{width:32px;height:32px;flex-shrink:0;background:var(--bg-hover);border-radius:8px;display:flex;align-items:center;justify-content:center}
.ft-clause-icon svg{width:16px;height:16px;color:var(--text-secondary)}
.ft-clause-text{font-size:13px;font-weight:600;color:var(--text-primary);line-height:1.4}
.ft-clause-sub{font-size:12px;color:var(--text-muted);margin-top:2px}

/* ── Steps ── */
.ft-steps{display:flex;flex-direction:column;gap:20px;margin-top:28px}
.ft-step{display:flex;gap:16px;align-items:flex-start}
.ft-step-num{width:32px;height:32px;flex-shrink:0;background:var(--text-primary);color:var(--bg-body);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.ft-step-body{padding-top:4px}
.ft-step-title{font-size:15px;font-weight:700;color:var(--text-primary);margin-bottom:4px}
.ft-step-desc{font-size:14px;color:var(--text-muted);line-height:1.65}

/* ── Notice ── */
.ft-notice{background:var(--bg-hover);border-left:3px solid var(--border-strong);border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:16px 20px;margin:24px 0}
.ft-notice p{font-size:13px;color:var(--text-secondary);line-height:1.65;margin:0}
.ft-notice strong{color:var(--text-primary)}

/* ── FAQ ── */
.ft-faq{display:flex;flex-direction:column;gap:0;margin-top:28px}
.ft-faq-item{border-bottom:1px solid var(--border-default);padding:0}
.ft-faq-item:first-child{border-top:1px solid var(--border-default)}
.ft-faq-q{width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:18px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;font-family:var(--font);font-size:15px;font-weight:600;color:var(--text-primary);line-height:1.4}
.ft-faq-q svg{flex-shrink:0;transition:transform .25s}
.ft-faq-item.open .ft-faq-q svg{transform:rotate(180deg)}
.ft-faq-a{display:none;padding:0 0 18px;font-size:14px;color:var(--text-secondary);line-height:1.75}
.ft-faq-item.open .ft-faq-a{display:block}

/* ── CTA Section ── */
.ft-cta-section{padding:80px 0;text-align:center;background:#0a0a0a}
.ft-cta-section .ft-h2{color:#ffffff}
.ft-cta-section .ft-p{color:rgba(255,255,255,.6)}
.ft-cta-section .ft-cta-note{color:rgba(255,255,255,.4)}

/* ── Buttons ── */
.btn-white{background:var(--white);color:var(--black);border-radius:var(--radius-sm);padding:12px 28px;font-size:15px;font-weight:600;display:inline-flex;align-items:center;gap:8px;transition:all .2s;text-decoration:none}
.btn-white:hover{background:var(--gray-100);transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,0,0,.3)}
.btn-outline-white{background:transparent;color:rgba(255,255,255,.75);border:1.5px solid rgba(255,255,255,.25);border-radius:var(--radius-sm);padding:12px 28px;font-size:15px;font-weight:600;display:inline-flex;align-items:center;gap:8px;transition:all .2s;text-decoration:none}
.btn-outline-white:hover{border-color:rgba(255,255,255,.6);color:var(--white)}

/* ── Footer overrides ── */
.footer .footer-top{grid-template-columns:200px 1fr}
.footer .footer-cols{grid-template-columns:repeat(4,1fr)}

/* ── Preview Page (sample modal) ── */
.preview-page{background:#fff;width:100%;min-height:906px;padding:56px 60px;box-shadow:0 2px 14px rgba(0,0,0,.16),0 1px 3px rgba(0,0,0,.08);border-radius:2px;font-family:'Inter',sans-serif;font-size:9.5pt;line-height:1.9;color:#1a1a1a;position:relative;box-sizing:border-box;word-break:break-word;overflow-wrap:anywhere}
.preview-page+.preview-page{margin-top:24px}
.preview-page::before,.preview-page::after{content:'DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 DOXUNO \00b7 ';position:absolute;top:0;bottom:0;width:24px;z-index:5;pointer-events:none;overflow:hidden;font-size:9px;font-weight:800;color:rgba(0,0,0,.13);letter-spacing:5px;text-transform:uppercase;font-family:'Inter',Arial,sans-serif;white-space:nowrap;writing-mode:vertical-rl}
.preview-page::before{left:0;transform:rotate(180deg)}
.preview-page::after{right:0}

/* ── Contract Document Styles (sample modal) ── */
.contract-title{font-size:15pt;font-weight:800;text-align:center;color:#0a0a0a;letter-spacing:-.4px;line-height:1.25;margin-bottom:6px}
.contract-subtitle{font-size:9pt;font-weight:500;text-align:center;color:#888;letter-spacing:.1px;margin-bottom:28px}
.contract-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;background:#f7f7f7;border:1px solid #e4e4e4;border-radius:4px;padding:14px 16px;margin-bottom:24px}
.contract-meta-item{display:flex;flex-direction:column;gap:3px}
.contract-meta-label{font-size:7.5pt;font-weight:600;text-transform:uppercase;letter-spacing:.6px;color:#999}
.contract-meta-value{font-size:9.5pt;font-weight:600;color:#111}
.contract-article{margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid #ebebeb}
.contract-article:last-of-type{border-bottom:none;margin-bottom:0}
.contract-article-title{font-size:8pt;font-weight:700;color:#0a0a0a;text-transform:uppercase;letter-spacing:1px;display:inline-block;margin-bottom:10px}
.contract-article p{font-size:9.5pt;font-weight:400;color:#1a1a1a;line-height:1.9;text-align:justify;margin-bottom:8px;word-break:break-word;overflow-wrap:anywhere}
.contract-article p:last-child{margin-bottom:0}
.contract-ol{padding-left:20px;margin:6px 0 8px}
.contract-ol li{font-size:9.5pt;color:#1a1a1a;line-height:1.9;margin-bottom:4px}
.contract-ul{list-style:disc;padding-left:22px;margin:6px 0 8px}
.contract-ul li{font-size:9.5pt;color:#1a1a1a;line-height:1.9;margin-bottom:2px}
.contract-divider{border:none;border-top:1px solid #ebebeb;margin:24px 0}
.contract-table{width:100%;border-collapse:collapse;margin-bottom:16px;font-size:9pt}
.contract-table th,.contract-table td{border:1px solid #d8d8d8;padding:7px 11px;text-align:left;vertical-align:top;word-break:break-word;overflow-wrap:anywhere}
.contract-table th{background:#f4f4f4;font-size:7.5pt;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#555}
.contract-table tr:nth-child(even) td{background:#fbfbfb}
.contract-table td:first-child{width:130px;min-width:130px;white-space:normal;word-break:break-word;overflow-wrap:anywhere;color:#555;font-weight:500}
.contract-table td:last-child{word-break:break-word;overflow-wrap:anywhere}
.contract-table td[colspan]{width:auto;min-width:0;white-space:normal;word-break:break-word;overflow-wrap:anywhere;color:#1a1a1a;font-weight:400}
.contract-sig-row{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:36px;padding-top:24px;border-top:1px solid #e4e4e4}
.contract-sig-row.three-col{grid-template-columns:1fr 1fr 1fr}
.contract-sig-block{display:flex;flex-direction:column;gap:4px}
.contract-sig-line{height:38px;border-bottom:1px solid #aaa;margin-bottom:8px}
.contract-sig-label{font-size:7.5pt;font-weight:600;color:#999;text-transform:uppercase;letter-spacing:.6px}
.contract-sig-name{font-size:9pt;font-weight:700;color:#111}
.contract-sig-date{font-size:9pt;font-weight:500;color:#555;margin-top:2px}

/* ── Light mode: dark cards & info boxes ── */
[data-theme="light"] .ft-hero{background:transparent;border-bottom:none;padding-top:84px;padding-bottom:0}
[data-theme="light"] .ft-hero-inner{background:#f5f0eb;border-radius:24px;padding:48px 48px 48px;max-width:none;margin:0 -48px}
[data-theme="light"] .ft-breadcrumb--outside{display:flex;max-width:1140px;margin:0 auto 20px;padding:0}
[data-theme="light"] .ft-hero-inner>.ft-breadcrumb{display:none}
[data-theme="dark"] .ft-breadcrumb--outside{display:none}
[data-theme="light"] .ft-clause-card{background:#111;border-color:#222}
[data-theme="light"] .ft-clause-icon{background:#1a1a1a}
[data-theme="light"] .ft-clause-icon svg{color:#999}
[data-theme="light"] .ft-clause-text{color:#fff}
[data-theme="light"] .ft-clause-sub{color:#777}
[data-theme="light"] .ft-notice{background:#111;border-left-color:#333}
[data-theme="light"] .ft-notice p{color:#bbb}
[data-theme="light"] .ft-notice strong{color:#fff}
[data-theme="light"] .ft-step-num{background:#111;color:#fff}
[data-theme="light"] .ft-faq-item{border-color:#e5e5e5}
[data-theme="light"] .ft-faq-item:first-child{border-color:#e5e5e5}

/* ── Responsive ── */
@media(max-width:900px){
  .footer .footer-top{grid-template-columns:1fr;gap:32px}
  .footer .footer-cols{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .ft-hero{padding:80px 0 48px}
  .ft-breadcrumb{font-size:11px;gap:4px}
  .ft-breadcrumb>a:first-child,.ft-breadcrumb>a:first-child+span{display:none}
  .ft-clauses{grid-template-columns:1fr 1fr}
  .ft-cta-row{flex-direction:column;align-items:flex-start}
  .footer .footer-cols{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .ft-clauses{grid-template-columns:1fr}
  .footer .footer-cols{grid-template-columns:1fr}
}

/* ── Animation ── */
@keyframes spin{to{transform:rotate(360deg)}}
