/* Tarjetas de agradecimiento para emprendimientos — /tarjetas-de-agradecimiento-para-emprendimientos/ */
:root {
  --tc-page-bg: #0c0a09;
  --tc-panel: #171412;
  --tc-border: #3b332d;
  --tc-pink: #f9a8d4;
}

html { overflow-x: clip; scroll-behavior: smooth; }
body.tc-page { margin: 0; overflow-x: clip; background: var(--tc-page-bg); color: #fafaf9; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.tc-page *, .tc-page *::before, .tc-page *::after { box-sizing: border-box; }
.tc-container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.tc-page [hidden] { display: none !important; }

/* Hero */
.tc-hero { padding: 112px 0 68px; background: radial-gradient(circle at 85% 15%, rgba(249, 168, 212, .12), transparent 32%), #0c0a09; border-bottom: 1px solid #29231f; }
.tc-hero__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 56px; align-items: center; }
.tc-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; color: #d6d3d1; font-size: .86rem; margin-bottom: 26px; }
.tc-breadcrumb a { color: var(--tc-pink); text-decoration: underline; text-underline-offset: 3px; }
.tc-eyebrow, .tc-kicker { color: var(--tc-pink); font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.tc-hero h1 { margin: 12px 0 20px; max-width: 760px; font-family: "Space Grotesk", Inter, sans-serif; font-size: clamp(2.3rem, 5vw, 4.4rem); line-height: 1.02; letter-spacing: -.045em; color: #fff; }
.tc-hero h1 span { color: var(--tc-pink); }
.tc-lead { max-width: 680px; margin: 0 0 24px; color: #e7e5e4; font-size: clamp(1rem, 1.5vw, 1.18rem); line-height: 1.7; }
.tc-hero__proof { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; }
.tc-hero__proof span { padding: 8px 11px; border: 1px solid #51463d; border-radius: 999px; background: #171412; color: #f5f5f4; font-size: .82rem; font-weight: 700; }
.tc-hero__image { margin: 0; border: 1px solid #4a4038; border-radius: 24px; overflow: hidden; background: #171412; box-shadow: 0 28px 70px rgba(0,0,0,.38); }
.tc-hero__image img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; }
.tc-hero__image figcaption { padding: 11px 16px; color: #d6d3d1; font-size: .8rem; }

.tc-answer { background: #fff1f6; color: #5b1233; border-block: 1px solid #f5c2d7; }
.tc-answer p { margin: 0; padding: 18px 0; line-height: 1.65; }
.tc-tool-section, .tc-content-section { padding: 78px 0; }
.tc-content-section--soft { background: #151210; border-block: 1px solid #2f2925; }
.tc-section-heading { max-width: 780px; margin: 0 auto 34px; text-align: center; }
.tc-section-heading h2, .tc-copy-grid h2, .tc-final-cta h2 { margin: 8px 0 12px; color: #fff; font-family: "Space Grotesk", Inter, sans-serif; font-size: clamp(1.8rem, 3.5vw, 2.9rem); line-height: 1.1; letter-spacing: -.035em; }
.tc-section-heading p:last-child, .tc-copy-grid p, .tc-final-cta p { color: #d6d3d1; line-height: 1.75; }
.tc-section-heading a, .tc-copy-grid a, .tc-final-cta p a, .tc-tips a { color: var(--tc-pink); text-decoration: underline; text-underline-offset: 3px; }

/* Editor */
.tc-workspace { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 28px; align-items: start; }
.tc-editor, .tc-preview-panel { min-width: 0; border: 1px solid var(--tc-border); border-radius: 22px; background: var(--tc-panel); }
.tc-editor { padding: 24px; }
.tc-editor fieldset { min-width: 0; margin: 0; padding: 0 0 26px; border: 0; }
.tc-editor fieldset + fieldset { padding-top: 24px; border-top: 1px solid var(--tc-border); }
.tc-editor legend { padding: 0; color: #fff; font-size: 1.15rem; font-weight: 800; }
.tc-fields { display: grid; gap: 16px; margin-top: 18px; }
.tc-fields--two { grid-template-columns: 1fr 1fr; }
.tc-editor label { display: grid; gap: 7px; min-width: 0; color: #f5f5f4; font-size: .85rem; font-weight: 700; }
.tc-editor small, .tc-hint { color: #d6d3d1; font-weight: 500; font-size: .78rem; line-height: 1.5; }
.tc-hint { margin: 14px 0 8px; }
.tc-editor input:not([type="color"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]), .tc-editor textarea { width: 100%; min-height: 46px; padding: 11px 12px; border: 1px solid #62564d; border-radius: 10px; background: #fff; color: #1c1917; font: inherit; font-weight: 500; }
.tc-editor textarea { min-height: 90px; resize: vertical; line-height: 1.5; }
.tc-editor input::placeholder, .tc-editor textarea::placeholder { color: #6b6460; }
.tc-editor input[type="file"] { width: 100%; max-width: 100%; color: #f5f5f4; font: inherit; font-size: .8rem; font-weight: 500; }
.tc-editor input:focus-visible, .tc-editor textarea:focus-visible, .tc-btn:focus-visible, .tc-chip:focus-visible, .tc-link-btn:focus-visible, .tc-related a:focus-visible, .tc-view-toggle input:focus-visible { outline: 3px solid var(--tc-pink); outline-offset: 2px; }
.tc-file-label { display: grid; gap: 7px; margin-top: 16px; padding: 14px; border: 1px dashed #74675d; border-radius: 12px; background: #211d1a; }
.tc-file-label .tc-link-btn { justify-self: start; }
.tc-color-field { display: flex; min-height: 46px; align-items: center; gap: 12px; padding: 6px 10px; border: 1px solid #62564d; border-radius: 10px; background: #fff; color: #292524; }
.tc-color-field input { width: 52px; height: 32px; padding: 0; border: 0; background: transparent; }
.tc-editor .tc-check, .tc-editor .tc-radio { display: flex; align-items: center; gap: 9px; margin-top: 14px; font-weight: 600; cursor: pointer; line-height: 1.4; }
.tc-check input, .tc-radio input, .tc-view-toggle input { width: 20px; height: 20px; margin: 0; accent-color: var(--tc-pink); flex: none; }
.tc-count { display: block; }
.tc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.tc-chip { min-height: 40px; padding: 8px 13px; border: 1px solid #74675d; border-radius: 999px; background: #332d28; color: #fff; font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; }
.tc-chip:hover { background: #443c35; border-color: var(--tc-pink); }
.tc-care { margin-top: 4px; padding: 4px 14px 14px; border: 1px solid #4b423b; border-radius: 12px; background: #1c1816; }
.tc-care label { margin-top: 12px; }
.tc-link-btn { min-height: 40px; padding: 0 4px; border: 0; background: transparent; color: #fca5a5; font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

.tc-qr-editor { display: grid; grid-template-columns: minmax(0, 1fr) 182px; gap: 18px; margin-top: 14px; align-items: start; }
.tc-qr-options { display: grid; gap: 12px; min-width: 0; }
.tc-radio-group { display: flex; flex-wrap: wrap; gap: 0 18px; }
.tc-radio-group .tc-radio { margin-top: 0; min-height: 36px; }
.tc-qr-note { margin: 0; padding: 12px 14px; border-left: 3px solid #10b981; border-radius: 0 10px 10px 0; background: #13201b; color: #d6d3d1; font-size: .8rem; line-height: 1.6; }
.tc-qr-preview { display: grid; justify-items: center; gap: 8px; padding: 7px; border-radius: 14px; background: #fff; }
.tc-qr-preview canvas { display: block; width: 168px; height: 168px; image-rendering: pixelated; }
.tc-qr-target { margin: 0 4px 4px; color: #292524; font-size: .72rem; line-height: 1.4; text-align: center; overflow-wrap: anywhere; }
.tc-option-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 14px; }
.tc-radio-group--cards { display: grid; gap: 8px; }
.tc-radio-group--cards .tc-radio { padding: 9px 12px; border: 1px solid #4b423b; border-radius: 10px; background: #211d1a; }
.tc-radio-group--cards .tc-radio:has(input:checked) { border-color: var(--tc-pink); background: #2a1f24; }

.tc-btn { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; padding: 11px 18px; border: 1px solid transparent; border-radius: 11px; font: inherit; font-size: .9rem; font-weight: 800; text-align: center; text-decoration: none; cursor: pointer; transition: transform .18s ease, background .18s ease; }
.tc-btn:hover { transform: translateY(-1px); }
.tc-btn--primary { background: var(--tc-pink); color: #3b0820; border-color: var(--tc-pink); }
.tc-btn--secondary { background: #292524; color: #fff; border-color: #786b61; }
.tc-btn--quiet { background: transparent; color: #e7e5e4; border-color: #51463d; }
.tc-btn--publish { background: #10b981; color: #052e1f; border-color: #10b981; }
.tc-btn--publish:hover { background: #34d399; }
.tc-actions { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 8px; }
.tc-bridge { display: grid; gap: 10px; margin-top: 18px; padding: 16px; border: 1px solid #1f7a5c; border-radius: 14px; background: #0f1f19; }
.tc-bridge p { margin: 0; color: #d6d3d1; font-size: .84rem; line-height: 1.6; }
.tc-bridge .tc-btn { justify-self: start; }
.tc-privacy { color: #d6d3d1; font-size: .78rem; line-height: 1.6; }
.tc-status { min-height: 1.4em; color: var(--tc-pink); font-size: .84rem; font-weight: 700; line-height: 1.5; }
.tc-status--error { color: #fca5a5; }

/* Vista previa */
.tc-preview-panel { position: sticky; top: 88px; padding: 14px; overflow: hidden; }
.tc-preview-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; padding: 2px 2px 12px; color: #e7e5e4; font-size: .8rem; font-weight: 800; }
.tc-view-toggle { display: flex; gap: 14px; }
.tc-view-toggle label { display: flex; align-items: center; gap: 7px; min-height: 36px; cursor: pointer; }
.tc-output { display: flex; justify-content: center; max-height: min(880px, calc(100vh - 170px)); overflow: auto; border-radius: 12px; background: #e7e5e4; padding: 14px; }
.tc-card-view, .tc-sheet-view { display: grid; gap: 16px; justify-items: center; align-content: start; }
.tc-card-view--row { grid-template-columns: auto auto; align-items: start; }
.tc-card-figure { display: grid; gap: 6px; justify-items: center; margin: 0; }
.tc-card-figure figcaption { color: #44403c; font-size: .74rem; font-weight: 700; }
.tc-scale { position: relative; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.22); background: #fff; }
.tc-scale > * { position: absolute; top: 0; left: 0; }
.tc-fit-warning { margin: 10px 2px 0; color: #fcd34d; font-size: .8rem; font-weight: 700; line-height: 1.5; }
.tc-preview-note { margin: 10px 2px 0; color: #d6d3d1; font-size: .76rem; line-height: 1.5; }
.tc-measure { position: absolute; top: 0; left: -10000px; visibility: hidden; pointer-events: none; }
.tc-print { display: none; }

/* Tarjeta (medidas reales en mm; la vista previa se escala con transform) */
.tc-card { --tc-fit: 1; position: relative; display: flex; width: var(--tc-w); height: var(--tc-h); overflow: hidden; background: var(--tc-bg); color: var(--tc-text); font-family: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif; font-size: calc(var(--tc-base) * var(--tc-fit)); line-height: 1.45; text-align: center; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
.tc-card__deco { position: absolute; inset: 0; pointer-events: none; }
.tc-card__body { position: relative; display: flex; flex: 1; flex-direction: column; min-width: 0; min-height: 0; padding: var(--tc-pad); overflow: hidden; }
.tc-stack { display: flex; flex-direction: column; align-items: center; gap: .55em; width: 100%; margin: auto 0; }
.tc-stack p { margin: 0; }
.tc-logo { display: block; height: calc(var(--tc-logo) * var(--tc-fit)); max-width: 60%; object-fit: contain; }
.tc-logo--small { height: calc(var(--tc-logo) * .75 * var(--tc-fit)); }
.tc-brand { color: var(--tc-brand); font-size: .8em; font-weight: 800; letter-spacing: .14em; line-height: 1.3; text-transform: uppercase; overflow-wrap: anywhere; }
.tc-title { color: var(--tc-text); font-family: Georgia, "Times New Roman", serif; font-size: 2.1em; font-weight: 700; line-height: 1.12; overflow-wrap: anywhere; }
.tc-title::after { content: ""; display: block; width: 1.8em; height: max(1px, .07em); margin: .12em auto 0; background: var(--tc-accent); }
.tc-msg { color: var(--tc-text); font-size: 1.05em; line-height: 1.45; white-space: pre-line; overflow-wrap: anywhere; }
.tc-sign { color: var(--tc-muted); font-family: Georgia, "Times New Roman", serif; font-style: italic; }
.tc-care-title { color: var(--tc-text); font-size: .82em; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.tc-care-list { margin: .3em 0 0; padding: 0; list-style: none; font-size: .9em; line-height: 1.4; }
.tc-care-list li::before { content: "· "; }
.tc-code { padding: .4em 1em; border: max(.3mm, 1px) dashed var(--tc-code-border); color: var(--tc-text); font-size: .88em; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.tc-handle { color: var(--tc-muted); font-size: .9em; font-weight: 700; }
.tc-foot { display: flex; align-items: center; justify-content: center; gap: .8em; max-width: 100%; text-align: left; }
.tc-qr { display: block; flex: none; width: calc(var(--tc-qr) * var(--tc-fit)); height: calc(var(--tc-qr) * var(--tc-fit)); background: #fff; image-rendering: pixelated; }
.tc-foot__text { display: grid; gap: .15em; min-width: 0; }
.tc-foot__text strong { color: var(--tc-text); font-size: .9em; font-weight: 800; line-height: 1.3; }
.tc-foot__text span { color: var(--tc-muted); font-size: .8em; line-height: 1.4; overflow-wrap: anywhere; }

/* Diseños */
.tc-tpl-minimal .tc-card__deco { inset: 4mm; border: .4mm solid var(--tc-accent); }
.tc-tpl-minimal.tc-size-business .tc-card__deco, .tc-tpl-kraft.tc-size-business .tc-card__deco { inset: 2.5mm; }
.tc-tpl-floral .tc-card__deco { background: radial-gradient(circle 32mm at 5% 3%, var(--tc-soft) 99%, transparent 100%), radial-gradient(circle 36mm at 95% 97%, var(--tc-soft) 99%, transparent 100%), radial-gradient(circle 16mm at 20% 0, var(--tc-soft) 99%, transparent 100%), radial-gradient(circle 18mm at 80% 100%, var(--tc-soft) 99%, transparent 100%); }
.tc-tpl-floral.tc-size-business .tc-card__deco { background: radial-gradient(circle 17.6mm at 5% 3%, var(--tc-soft) 99%, transparent 100%), radial-gradient(circle 19.8mm at 95% 97%, var(--tc-soft) 99%, transparent 100%), radial-gradient(circle 8.8mm at 20% 0, var(--tc-soft) 99%, transparent 100%), radial-gradient(circle 9.9mm at 80% 100%, var(--tc-soft) 99%, transparent 100%); }
.tc-tpl-floral .tc-card__deco::after { content: ""; position: absolute; inset: calc(var(--tc-pad) * .45); border: .35mm solid var(--tc-accent); opacity: .45; }
.tc-tpl-floral .tc-title { font-style: italic; }
.tc-tpl-bold .tc-title { font-family: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif; font-size: 2.3em; font-weight: 900; letter-spacing: -.01em; text-transform: uppercase; }
.tc-tpl-bold .tc-title::after { display: none; }
.tc-tpl-bold .tc-card__deco::before, .tc-tpl-bold .tc-card__deco::after { content: ""; position: absolute; left: 38%; width: 24%; height: .6mm; background: var(--tc-text); opacity: .9; }
.tc-tpl-bold .tc-card__deco::before { top: 3mm; }
.tc-tpl-bold .tc-card__deco::after { bottom: 3mm; }
.tc-tpl-bold.tc-size-business .tc-card__deco::before { top: 2mm; }
.tc-tpl-bold.tc-size-business .tc-card__deco::after { bottom: 2mm; }
.tc-tpl-bold.tc-inksaver .tc-card__deco { border: 1.2mm solid var(--tc-accent); }
.tc-tpl-kraft:not(.tc-inksaver) { background-image: radial-gradient(rgba(91, 64, 38, .18) .18mm, transparent .22mm), radial-gradient(rgba(255, 240, 215, .2) .18mm, transparent .22mm); background-size: 2.3mm 2.3mm, 3.1mm 3.1mm; background-position: 0 0, 1.1mm 1.3mm; }
.tc-tpl-kraft .tc-card__deco { inset: 4mm; border: .35mm dashed var(--tc-line); }
.tc-tpl-kraft .tc-title::after { background: var(--tc-brand); }

/* Hoja A4 */
.tc-sheet-page { position: relative; width: 210mm; height: 297mm; overflow: hidden; background: #fff; }
.tc-sheet-grid { position: absolute; display: grid; }
.tc-sheet-grid--guides .tc-card { outline: .1mm dashed #c4c4c4; outline-offset: -.05mm; }
.tc-mark { position: absolute; display: block; background: #000; }
.tc-mark--v { width: .2mm; margin-left: -.1mm; }
.tc-mark--h { height: .2mm; margin-top: -.1mm; }

/* Contenido */
.tc-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.tc-steps article, .tc-tips article, .tc-rubros article { padding: 22px; border: 1px solid #403832; border-radius: 16px; background: #1d1917; }
.tc-steps span { color: var(--tc-pink); font-size: .75rem; font-weight: 900; }
.tc-steps h3, .tc-tips h3, .tc-rubros h3 { margin: 12px 0 7px; color: #fff; font-size: 1.03rem; }
.tc-tips h3, .tc-rubros h3 { margin-top: 0; }
.tc-steps p, .tc-tips p, .tc-rubros p { margin: 0; color: #d6d3d1; font-size: .88rem; line-height: 1.65; }
.tc-rubros p { font-family: Georgia, "Times New Roman", serif; font-style: italic; font-size: .95rem; }
.tc-tips, .tc-rubros { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.tc-copy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 46px; align-items: center; }
.tc-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tc-comparison > div { display: grid; gap: 12px; padding: 22px; border: 1px solid #4b423b; border-radius: 16px; background: #171412; }
.tc-comparison strong { color: #fff; font-size: 1.05rem; }
.tc-comparison span { position: relative; padding-left: 18px; color: #d6d3d1; font-size: .86rem; line-height: 1.5; }
.tc-comparison span::before { content: "✓"; position: absolute; left: 0; color: var(--tc-pink); font-weight: 900; }
.tc-related { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.tc-related a { display: grid; gap: 8px; padding: 22px; border: 1px solid #4b423b; border-radius: 16px; background: #1d1917; color: #fff; text-decoration: none; transition: border-color .18s ease; }
.tc-related a:hover { border-color: var(--tc-pink); }
.tc-related strong { color: var(--tc-pink); font-size: 1rem; }
.tc-related span { color: #d6d3d1; font-size: .88rem; line-height: 1.6; }
.tc-faq { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.tc-faq details { padding: 16px 18px; border: 1px solid #4b423b; border-radius: 12px; background: #211d1a; }
.tc-faq summary { color: #fff; font-weight: 800; cursor: pointer; }
.tc-faq p { color: #d6d3d1; line-height: 1.65; }
.tc-final-cta { padding: 44px; border: 1px solid #665a50; border-radius: 24px; background: linear-gradient(135deg, #211d1a, #151210); text-align: center; }
.tc-final-cta > div { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.tc-page .footer { background: #0a0a0a; color: #f5f5f4; }
.tc-page .footer h3 { color: #fff; }
.tc-page .footer a, .tc-page .footer p { color: #a8a29e; }

@media (max-width: 980px) {
  .tc-hero__grid, .tc-workspace, .tc-copy-grid { grid-template-columns: 1fr; }
  .tc-hero__image { max-width: 760px; }
  .tc-preview-panel { position: static; }
  .tc-output { max-height: none; }
  .tc-steps, .tc-tips, .tc-rubros, .tc-related { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .tc-container { width: min(100% - 24px, 1180px); }
  .tc-hero { padding: 92px 0 48px; }
  .tc-hero h1 { font-size: clamp(2.1rem, 10vw, 3.2rem); }
  .tc-tool-section, .tc-content-section { padding: 54px 0; }
  .tc-editor { padding: 16px; }
  .tc-fields--two, .tc-option-grid, .tc-faq, .tc-comparison, .tc-steps, .tc-tips, .tc-rubros, .tc-related, .tc-qr-editor { grid-template-columns: 1fr; }
  .tc-qr-preview { justify-self: center; width: 182px; }
  .tc-actions .tc-btn, .tc-bridge .tc-btn { width: 100%; justify-self: stretch; }
  .tc-output { padding: 10px; }
  .tc-final-cta { padding: 28px 18px; }
}

/* Impresión: solo la hoja A4 con las tarjetas, sin márgenes del navegador */
@page { size: A4 portrait; margin: 0; }
@media print {
  html, body.tc-page { margin: 0 !important; padding: 0 !important; background: #fff !important; }
  body.tc-page > :not(main), .tc-page main > :not(.tc-tool-section), .tc-tool-section > .tc-container { display: none !important; }
  .tc-tool-section { padding: 0 !important; background: #fff !important; }
  .tc-print { display: block !important; }
  .tc-sheet-page { height: 296mm; break-after: page; page-break-after: always; }
  .tc-sheet-page:last-child { break-after: auto; page-break-after: auto; }
  .tc-card, .tc-mark { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}