/* HRTally email template silo. Loaded only on /email-templates/ pages, after blog.css. */

/* Hero email mockup */
.et-mock{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);overflow:hidden;font-size:14px;transform:rotate(1deg)}
.et-mock-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--mist);border-bottom:1px solid var(--line)}
.et-mock-bar i{width:10px;height:10px;border-radius:50%;background:#d6dbea;display:block}
.et-mock-bar i:first-child{background:#ff7a7a}.et-mock-bar i:nth-child(2){background:#ffcc4d}.et-mock-bar i:nth-child(3){background:#45d08a}
.et-mock-bar span{margin-left:8px;font-size:12px;font-weight:700;color:var(--ink-3)}
.et-mock-row{display:flex;gap:12px;padding:9px 16px;border-bottom:1px solid var(--line);color:var(--ink);min-width:0}
.et-mock-row b{width:58px;flex:none;color:var(--ink-3);font-weight:700;font-size:12.5px}
.et-mock-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.et-mock-body{position:relative;padding:14px 16px 4px;max-height:168px;overflow:hidden}
.et-mock-body p{margin:0 0 8px;color:#3a4263;line-height:1.5;font-size:13.5px}
.et-mock-fade{position:absolute;left:0;right:0;bottom:0;height:60px;background:linear-gradient(rgba(255,255,255,0),#fff)}
.et-mock-foot{display:flex;gap:8px;padding:10px 16px 14px}
.et-mock-pill{font-size:12px;font-weight:800;color:var(--indigo);background:#f1efff;border-radius:999px;padding:4px 10px}

/* Placeholders */
.ph{background:#fff3cf;color:#6b4a00;border-radius:4px;padding:0 3px;font-weight:600}

/* Email version blocks */
.et-email{border:1px solid var(--line);border-radius:18px;background:#fff;margin:0 0 22px;overflow:hidden;box-shadow:var(--shadow);scroll-margin-top:96px}
.et-email-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;background:var(--mist);border-bottom:1px solid var(--line)}
.et-email-head h3{font-family:"Manrope",sans-serif;font-size:18px;font-weight:800;margin:4px 0 0;color:var(--ink)}
.et-v{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--indigo)}
.et-copy{flex:none;border:1.5px solid #c9c3ff;background:#fff;color:var(--indigo);font:inherit;font-weight:800;font-size:14px;border-radius:10px;padding:9px 14px;cursor:pointer}
.et-copy:hover{background:#f1efff}
.et-copy.done{background:var(--good);border-color:var(--good);color:#fff}
.et-subj{display:flex;gap:12px;align-items:baseline;padding:13px 18px;border-bottom:1px dashed var(--line);min-width:0}
.et-subj>span{flex:none;font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.et-subj strong{font-size:16px;line-height:1.45;min-width:0;overflow-wrap:anywhere}
.et-body{margin:0;padding:16px 18px 20px;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;font-family:"Manrope",system-ui,sans-serif;font-size:16px;line-height:1.7;color:#1c2340;background:#fff}

/* Lists */
.b-article ul.et-subjects{list-style:none;margin-left:0!important;border:1px solid var(--line);border-radius:14px;padding:6px 16px!important;background:#fff}
.et-subjects li{padding:10px 0 10px 0!important;margin:0!important;border-bottom:1px solid var(--line);font-weight:600;color:var(--ink)!important}
.et-subjects li:last-child{border-bottom:0}
.b-article ul.et-avoid li::marker{color:#d43a5c}
.et-disc{font-size:14.5px!important;color:var(--ink-3)!important;border-left:3px solid var(--line);padding-left:12px}
.et-inds{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px!important}
.et-inds span{font-size:13px;font-weight:800;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em;margin-right:4px}
.b-article .et-inds a,.et-pills a{display:inline-block;font-size:14px;font-weight:700;color:var(--ink);background:var(--mist);border:1px solid var(--line);border-radius:999px;padding:5px 12px;text-decoration:none}
.et-pills{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.et-pills a:hover,.b-article .et-inds a:hover{border-color:#c9c3ff;color:var(--indigo)}

/* Download box */
.et-dl .up-body h3{font-size:22px}
.et-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
.et-fields input,.et-fields select{border:1.5px solid var(--line);border-radius:10px;padding:11px 12px;font:inherit;font-size:14.5px;background:#fff;min-width:0;width:100%;color:var(--ink)}
.et-fields .err{border-color:#d43a5c;background:#fff6f8}
.et-note{font-size:13px!important;color:var(--ink-3)!important;margin:10px 0 0!important;line-height:1.5!important}
.et-pdf{position:relative;background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px 14px 18px;transform:rotate(-2deg);box-shadow:0 14px 30px rgba(28,22,110,.2);display:flex;flex-direction:column;gap:8px;overflow:hidden}
.et-pdf-top{position:absolute;left:0;right:0;top:0;height:5px;background:var(--grad)}
.et-pdf img{width:70px;height:auto}
.et-pdf strong{font-family:"Bricolage Grotesque",sans-serif;font-size:14px;line-height:1.25;color:var(--ink)}
.et-pdf i{display:block;height:6px;border-radius:4px;background:#e8ebf5}
.et-pdf i.s{width:60%}

/* Cards and grids */
.et-grid{display:grid;gap:16px}
.et-grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.et-grid.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.et-card{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s,border-color .15s;min-width:0}
.et-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(13,19,48,.1);border-color:#c9c3ff}
.et-card.hide{display:none}
.et-card-tag{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--indigo)}
.et-card h3{font-family:"Manrope",sans-serif;font-size:17px;font-weight:800;line-height:1.35;margin:2px 0;color:var(--ink)}
.et-card p{font-size:14.5px;color:var(--ink-2);line-height:1.55;margin:0;flex:1}
.et-card-meta{font-size:12.5px;color:var(--ink-3);font-weight:700;margin-top:8px}
.et-related .et-more{margin-top:20px;display:flex;flex-wrap:wrap;gap:10px}
.et-catgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:10px}
.et-catcard{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:18px;padding:18px;background:#fff;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.et-catcard:hover{border-color:#c9c3ff;transform:translateY(-2px)}
.et-catcard .ic{width:42px;height:42px;border-radius:12px;background:var(--grad-soft);display:grid;place-items:center;color:var(--indigo)}
.et-catcard .ic svg{width:22px;height:22px}
.et-catcard strong{font-size:16.5px;color:var(--ink)}
.et-catcard em{font-style:normal;font-size:14px;color:var(--ink-2);line-height:1.5;flex:1}
.et-count{font-size:13px;font-weight:800;color:var(--indigo)}
.et-indgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}
.et-indcard{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:16px;padding:18px;background:linear-gradient(135deg,#fff,#f6f3ff);text-decoration:none;color:inherit}
.et-indcard:hover{border-color:#c9c3ff}
.et-indcard strong{font-size:16px;color:var(--ink)}
.et-indcard em{font-style:normal;font-size:13.5px;color:var(--ink-2);line-height:1.5}

/* Hubs */
.et-hub-hero .lede{max-width:780px}
.et-hero-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.et-search{display:flex;align-items:center;gap:10px;max-width:640px;margin-top:22px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:6px 18px;box-shadow:var(--shadow)}
.et-search svg{color:var(--ink-3);flex:none}
.et-search input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:16px;padding:9px 0;background:transparent;color:var(--ink)}
.et-stats{display:flex;flex-wrap:wrap;gap:10px 26px;list-style:none;margin:20px 0 0;padding:0}
.et-stats li{font-size:14.5px;color:var(--ink-2)}
.et-stats strong{font-family:"Bricolage Grotesque",sans-serif;font-size:22px;color:var(--ink);margin-right:4px}
.et-filter-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:-8px 0 18px}
.et-filter-row select{border:1.5px solid var(--line);border-radius:10px;padding:9px 12px;font:inherit;font-size:14.5px;background:#fff;color:var(--ink)}
#et-count{font-size:14px;font-weight:700;color:var(--ink-3)}
.et-empty{padding:20px;border:1px dashed var(--line);border-radius:14px;text-align:center;color:var(--ink-2)}
.et-jump{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.et-jump a,.et-jump span{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;font-weight:800;font-size:14px;text-decoration:none}
.et-jump a{background:var(--mist);color:var(--indigo);border:1px solid var(--line)}
.et-jump a:hover{background:#f1efff}
.et-jump span{color:#c3c8db}
.et-az{columns:4 220px;column-gap:28px;margin-bottom:30px}
.et-az-group{break-inside:avoid;margin-bottom:18px;scroll-margin-top:96px}
.et-az-group h3{font-family:"Bricolage Grotesque",sans-serif;font-size:22px;color:var(--indigo);margin:0 0 6px;border-bottom:2px solid #ebe8ff;padding-bottom:4px}
.et-az-group ul{list-style:none;margin:0;padding:0}
.et-az-group li{margin:0 0 6px;line-height:1.4}
.et-az-group a{font-size:14.5px;color:var(--ink);text-decoration:none}
.et-az-group a:hover{color:var(--indigo);text-decoration:underline}
.et-eeat{background:var(--mist);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:56px 0}
.et-eeat .b-article h2{font-size:clamp(24px,2.5vw,30px);margin:0 0 14px}
.et-eeat .b-article h2:not(:first-child){margin-top:30px}
.et-faq-wrap{max-width:860px;padding-top:10px;padding-bottom:30px}
.et-faq-wrap h2{font-size:clamp(24px,2.5vw,30px);margin-bottom:16px}
.et-cat{padding-top:36px;padding-bottom:40px}
.et-cat .group-title{margin-top:34px}
.et-cat-intro{max-width:860px}
.et-cat-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:44px;align-items:start;margin-top:40px}
.et-cat-cols .b-article h2{font-size:clamp(22px,2.3vw,28px);margin:0 0 12px}
.et-cat-side{display:grid;gap:14px}
.et-mini{border:1px solid var(--line);border-radius:16px;padding:18px;background:#fff}
.et-mini h4{font-size:15px;margin:0 0 10px;color:var(--ink)}
.et-mini ul{list-style:none;margin:0;padding:0}
.et-mini li{margin:0 0 8px;font-size:14.5px;line-height:1.45}
.et-mini a{color:var(--indigo);font-weight:700}
.et-tips ul{list-style:disc;padding-left:18px}
.et-tips li{color:var(--ink-2)}
.et-az-mini{margin-top:40px}
.et-az-mini h2,.et-other h2{font-size:22px;margin:0 0 12px}
.et-az-mini p{line-height:2;font-size:15px}
.et-az-mini a{color:var(--indigo);font-weight:600;margin-right:14px;white-space:nowrap}
.et-other{margin-top:34px}

/* Blog cross-link block */
.et-blog-block{border:2px solid #dcd6ff;background:linear-gradient(135deg,#fff,#f6f3ff);border-radius:20px;padding:22px 24px;margin:0 0 42px}
.et-blog-block h2{font-size:clamp(22px,2.3vw,27px);margin:6px 0 6px}
.et-blog-block>p{font-size:15.5px!important;margin-bottom:12px!important}
.et-blog-block ul{list-style:none;margin:0 0 12px!important;padding:0!important}
.et-blog-block li{padding:10px 0!important;margin:0!important;border-bottom:1px solid #ebe8ff;display:flex;flex-direction:column;gap:2px}
.et-blog-block li:last-child{border-bottom:0}
.et-blog-block li span{font-size:14.5px;color:var(--ink-2);line-height:1.5}
.b-article .et-blog-all{font-weight:800}

@media (max-width:1100px){
  .et-grid.c4,.et-catgrid,.et-indgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
  .et-grid.c3,.et-grid.c4,.et-catgrid,.et-indgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .et-cat-cols{grid-template-columns:1fr;gap:24px}
  .et-mock{transform:none}
}
@media (max-width:640px){
  .et-grid.c3,.et-grid.c4,.et-catgrid,.et-indgrid{grid-template-columns:1fr}
  .et-fields{grid-template-columns:1fr}
  .et-email-head{flex-direction:column;align-items:flex-start}
  .et-subj{flex-direction:column;gap:4px}
  .et-body{font-size:15px;padding:14px}
  .et-stats strong{font-size:19px}
}