/*
Theme Name: KnowMyCover Child
Theme URI: https://knowmycover.com
Description: Child theme for GeneratePress. Applies the KnowMyCover design (navy + green, editorial serif body) and ready-to-use article components (key takeaways, tip box, FAQ, author bio). Built for a fast, AdSense-friendly insurance content site.
Author: KnowMyCover
Template: generatepress
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: knowmycover-child
*/

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root{
  --ink:#12233A;
  --ink-soft:#2A3F57;
  --paper:#F6F7F4;
  --paper-2:#EEF0EA;
  --white:#FFFFFF;
  --green:#178A5E;
  --green-soft:#E4F2EA;
  --gold:#D8A32E;
  --slate:#5A6B7B;
  --line:#DDE1DA;
  --shadow:0 1px 2px rgba(18,35,58,.06), 0 12px 32px rgba(18,35,58,.08);
  --radius:16px;
}

/* ============================================================
   BASE TYPOGRAPHY
   ============================================================ */
body{
  font-family:"Newsreader",Georgia,serif;
  background:var(--paper);
  color:var(--ink);
  font-size:19px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,
.site-title,.main-title{
  font-family:"Bricolage Grotesque",sans-serif !important;
  font-weight:700;
  line-height:1.15;
  letter-spacing:-0.02em;
  color:var(--ink);
}
a{color:var(--green)}
a:hover{color:var(--ink)}

/* Utility label used in components */
.eyebrow{font-family:"Inter",sans-serif;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}

/* ============================================================
   HEADER / NAV  (GeneratePress markup)
   ============================================================ */
.site-header{
  background:rgba(246,247,244,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.site-title a{color:var(--ink);font-size:22px;letter-spacing:-0.02em}
.main-navigation,
.main-navigation ul{background:transparent}
.main-navigation .main-nav ul li a{
  font-family:"Inter",sans-serif;
  font-weight:500;
  font-size:15px;
  color:var(--ink-soft);
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a{color:var(--green)}

/* ============================================================
   BUTTONS
   ============================================================ */
.button,
button,
input[type="submit"],
.wp-block-button__link,
.main-navigation .menu-bar-items .menu-bar-item > a.button{
  font-family:"Inter",sans-serif;
  font-weight:600;
  font-size:15px;
  background:var(--ink);
  color:#fff;
  border:1px solid transparent;
  border-radius:999px;
  padding:12px 24px;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.button:hover,
button:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover{
  background:var(--ink-soft);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(18,35,58,.22);
}
.button.is-ghost,
.wp-block-button.is-style-outline .wp-block-button__link{
  background:transparent;color:var(--ink);border-color:var(--line);
}

/* ============================================================
   CONTENT AREA
   ============================================================ */
.entry-content{font-size:19px}
.entry-content p{margin-bottom:22px}
.entry-content h2{font-size:clamp(26px,3.4vw,34px);margin:44px 0 14px}
.entry-content h3{font-size:22px;margin:30px 0 10px}
.entry-content ul,.entry-content ol{margin-bottom:22px;padding-left:24px}
.entry-content li{margin-bottom:9px}
.entry-content a{color:var(--green);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}

/* Post title + meta */
.entry-title{font-size:clamp(32px,5vw,50px);letter-spacing:-0.03em;margin-bottom:14px}
.entry-meta{font-family:"Inter",sans-serif;font-size:13.5px;color:var(--slate)}
.entry-meta a{color:var(--slate)}
.entry-meta a:hover{color:var(--green)}

/* Featured image */
.post-image img,.wp-post-image{border-radius:var(--radius)}

/* Cards / posts on blog + archive */
.separate-containers .inside-article,
.one-container .site-main > *{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

/* ============================================================
   REUSABLE ARTICLE COMPONENTS
   Use these class names in the block editor (Custom HTML block)
   ============================================================ */

/* Key takeaways */
.kmc-takeaways{
  background:var(--green-soft);
  border:1px solid #BFE0CD;
  border-radius:var(--radius);
  padding:22px 26px;
  margin:30px 0;
}
.kmc-takeaways .label{
  font-family:"Inter",sans-serif;font-size:13px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--green);
  display:block;margin-bottom:12px;
}
.kmc-takeaways ul{list-style:none;padding:0;margin:0;font-size:17px}
.kmc-takeaways li{position:relative;padding-left:28px;margin-bottom:10px}
.kmc-takeaways li::before{content:"";position:absolute;left:0;top:8px;width:15px;height:15px;border-radius:50%;background:var(--green)}
.kmc-takeaways li::after{content:"";position:absolute;left:4.5px;top:11px;width:6px;height:3px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(-45deg)}

/* Tip / callout box */
.kmc-tip{
  border-left:4px solid var(--gold);
  background:var(--white);
  border-radius:0 12px 12px 0;
  padding:16px 22px;
  margin:26px 0;
  font-size:17.5px;
}
.kmc-tip .label{
  font-family:"Inter",sans-serif;font-size:12px;letter-spacing:.05em;
  text-transform:uppercase;color:var(--gold);font-weight:700;
  display:block;margin-bottom:5px;
}

/* Comparison table */
.kmc-table{width:100%;border-collapse:collapse;margin:26px 0;font-family:"Inter",sans-serif;font-size:16px}
.kmc-table th{background:var(--ink);color:#fff;text-align:left;padding:13px 16px;font-weight:600;font-size:14px}
.kmc-table td{padding:12px 16px;border-bottom:1px solid var(--line)}
.kmc-table tr:nth-child(even) td{background:var(--white)}

/* FAQ */
.kmc-faq-item{border-bottom:1px solid var(--line);padding:18px 0}
.kmc-faq-item h3{font-size:20px;margin:0 0 8px}
.kmc-faq-item p{font-size:17px;color:var(--ink-soft);margin:0}

/* Author bio (E-E-A-T) */
.kmc-author{
  display:flex;gap:20px;align-items:flex-start;
  background:var(--white);border:1px solid var(--line);
  border-radius:var(--radius);padding:24px;margin:36px 0;box-shadow:var(--shadow);
}
.kmc-author .avatar{
  width:60px;height:60px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,#B9D3C5,#178A5E);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:22px;
}
.kmc-author .name{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:19px;margin:0 0 4px}
.kmc-author .role{font-family:"Inter",sans-serif;font-size:13px;font-weight:600;color:var(--green);margin:0 0 10px}
.kmc-author .desc{font-family:"Inter",sans-serif;font-size:14.5px;color:var(--slate);margin:0}

/* Ad slot placeholder (visual guide only; real ads via Ad Inserter) */
.kmc-ad{
  border:1.5px dashed #C3CBD6;border-radius:12px;
  background:repeating-linear-gradient(45deg,#F0F2EE,#F0F2EE 10px,#EBEEE8 10px,#EBEEE8 20px);
  min-height:110px;margin:32px 0;
  display:flex;align-items:center;justify-content:center;
  font-family:"Inter",sans-serif;font-size:12.5px;color:#8593A2;letter-spacing:.04em;text-align:center;
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer,.site-info{
  background:var(--paper);
  border-top:1px solid var(--line);
  font-family:"Inter",sans-serif;
  font-size:13.5px;
  color:var(--slate);
}
.site-info a{color:var(--slate)}
.site-info a:hover{color:var(--green)}

/* ============================================================
   ACCESSIBILITY
   ============================================================ */
:focus-visible{outline:3px solid var(--green);outline-offset:2px;border-radius:6px}
@media(prefers-reduced-motion:reduce){*{transition:none !important}}
