/*
Theme Name: Paws in Our Hearts Child
Theme URI: https://pawsinourhearts.com
Description: Custom child theme for the Paws in Our Hearts homepage, built on Twenty Twenty-Four.
Author: Paws in Our Hearts
Template: twentytwentyfour
Version: 1.0.0
Text Domain: paws-child
*/

:root{
  --cream: #FBF8FC;
  --cream-deep: #F3EAF7;
  --ink: #2B2733;
  --ink-soft: #6B6478;
  --rust: #7C4DA6;
  --rust-deep: #5F3985;
  --rust-pale: #EEE1F5;
  --sage: #C0574B;
  --sage-pale: #FBE3E0;
  --gold: #4E8A5F;
  --gold-pale: #DFF1E3;
  --line: #E7DCEF;
  --white: #FFFFFF;
  --radius: 18px;
  --shadow: 0 12px 32px -16px rgba(43, 39, 51, 0.18);
}

/* Reset a few Twenty Twenty-Four defaults so the custom homepage renders edge-to-edge */
.pioh-page *{box-sizing:border-box;}
.pioh-page{
  font-family:'Karla', sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.pioh-page img{max-width:100%; display:block;}
.pioh-page a{color:inherit; text-decoration:none;}
.pioh-page h1,.pioh-page h2,.pioh-page h3,.pioh-page h4{font-family:'Lora', serif; font-weight:600; line-height:1.15; color:var(--ink); margin:0;}
.pioh-page .em{font-style:italic; font-weight:500; color:var(--rust-deep);}
.pioh-page .wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
@media(max-width:640px){.pioh-page .wrap{padding:0 20px;}}

@media (prefers-reduced-motion: reduce){
  .pioh-page *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

/* ---------- Nav ---------- */
.pioh-page header.site{
  position:sticky; top:0; z-index:50;
  background:rgba(251,245,238,0.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.pioh-page .nav{display:flex; align-items:center; justify-content:space-between; padding:16px 0;}
.pioh-page .brand{display:flex; align-items:center; gap:10px;}
.pioh-page .brand .mark{width:38px; height:38px; border-radius:50%; background:var(--rust); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.pioh-page .brand .mark svg{width:20px; height:20px;}
.pioh-page .brand .text h1{font-size:1.05rem; letter-spacing:0.2px;}
.pioh-page .brand .text p{font-size:0.72rem; color:var(--ink-soft); font-style:italic; font-family:'Lora', serif; margin:0;}
.pioh-page nav.links{display:flex; gap:30px; align-items:center;}
.pioh-page nav.links a{font-size:0.9rem; font-weight:500; color:var(--ink-soft); position:relative; padding:4px 0;}
.pioh-page nav.links a.active{color:var(--rust-deep);}
.pioh-page nav.links a.active::after{content:''; position:absolute; left:0; right:0; bottom:-3px; height:2px; background:var(--rust);}
.pioh-page nav.links a:hover{color:var(--rust-deep);}
.pioh-page .nav-actions{display:flex; align-items:center; gap:12px;}
.pioh-page .icon-btn{width:38px; height:38px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--ink-soft); background:var(--white);}
.pioh-page .btn{display:inline-flex; align-items:center; gap:8px; padding:11px 20px; border-radius:999px; font-weight:600; font-size:0.88rem; border:1px solid transparent; cursor:pointer; white-space:nowrap;}
.pioh-page .btn-primary{background:var(--rust); color:var(--white);}
.pioh-page .btn-primary:hover{background:var(--rust-deep); color:var(--white);}
.pioh-page .btn-ghost{background:transparent; border-color:var(--line); color:var(--ink);}
.pioh-page .btn-ghost:hover{border-color:var(--rust);}
.pioh-page .btn-outline-rust{background:var(--white); border-color:var(--rust); color:var(--rust-deep);}
.pioh-page .mobile-toggle{display:none; background:none; border:none; font-size:1.4rem; color:var(--ink);}
@media(max-width:900px){
  .pioh-page nav.links{display:none;}
  .pioh-page .mobile-toggle{display:block;}
}

/* ---------- Hero ---------- */
.pioh-page .hero{position:relative; overflow:hidden; padding:64px 0 0;}
.pioh-page .hero-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; padding-bottom:56px;}
.pioh-page .eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:0.72rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--rust-deep); font-weight:700; margin-bottom:18px;}
.pioh-page .eyebrow::before{content:''; width:16px; height:1px; background:var(--rust);}
.pioh-page .hero h2{font-size:clamp(2.1rem, 4vw, 3.1rem); margin-bottom:20px; letter-spacing:-0.5px;}
.pioh-page .hero p.lead{font-size:1.05rem; color:var(--ink-soft); max-width:460px; margin-bottom:30px;}
.pioh-page .hero-ctas{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:8px;}
.pioh-page .btn-lg{padding:14px 26px; font-size:0.95rem;}
.pioh-page .hero-photo{position:relative; border-radius:24px; overflow:hidden; aspect-ratio:6/5; box-shadow:var(--shadow);}
.pioh-page .hero-photo img{width:100%; height:100%; object-fit:cover;}
.pioh-page .hero-photo .caption-chip{position:absolute; left:16px; bottom:16px; background:rgba(255,253,250,0.92); backdrop-filter:blur(6px); padding:10px 14px; border-radius:12px; font-size:0.78rem; color:var(--ink-soft); display:flex; align-items:center; gap:8px; font-style:italic; font-family:'Lora',serif;}
.pioh-page .flame{color:var(--gold); animation:pioh-flicker 2.6s ease-in-out infinite;}
@keyframes pioh-flicker{
  0%,100%{opacity:1; transform:translateY(0) scale(1);}
  45%{opacity:0.75; transform:translateY(-1px) scale(0.96);}
  70%{opacity:0.9; transform:translateY(0.5px) scale(1.03);}
}
@media(max-width:900px){
  .pioh-page .hero-grid{grid-template-columns:1fr; padding-bottom:36px;}
  .pioh-page .hero-photo{order:-1;}
}

/* trust strip */
.pioh-page .trust-strip{background:var(--white); border:1px solid var(--line); border-radius:20px; display:grid; grid-template-columns:repeat(4,1fr); box-shadow:var(--shadow); transform:translateY(38px); position:relative; z-index:2;}
.pioh-page .trust-item{padding:22px 20px; display:flex; align-items:center; gap:12px; border-right:1px solid var(--line);}
.pioh-page .trust-item:last-child{border-right:none;}
.pioh-page .trust-item .ico{width:34px; height:34px; flex-shrink:0; color:var(--rust);}
.pioh-page .trust-item span{font-size:0.85rem; font-weight:600;}
@media(max-width:900px){
  .pioh-page .trust-strip{grid-template-columns:repeat(2,1fr); transform:translateY(24px);}
  .pioh-page .trust-item{border-bottom:1px solid var(--line);}
  .pioh-page .trust-item:nth-child(2n){border-right:none;}
}

.pioh-page .paw-divider{display:flex; justify-content:center; gap:22px; padding:78px 0 40px; opacity:0.55;}
.pioh-page .paw-divider svg{width:16px; height:16px; color:var(--rust);}
.pioh-page .paw-divider svg:nth-child(2n){opacity:0.55; transform:translateY(4px);}

.pioh-page .section{padding:20px 0 70px;}
.pioh-page .section-head{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:30px; gap:20px; flex-wrap:wrap;}
.pioh-page .section-head .kicker{display:flex; align-items:center; gap:10px; margin-bottom:6px;}
.pioh-page .section-head .kicker .ico{width:22px; height:22px; color:var(--rust);}
.pioh-page .section-head h3{font-size:1.7rem;}
.pioh-page .section-head p{color:var(--ink-soft); font-size:0.92rem; margin-top:4px;}
.pioh-page .see-all{font-size:0.86rem; font-weight:700; color:var(--rust-deep); display:flex; align-items:center; gap:6px;}

/* ---------- Story cards ---------- */
.pioh-page .stories-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.pioh-page .story-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:22px; display:flex; flex-direction:column; gap:14px; transition:transform 0.2s ease, box-shadow 0.2s ease;}
.pioh-page .story-card:hover{transform:translateY(-3px); box-shadow:var(--shadow);}
.pioh-page .story-top{display:flex; align-items:center; justify-content:space-between;}
.pioh-page .who{display:flex; align-items:center; gap:10px;}
.pioh-page .avatar{width:38px; height:38px; border-radius:50%; background:var(--sage-pale); display:flex; align-items:center; justify-content:center; font-family:'Lora',serif; font-weight:600; color:var(--sage); flex-shrink:0;}
.pioh-page .who .name{font-size:0.88rem; font-weight:700;}
.pioh-page .who .time{font-size:0.72rem; color:var(--ink-soft);}
.pioh-page .tag{font-size:0.68rem; font-weight:700; padding:5px 10px; border-radius:999px; display:inline-flex; align-items:center; gap:5px; white-space:nowrap;}
.pioh-page .tag-dog{background:var(--rust-pale); color:var(--rust-deep);}
.pioh-page .tag-cat{background:var(--sage-pale); color:var(--sage);}
.pioh-page .tag-other{background:var(--gold-pale); color:var(--gold);}
.pioh-page .story-card h4{font-size:1.08rem; line-height:1.3;}
.pioh-page .story-card .snippet{font-size:0.87rem; color:var(--ink-soft);}
.pioh-page .story-foot{display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:6px; border-top:1px dashed var(--line);}
.pioh-page .story-stats{display:flex; gap:14px; font-size:0.78rem; color:var(--ink-soft);}
.pioh-page .story-stats span{display:flex; align-items:center; gap:5px;}
.pioh-page .read-more{font-size:0.8rem; font-weight:700; color:var(--rust-deep); display:flex; align-items:center; gap:4px;}
@media(max-width:900px){.pioh-page .stories-grid{grid-template-columns:1fr;}}

/* ---------- Join + Not alone ---------- */
.pioh-page .two-col{display:grid; grid-template-columns:1.15fr 0.85fr; gap:22px;}
.pioh-page .join-card{background:linear-gradient(135deg, var(--rust-pale) 0%, var(--cream-deep) 100%); border-radius:var(--radius); padding:36px; display:flex; align-items:center; gap:26px; border:1px solid var(--line);}
.pioh-page .join-card .heart-badge{width:66px; height:66px; border-radius:50%; background:var(--rust); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--white);}
.pioh-page .join-card h3{font-size:1.4rem; margin-bottom:8px;}
.pioh-page .join-card p{font-size:0.9rem; color:var(--ink-soft); margin-bottom:18px; max-width:400px;}
.pioh-page .avatars-row{display:flex; align-items:center; gap:10px; margin-top:16px;}
.pioh-page .stack{display:flex;}
.pioh-page .stack .avatar{width:30px; height:30px; font-size:0.7rem; border:2px solid var(--white); margin-left:-8px;}
.pioh-page .stack .avatar:first-child{margin-left:0;}
.pioh-page .avatars-row .count{font-size:0.82rem; color:var(--ink-soft); font-weight:600;}

.pioh-page .alone-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:28px;}
.pioh-page .alone-card h3{font-size:1.15rem; margin-bottom:16px; display:flex; align-items:center; gap:9px;}
.pioh-page .alone-card h3 .ico{width:20px; height:20px; color:var(--rust);}
.pioh-page .alone-item{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 0; border-bottom:1px solid var(--line);}
.pioh-page .alone-item:last-child{border-bottom:none;}
.pioh-page .alone-item .left{display:flex; align-items:center; gap:12px;}
.pioh-page .alone-item .ico-wrap{width:36px; height:36px; border-radius:10px; background:var(--sage-pale); color:var(--sage); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.pioh-page .alone-item .title{font-size:0.88rem; font-weight:700;}
.pioh-page .alone-item .sub{font-size:0.76rem; color:var(--ink-soft);}
.pioh-page .arrow{color:var(--rust); flex-shrink:0;}
@media(max-width:900px){.pioh-page .two-col{grid-template-columns:1fr;} .pioh-page .join-card{flex-direction:column; text-align:center;}}

/* ---------- 3 col bottom ---------- */
.pioh-page .three-col{display:grid; grid-template-columns:1fr 1fr 0.9fr; gap:22px;}
.pioh-page .list-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:24px;}
.pioh-page .list-card h4{font-size:1rem; display:flex; align-items:center; gap:9px; margin-bottom:16px;}
.pioh-page .list-card h4 .ico{width:19px; height:19px; color:var(--rust);}
.pioh-page .disc-item{padding:11px 0; border-bottom:1px solid var(--line);}
.pioh-page .disc-item:last-child{border-bottom:none;}
.pioh-page .disc-item a{font-size:0.86rem; font-weight:600; display:block; margin-bottom:3px;}
.pioh-page .disc-item .meta{font-size:0.74rem; color:var(--ink-soft); display:flex; justify-content:space-between;}
.pioh-page .res-item{display:flex; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); align-items:center;}
.pioh-page .res-item:last-child{border-bottom:none;}
.pioh-page .res-item .thumb{width:42px; height:42px; border-radius:10px; background:var(--gold-pale); flex-shrink:0; display:flex; align-items:center; justify-content:center; color:var(--gold);}
.pioh-page .res-item .title{font-size:0.85rem; font-weight:600;}
.pioh-page .res-item .type{font-size:0.73rem; color:var(--ink-soft);}
.pioh-page .view-link{font-size:0.8rem; font-weight:700; color:var(--rust-deep); margin-top:14px; display:flex; align-items:center; gap:5px;}

.pioh-page .comfort-card{background:var(--ink); color:var(--cream); border-radius:var(--radius); padding:28px; display:flex; flex-direction:column; justify-content:space-between;}
.pioh-page .comfort-card .top{display:flex; align-items:center; gap:9px; font-size:0.85rem; font-weight:700; color:var(--gold-pale);}
.pioh-page .comfort-card blockquote{font-family:'Lora',serif; font-style:italic; font-size:1.25rem; line-height:1.4; margin:22px 0;}
.pioh-page .comfort-card .sign{font-size:0.8rem; color:#C9C2B6;}
.pioh-page .comfort-card .flame-row{display:flex; justify-content:flex-end; margin-top:12px;}

/* ---------- footer ---------- */
.pioh-page footer{background:var(--cream-deep); border-top:1px solid var(--line); margin-top:20px;}
.pioh-page .footer-top{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:40px; padding:52px 0 36px;}
.pioh-page .footer-brand .brand{margin-bottom:14px;}
.pioh-page .footer-brand p{font-size:0.88rem; color:var(--ink-soft); max-width:300px;}
.pioh-page .footer-col h5{font-size:0.9rem; margin-bottom:14px; font-weight:700;}
.pioh-page .subscribe-row{display:flex; gap:8px; margin-top:10px;}
.pioh-page .subscribe-row input{flex:1; padding:11px 14px; border-radius:999px; border:1px solid var(--line); font-family:'Karla',sans-serif; font-size:0.85rem; background:var(--white);}
.pioh-page .social-row{display:flex; gap:10px; margin-top:14px;}
.pioh-page .social-row a{width:36px; height:36px; border-radius:50%; background:var(--white); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--rust-deep);}
.pioh-page .footer-bottom{background:var(--rust-deep); border-top:none; padding:20px 0;}
.pioh-page .footer-bottom p{font-size:0.78rem; color:#E5D6EF; margin:0;}
.pioh-page .footer-bottom .legal{display:flex; gap:22px; font-size:0.78rem; color:#E5D6EF;}
.pioh-page .footer-bottom .legal a:hover{color:#FFFFFF;}
@media(max-width:900px){.pioh-page .footer-top{grid-template-columns:1fr; gap:28px;}}

/* scroll reveal */
.pioh-page .reveal{opacity:0; transform:translateY(18px); transition:opacity 0.6s ease, transform 0.6s ease;}
.pioh-page .reveal.in{opacity:1; transform:translateY(0);}
