/*
Theme Name: Consecrated
Theme URI: https://consecrated.app
Author: Consecrated
Author URI: https://consecrated.app
Description: Consecrated — digital protection for families, students, and pastors. A clean red/white/green landing & download site with a live install counter and scripture reminders.
Version: 1.0.0
Requires at least: 5.9
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: consecrated
*/

:root{
    --red:#C41E1E; --red-deep:#9A1616; --red-soft:#fbeaea;
    --green:#1B8A5A; --green-deep:#146c46; --green-soft:#e7f4ee;
    --ink:#1b1c1e; --ink2:#3a3d42; --muted:#6b7280;
    --bg:#ffffff; --bg2:#faf9f7; --line:#eceae6;
    --maxw:1080px; --shadow:0 16px 40px -22px rgba(20,20,20,.28);
    --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
    --body:"Roboto",system-ui,-apple-system,"Segoe UI",sans-serif;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;color:var(--ink);background:var(--bg);
    font-family:var(--body);font-weight:400;line-height:1.62;
    -webkit-font-smoothing:antialiased}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
  h1,h2,h3{margin:0;line-height:1.16;letter-spacing:-.01em;
    font-family:var(--mono);font-weight:600}
  .logo,.eyebrow,.btn,.step .n,.tier .badge,.rp,.plat .name{font-family:var(--mono)}
  .serif{font-family:Georgia,"Times New Roman",serif}
  .muted{color:var(--muted)}
  .red{color:var(--red)} .green{color:var(--green)}

  .btn{display:inline-flex;align-items:center;gap:8px;border-radius:12px;
    padding:12px 20px;font-weight:600;font-size:14.5px;cursor:pointer;
    border:1.5px solid transparent;transition:.16s}
  .btn-red{background:var(--red);color:#fff}
  .btn-red:hover{background:var(--red-deep)}
  .btn-line{background:#fff;color:var(--ink);border-color:var(--line)}
  .btn-line:hover{border-color:var(--green);color:var(--green-deep)}

  /* nav */
  nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);
    backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav-in{display:flex;align-items:center;height:66px;gap:22px}
  .logo{display:flex;align-items:center;gap:9px;font-weight:750;font-size:17px}
  .logo svg{width:26px;height:26px}
  .nav-links{display:flex;gap:26px;margin-left:auto;font-size:14px}
  .nav-links a{color:var(--ink2)} .nav-links a:hover{color:var(--red)}
  nav .btn{padding:9px 16px}

  /* hero */
  header.hero{padding:70px 0 30px}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
  .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;
    letter-spacing:.04em;text-transform:uppercase;color:var(--green-deep);
    background:var(--green-soft);border-radius:100px;padding:6px 14px}
  .hero h1{font-size:42px;font-weight:700;margin:22px 0 18px;line-height:1.12}
  .hero h1 .u{color:var(--red)}
  .hero p.lead{font-size:18.5px;color:var(--ink2);max-width:520px}
  .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
  .trust{margin-top:16px;font-size:13px;color:var(--muted)}

  /* hero art */
  .art{background:linear-gradient(160deg,var(--red-soft),#fff 60%,var(--green-soft));
    border:1px solid var(--line);border-radius:26px;padding:30px;box-shadow:var(--shadow);
    position:relative}
  .art .badge{position:absolute;top:-14px;right:22px;background:#fff;border:1px solid var(--line);
    border-radius:100px;padding:8px 15px;font-size:13px;font-weight:650;color:var(--green-deep);
    box-shadow:var(--shadow);display:flex;align-items:center;gap:7px}
  .art .badge .dot{width:9px;height:9px;border-radius:50%;background:var(--green)}
  .people{display:flex;justify-content:center;gap:8px;margin:8px 0 18px}
  .art h3{text-align:center;font-size:19px;margin-top:4px}
  .art p{text-align:center;color:var(--ink2);font-size:14px;margin:6px 0 0}
  .chips{display:flex;justify-content:center;gap:8px;margin-top:16px;flex-wrap:wrap}
  .chip{font-size:12.5px;background:#fff;border:1px solid var(--line);border-radius:100px;
    padding:6px 12px;color:var(--ink2)}

  /* audiences */
  .aud{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .aud .card{background:var(--bg2);border:1px solid var(--line);border-radius:20px;
    padding:26px;text-align:center;transition:.18s}
  .aud .card:hover{transform:translateY(-3px);box-shadow:var(--shadow);background:#fff}
  .aud h3{font-size:19px;margin-bottom:6px}
  .aud p{color:var(--muted);font-size:14px;margin:0}
  /* real-photo slots with graceful illustration fallback */
  .photo-wrap{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3;
    background:var(--bg2);margin-bottom:16px}
  .photo-wrap img.photo{width:100%;height:100%;object-fit:cover;display:block}
  .photo-fallback{position:absolute;inset:0;display:none;align-items:center;
    justify-content:center;background:linear-gradient(160deg,var(--red-soft),#fff,var(--green-soft))}
  .hero-photo{aspect-ratio:16/11;margin:0 0 16px}

  /* sections */
  section{padding:58px 0}
  .sec-head{text-align:center;max-width:620px;margin:0 auto 40px}
  .sec-head .eyebrow{margin-bottom:15px}
  .sec-head h2{font-size:29px;font-weight:700}
  .sec-head p{color:var(--muted);font-size:16.5px;margin-top:13px}

  .divide{border:0;border-top:1px solid var(--line);margin:0}

  /* features minimal list */
  .feat{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 40px;max-width:900px;margin:0 auto}
  .frow{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
  .frow .fi{flex:0 0 auto;width:44px;height:44px;border-radius:12px;display:flex;
    align-items:center;justify-content:center;background:var(--red-soft)}
  .frow:nth-child(even) .fi{background:var(--green-soft)}
  .frow .fi svg{width:22px;height:22px}
  .frow h3{font-size:16px;margin-bottom:3px}
  .frow p{margin:0;color:var(--muted);font-size:13.5px}

  /* consecration */
  .duo{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:860px;margin:0 auto}
  .state{border-radius:20px;padding:30px;border:1px solid var(--line);position:relative;overflow:hidden}
  .state .bar{position:absolute;top:0;left:0;right:0;height:5px}
  .state.on{background:var(--green-soft)} .state.on .bar{background:var(--green)}
  .state.off{background:var(--red-soft)} .state.off .bar{background:var(--red)}
  .state .tag{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .state h3{font-size:26px;margin:8px 0}
  .state.on h3{color:var(--green-deep)} .state.off h3{color:var(--red-deep)}
  .state p{margin:0;color:var(--ink2);font-size:14px}

  /* verse */
  .verse-wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;max-width:940px;margin:0 auto}
  .verse-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;
    box-shadow:var(--shadow);max-width:400px}
  .verse-card .vbar{height:5px;background:var(--red)}
  .verse-card .vbody{padding:24px}
  .verse-card .vtop{display:flex;justify-content:space-between;font-size:11.5px;font-weight:700;letter-spacing:.05em}
  .verse-card .vtop .brand{color:var(--muted)}
  .verse-card .vtext{font-family:Georgia,serif;font-size:18.5px;margin:16px 0 12px;transition:opacity .4s}
  .verse-card .vref{font-style:italic;font-size:14px}
  .verse-card .vmeta{color:var(--muted);font-size:12px;margin-top:14px}
  .pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
  .pill{border:1px solid var(--line);border-radius:100px;padding:8px 15px;font-size:13.5px;color:var(--ink2)}
  .pill b{color:var(--ink)}

  /* steps */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:900px;margin:0 auto}
  .step{text-align:center}
  .step .n{width:44px;height:44px;border-radius:50%;background:var(--red);color:#fff;font-weight:700;
    display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:17px}
  .step:nth-child(2) .n{background:var(--green)}
  .step h3{font-size:16.5px;margin-bottom:5px}
  .step p{color:var(--muted);font-size:14px;margin:0}

  /* platforms inline */
  .plats{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
  .plat{border:1px solid var(--line);border-radius:14px;padding:14px 22px;text-align:center;background:var(--bg2);min-width:130px}
  .plat .name{font-weight:650;font-size:15px}
  .plat .st{font-size:12px;margin-top:3px}
  .plat .st.ready{color:var(--green)} .plat .st.soon{color:var(--muted)}

  /* pricing */
  .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .tier{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;display:flex;flex-direction:column}
  .tier.hi{border-color:var(--red);box-shadow:0 0 0 1px var(--red),var(--shadow)}
  .tier .badge{align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.04em;color:#fff;
    background:var(--red);border-radius:100px;padding:4px 11px;margin-bottom:10px}
  .tier h3{font-size:19px} .tier .price{font-size:14px;color:var(--muted);margin:5px 0 16px}
  .tier ul{list-style:none;padding:0;margin:0 0 20px;flex:1}
  .tier li{font-size:13.5px;color:var(--ink2);padding:6px 0 6px 24px;position:relative}
  .tier li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:800}
  .tier .btn{width:100%;justify-content:center}

  /* roadmap compact */
  .road{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:900px;margin:0 auto}
  .rp{border:1px solid var(--line);border-radius:100px;padding:9px 16px;font-size:13px;background:var(--bg2)}
  .rp b{color:var(--red)}

  /* download */
  .band{background:var(--ink);color:#fff;border-radius:26px;padding:52px 40px;text-align:center;position:relative;overflow:hidden}
  .band::before{content:"";position:absolute;inset:0;background:
    radial-gradient(500px 240px at 15% 0,rgba(196,30,30,.5),transparent 60%),
    radial-gradient(500px 240px at 85% 100%,rgba(27,138,90,.5),transparent 60%)}
  .band>*{position:relative}
  .band .eyebrow{background:#ffffff1a;color:#fff}
  .band h2{font-size:32px;margin:16px 0 12px}
  .band p{color:#e7e7ea;max-width:540px;margin:0 auto 24px}
  .band .trust{color:#c9c9cf}

  footer{border-top:1px solid var(--line);padding:42px 0 60px;margin-top:8px}
  .foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
  .foot-verse{font-family:Georgia,serif;font-style:italic;color:var(--red);font-size:15px;margin-top:8px}
  .foot small{color:var(--muted);font-size:12.5px}

  /* live install counter */
  .livecount{margin-top:16px;display:inline-flex;align-items:center;gap:8px;font-size:13.5px;
    color:var(--ink2);background:var(--green-soft);border:1px solid #cfe9dd;border-radius:100px;padding:7px 15px}
  .livecount b{font-family:var(--mono);color:var(--green-deep)}
  .band .livecount{background:#ffffff1a;border-color:#ffffff33;color:#eee}
  .band .livecount b{color:#fff}

  /* free-first pricing */
  .free-hero{display:grid;grid-template-columns:1.1fr .9fr;border:2px solid var(--green);
    border-radius:22px;overflow:hidden;box-shadow:var(--shadow);background:#fff}
  .free-hero .fl{padding:36px}
  .free-hero .fr{padding:36px;background:var(--green-soft);border-left:1px solid var(--line)}
  .free-badge{display:inline-block;font-family:var(--mono);font-size:12px;font-weight:700;
    letter-spacing:.06em;color:#fff;background:var(--green);border-radius:100px;padding:5px 13px}
  .free-hero h3{font-size:25px;margin:14px 0 8px}
  .free-hero .fl p{color:var(--ink2);font-size:15px;margin:0 0 16px}
  .free-hero .price-line{font-family:var(--mono);font-size:14px;color:var(--muted);margin-bottom:18px}
  .free-hero .price-line b{color:var(--green-deep);font-size:22px}
  .free-hero .fr h4{font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;
    color:var(--green-deep);margin:0 0 12px}
  .free-hero ul{list-style:none;padding:0;margin:0}
  .free-hero li{font-size:14px;color:var(--ink2);padding:7px 0 7px 26px;position:relative}
  .free-hero li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:800}
  .upsell{text-align:center;color:var(--muted);font-size:14px;margin:36px 0 16px}
  .tiers.small{grid-template-columns:repeat(5,1fr);gap:12px}
  .tiers.small .tier{padding:18px}
  .tiers.small .tier h3{font-size:15px}
  .tiers.small .tier .price{font-size:11.5px;margin:3px 0 10px}
  .tiers.small .tier ul{margin-bottom:14px}
  .tiers.small .tier li{font-size:12px;padding:4px 0 4px 18px}
  .tiers.small .btn{padding:8px 12px;font-size:12.5px}

  @media(max-width:880px){
    .hero-grid,.duo,.verse-wrap{grid-template-columns:1fr}
    .aud,.feat,.steps,.tiers,.free-hero{grid-template-columns:1fr}
    .tiers.small{grid-template-columns:1fr 1fr}
    .nav-links{display:none}
    .hero h1{font-size:38px}
  }