/*
Theme Name: SecureCrack Home
Theme URI: https://securecrack.com
Template: generatepress
Author: SecureCrack Home
Description: Child theme for SecureCrack Home — brand tokens, self-hosted Fraunces, and article components. Home hacks that actually work.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: securecrack-child
*/

/* ============================================================
   Design tokens
   ============================================================ */
:root{
  --sc-ink:        #1A1F24;
  --sc-teal:       #0E5A54;
  --sc-teal-dark:  #0A423E;
  --sc-terra:      #C85528;
  --sc-terra-hov:  #B44A21;
  --sc-terra-lite: #E0683A;
  --sc-terra-soft: #FBEEE7;
  --sc-surface:    #F5F3EF;
  --sc-hairline:   #E3E0DA;
  --sc-paper:      #FFFFFF;
  --sc-muted:      #5C6670;

  --sc-font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --sc-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --sc-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --sc-measure: 68ch;
  --sc-content: 760px;
  --sc-radius: 10px;
}

/* ============================================================
   Self-hosted Fraunces (2 weights, swap)
   ============================================================ */
@font-face{
  font-family:"Fraunces";
  font-style:normal; font-weight:400; font-display:swap;
  src:url("fonts/fraunces-400.woff2") format("woff2");
}
@font-face{
  font-family:"Fraunces";
  font-style:normal; font-weight:600; font-display:swap;
  src:url("fonts/fraunces-600.woff2") format("woff2");
}

/* ============================================================
   Base typography
   ============================================================ */
body{
  font-family:var(--sc-font-body);
  font-size:18px; line-height:1.65; color:var(--sc-ink);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.entry-title,.site-title{
  font-family:var(--sc-font-display); font-weight:600; font-style:normal;
  line-height:1.14; letter-spacing:-0.01em; color:var(--sc-ink);
}
h1,.entry-title{font-size:clamp(1.9rem,5.2vw,2.8rem); margin-bottom:.35em}
h2{font-size:clamp(1.45rem,3.6vw,1.95rem); margin-top:1.9em}
h3{font-size:1.25rem; margin-top:1.6em}
a{color:var(--sc-teal); text-decoration-thickness:1px; text-underline-offset:2px}
a:hover{color:var(--sc-teal-dark)}

/* Reading measure for single posts/pages (single column) */
.single .entry-content,
.page .entry-content{max-width:var(--sc-content); margin-left:auto; margin-right:auto}
.single .entry-content p,
.single .entry-content ul,
.single .entry-content ol{max-width:var(--sc-measure)}

/* ============================================================
   Header + navigation
   ============================================================ */
.site-header{background:var(--sc-paper); border-bottom:1px solid var(--sc-hairline)}
.main-title a,.site-title a{font-family:var(--sc-font-display); font-weight:600; color:var(--sc-ink)}
.main-title b{color:var(--sc-teal); font-weight:600}
.main-navigation,
.main-navigation ul{background:var(--sc-paper)}
.main-navigation .main-nav ul li a{
  font-family:var(--sc-font-body); font-weight:550; color:var(--sc-ink); font-size:.98rem;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item a{color:var(--sc-teal)}
button.menu-toggle,.main-navigation .menu-toggle{color:var(--sc-ink)}

/* Logo wordmark: pair "crack" with "Home" via accent on the brand word */
.sc-wordmark{font-family:var(--sc-font-display);font-weight:600;letter-spacing:-.01em;color:var(--sc-ink);text-decoration:none;font-size:1.3rem}
.sc-wordmark b{color:var(--sc-teal);font-weight:600}

/* ============================================================
   Footer
   ============================================================ */
.site-footer,.site-info{background:var(--sc-teal-dark); color:#d7e4e2}
.site-info a,.site-footer a{color:#d7e4e2}
.site-info a:hover,.site-footer a:hover{color:#fff}
.sc-footer{display:flex;flex-direction:column;gap:14px;text-align:left;padding:10px 0}
.sc-footer__mark{font-family:var(--sc-font-display);font-weight:600;color:#fff;font-size:1.2rem}
.sc-footer__mark b{color:var(--sc-terra-lite)}
.sc-footer__brand p{margin:.4em 0 0;color:#b9cbc8;font-size:.9rem;max-width:none}
.sc-footer__links{display:flex;flex-wrap:wrap;gap:8px 20px}
.sc-footer__links a{color:#d7e4e2;text-decoration:none;font-size:.92rem}
.sc-footer__links a:hover{color:#fff}
.sc-footer__legal{border-top:1px solid rgba(255,255,255,.14);padding-top:12px;font-size:.8rem;color:#9fb6b3}
.sc-footer__legal a{color:#cfe0dd}

/* ============================================================
   Buttons
   ============================================================ */
.sc-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sc-font-body);
  font-weight:650;font-size:1rem;line-height:1;padding:14px 22px;border-radius:9px;
  border:1px solid transparent;cursor:pointer;text-decoration:none;
  transition:transform .12s ease, background .15s ease}
.sc-btn--primary{background:var(--sc-terra);color:#fff}
.sc-btn--primary:hover{background:var(--sc-terra-hov);color:#fff}
.sc-btn--primary:active{transform:translateY(1px)}
.sc-btn--secondary{background:transparent;color:var(--sc-teal);border-color:var(--sc-teal)}
.sc-btn--secondary:hover{background:rgba(14,90,84,.08)}
.sc-btn:focus-visible{outline:3px solid var(--sc-terra-lite);outline-offset:2px}

/* ============================================================
   Breadcrumbs (Rank Math)
   ============================================================ */
.rank-math-breadcrumb{font-size:.86rem;color:var(--sc-muted);margin-bottom:1rem}
.rank-math-breadcrumb a{color:var(--sc-teal);text-decoration:none}
.rank-math-breadcrumb .separator{margin:0 .4ch;color:#9aa2a9}

/* ============================================================
   Article meta (author / dates)
   ============================================================ */
.sc-meta{font-size:.9rem;color:var(--sc-muted);display:flex;flex-wrap:wrap;gap:.3rem .8rem;margin:.2rem 0 1.4rem}
.sc-meta .sc-updated{font-weight:600;color:var(--sc-ink)}

/* ============================================================
   Quick-answer box
   ============================================================ */
.sc-quick{background:var(--sc-terra-soft);border-left:4px solid var(--sc-terra);
  border-radius:0 10px 10px 0;padding:16px 18px;margin:18px 0}
.sc-quick .sc-quick__h{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;
  font-weight:700;color:#9a4a12;margin:0 0 6px}
.sc-quick p{margin:0;color:var(--sc-ink);max-width:none}

/* ============================================================
   Table of contents (collapsed)
   ============================================================ */
.sc-toc{border:1px solid var(--sc-hairline);border-radius:10px;overflow:hidden;max-width:440px;margin:18px 0}
.sc-toc>summary{list-style:none;cursor:pointer;padding:12px 16px;font-weight:650;
  display:flex;justify-content:space-between;align-items:center;background:var(--sc-surface)}
.sc-toc>summary::-webkit-details-marker{display:none}
.sc-toc>summary::after{content:"▾";color:var(--sc-teal)}
.sc-toc[open]>summary::after{content:"▴"}
.sc-toc ol{margin:0;padding:10px 16px 14px 32px}
.sc-toc li{margin:6px 0}
.sc-toc a{color:var(--sc-teal);text-decoration:none}

/* ============================================================
   FAQ accordion
   ============================================================ */
.sc-faq details{border-bottom:1px solid var(--sc-hairline)}
.sc-faq summary{list-style:none;cursor:pointer;padding:14px 2px;font-weight:650;
  display:flex;justify-content:space-between;gap:12px}
.sc-faq summary::-webkit-details-marker{display:none}
.sc-faq summary::after{content:"+";color:var(--sc-terra);font-size:1.3em;line-height:1}
.sc-faq details[open] summary::after{content:"–"}
.sc-faq .sc-faq__a{padding:0 2px 16px;color:#3a4249;max-width:var(--sc-measure)}

/* ============================================================
   Author box
   ============================================================ */
.sc-author{display:flex;gap:16px;align-items:flex-start;background:var(--sc-surface);
  border-radius:12px;padding:18px;margin:28px 0}
.sc-author__av{width:56px;height:56px;border-radius:50%;flex:none;object-fit:cover;
  background:linear-gradient(135deg,var(--sc-teal),var(--sc-terra))}
.sc-author__av--initials{display:flex;align-items:center;justify-content:center;
  color:#fff;font-family:var(--sc-font-display);font-weight:600;font-size:1.25rem}
.sc-related-wrap{margin-top:36px}
.sc-related-wrap h2{margin-top:0}
.sc-faq-wrap{margin-top:36px}
.sc-faq-wrap h2{margin-top:0}
.sc-breadcrumb-wrap{margin-bottom:.4rem}
.sc-author__nm{font-weight:700}
.sc-author__ti{font-size:.84rem;color:var(--sc-muted);margin:2px 0 8px}
.sc-author p{font-size:.92rem;margin:0;color:#3a4249;max-width:none}

/* ============================================================
   Related guides
   ============================================================ */
.sc-related{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:14px;margin:18px 0}
.sc-rcard{border:1px solid var(--sc-hairline);border-radius:12px;overflow:hidden;
  text-decoration:none;color:var(--sc-ink);background:#fff;transition:transform .15s ease}
.sc-rcard:hover{transform:translateY(-3px)}
.sc-rcard__thumb{aspect-ratio:3/2;background:var(--sc-surface) center/cover}
.sc-rcard__body{padding:12px 14px}
.sc-rcard__cat{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--sc-terra);font-weight:700}
.sc-rcard h4{font-family:var(--sc-font-body);font-size:.98rem;font-weight:650;margin:4px 0 0;line-height:1.3}

/* ============================================================
   Affiliate component
   ============================================================ */
.sc-aff{border:1px solid var(--sc-hairline);border-radius:12px;padding:16px;
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:18px 0}
.sc-aff__pic{width:72px;height:72px;border-radius:8px;background:var(--sc-surface);flex:none;object-fit:cover}
.sc-aff__info{flex:1;min-width:180px}
.sc-aff__pn{font-weight:700}
.sc-aff__disc{font-size:.72rem;color:var(--sc-muted);margin-top:8px;flex-basis:100%}

/* ============================================================
   Pinterest image
   ============================================================ */
.sc-pin{max-width:320px;margin:22px auto}
.sc-pin img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:12px;display:block}

/* ============================================================
   Sources list
   ============================================================ */
.sc-sources{font-size:.9rem;background:var(--sc-surface);border-radius:10px;padding:16px 18px;margin:24px 0}
.sc-sources h3{margin-top:0;font-size:1rem}
.sc-sources ol{margin:0;padding-left:20px}
.sc-sources a{word-break:break-word}

/* ============================================================
   Ad slots — reserve height to prevent CLS
   ============================================================ */
.sc-ad{display:flex;align-items:center;justify-content:center;background:var(--sc-surface);
  color:#b9b3a8;font-size:.72rem;border-radius:8px;margin:22px auto;overflow:hidden}
.sc-ad--inline{min-height:280px;max-width:336px}
.sc-ad--leaderboard{min-height:90px}
@media(min-width:782px){.sc-ad--leaderboard{min-height:90px}}

/* ============================================================
   Homepage
   ============================================================ */
.home .entry-header{display:none}
.home .entry-content{max-width:100%}
.sc-hero{text-align:center;padding:clamp(36px,7vw,76px) 0 clamp(24px,4vw,40px)}
.sc-hero h1{font-size:clamp(2.1rem,6vw,3.4rem);margin:0 0 .3em}
.sc-hero p.sc-sub{font-size:1.15rem;color:var(--sc-muted);max-width:60ch;margin:0 auto 1.5em}
.sc-hero .sc-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.sc-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:28px 0}
@media(max-width:860px){.sc-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.sc-tiles{grid-template-columns:1fr}}
.sc-tile{display:block;text-decoration:none;border:1px solid var(--sc-hairline);border-radius:14px;
  padding:22px;background:#fff;transition:transform .15s ease,border-color .15s ease}
.sc-tile:hover{transform:translateY(-3px);border-color:var(--sc-teal)}
.sc-tile__k{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700;color:var(--sc-terra)}
.sc-tile h3{margin:.3em 0 .2em;font-size:1.2rem;color:var(--sc-ink)}
.sc-tile p{margin:0;font-size:.9rem;color:var(--sc-muted);max-width:none}
.sc-home-section{margin:48px 0}
.sc-home-section>h2{text-align:center;margin-top:0;margin-bottom:18px}
.sc-seasonal{background:var(--sc-surface);border-radius:14px;padding:clamp(20px,4vw,32px);text-align:center;margin:48px 0}
.sc-seasonal h2{margin-top:0}
.sc-seasonal p{max-width:60ch;margin:0 auto 1em;color:var(--sc-muted)}
.sc-empty{color:var(--sc-muted);text-align:center}

/* ============================================================
   Responsive guards
   ============================================================ */
html,body{overflow-x:clip}
img{height:auto}