/* About page — layout only. Colours via tokens; buttons/icons/hover from core. */

/* Hero */
#pph .ph-ab-tagline{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:1.15rem;line-height:1.55;color:var(--pink-light);margin-bottom:1rem;max-width:540px;}
#pph .ph-ab-tagline .gold-u{font-style:normal;font-weight:700;color:var(--gold-light);letter-spacing:.04em;}
#pph .ph-ab-mosaic{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:220px 220px;gap:.75rem;}
#pph .ph-ab-mosaic .ph-ab-m2{grid-column:2;grid-row:1 / span 2;}
#pph .ph-ab-mosaic .ph-gal,#pph .ph-ab-pair .ph-gal,#pph .ph-ab-strip .ph-gal{margin:0;height:100%;border-radius:var(--r);box-shadow:var(--shadow);}
#pph .ph-ab-mosaic .ph-gal img,#pph .ph-ab-pair .ph-gal img,#pph .ph-ab-strip .ph-gal img{height:100%;object-fit:cover;}

/* Image pairs (story, meaning of Papa) */
#pph .ph-ab-pair{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;height:440px;}
#pph .ph-ab-pair .ph-gal:nth-child(2){margin-top:2.5rem;height:calc(100% - 2.5rem);}
#pph .ph-ab-pair.tall{height:480px;}

/* Wholesale / retail availability line */
#pph .ph-ab-avail{display:flex;align-items:center;justify-content:center;gap:.7rem;max-width:760px;margin:2.25rem auto 0;padding:1rem 1.4rem;background:var(--white);border:1px solid var(--border);border-radius:var(--r);box-shadow:0 2px 16px rgba(65,41,91,.06);}
#pph .ph-ab-avail svg{width:22px;height:22px;color:var(--plum);flex-shrink:0;}
#pph .ph-ab-avail p{font-size:.9rem;color:var(--body);line-height:1.6;}
#pph .ph-ab-avail .pk{color:var(--pink);font-weight:700;}
#pph .ph-ab-avail .gd{color:var(--gold-dark);font-weight:700;}
#pph .ph-ab-avail a{color:var(--pink);text-decoration:underline;font-weight:600;}

/* Meaning of Papa (dark) */
#pph .ph-ab-lead{font-size:1.02rem;font-weight:300;color:rgba(255,255,255,.82);line-height:1.8;margin-bottom:1.1rem;}
#pph .ph-ab-lead em{color:var(--pink-light);font-style:italic;}
#pph .ph-ab-lead strong{color:#fff;font-weight:600;}
#pph .ph-ab-voice{position:relative;margin:0 0 1.5rem;padding:1.4rem 1.5rem 1.4rem 1.6rem;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-left:3px solid var(--gold);border-radius:var(--rs);}
#pph .ph-ab-voice svg{position:absolute;top:1rem;right:1.1rem;width:30px;height:30px;color:var(--pink-light);opacity:.35;}
#pph .ph-ab-voice p{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:1.12rem;line-height:1.7;color:var(--gold-light);}
#pph .bg-plum .ph-btn.light{margin-top:.5rem;}

/* Origin */
#pph .ph-ab-origin-img{height:480px;box-shadow:var(--shadow);}
#pph .ph-ab-checks{display:flex;flex-direction:column;gap:.85rem;margin:.4rem 0 1.5rem;}
#pph .ph-ab-checks li{display:flex;align-items:flex-start;gap:.75rem;font-size:.95rem;font-weight:300;color:var(--body);line-height:1.6;}
#pph .ph-ab-checks li svg{width:24px;height:24px;padding:5px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,var(--plum),var(--pink));color:#fff;margin-top:1px;}
#pph .ph-ab-checks strong{font-weight:600;color:var(--plum);}
#pph .ph-ab-checks em{color:var(--pink);font-weight:600;}

/* What Papa also is */
#pph .ph-card-d strong{font-weight:600;color:var(--plum);}
#pph .ph-card-d em{color:var(--pink);}
#pph .ph-desc strong{font-weight:600;color:var(--plum);}
#pph .ph-ab-sacred{text-align:center;font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:1.35rem;color:var(--plum);margin:2.75rem auto 2rem;max-width:640px;line-height:1.5;}
#pph .ph-ab-sacred em{color:var(--pink);}
#pph .ph-ab-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
#pph .ph-ab-strip .ph-gal{aspect-ratio:3/4;height:auto;}

/* The PapaHair Code (dark glass cards) */
#pph .ph-card.glass .ph-card-d{font-size:.95rem;}
#pph .ph-card.glass .ph-card-d em{color:var(--pink-light);}
#pph .ph-ab-cta{text-align:center;margin-top:2.75rem;}

/* Numbers */
#pph .ph-ab-stats{display:grid;grid-template-columns:repeat(4,1fr);background:var(--white);border:1px solid var(--border);border-radius:var(--r);margin-bottom:2rem;box-shadow:0 2px 16px rgba(65,41,91,.06);}
#pph .ph-ab-stat{text-align:center;padding:1.9rem 1rem;border-left:1px solid var(--border);}
#pph .ph-ab-stat:first-child{border-left:0;}
#pph .ph-ab-stat .ph-stat-val{font-size:2.6rem;background:linear-gradient(135deg,var(--plum),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent;}

/* You may like */
#pph .ph-ab-shophead{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;margin-bottom:2rem;}
#pph .ph-ab-shophead .ph-title{margin-bottom:0;}

@media (max-width:1024px){
  #pph .ph-ab-mosaic{grid-template-rows:200px 200px !important;max-width:680px !important;}
  #pph .ph-ab-pair{height:400px !important;max-width:680px !important;}
  #pph .ph-ab-pair.tall{height:420px !important;}
  #pph .ph-ab-origin-img{height:380px !important;}
  #pph .ph-ab-rev > div{order:-1 !important;}
}
@media (max-width:767px){
  #pph .ph-ab-tagline{font-size:1.02rem !important;}
  #pph .ph-ab-mosaic{grid-template-rows:150px 150px !important;gap:.5rem !important;}
  #pph .ph-ab-pair,#pph .ph-ab-pair.tall{height:300px !important;gap:.5rem !important;}
  #pph .ph-ab-pair .ph-gal:nth-child(2){margin-top:1.5rem !important;height:calc(100% - 1.5rem) !important;}
  #pph .ph-ab-avail{align-items:flex-start !important;padding:.95rem 1rem !important;}
  #pph .ph-ab-avail p{font-size:.85rem !important;}
  #pph .ph-ab-voice{padding:1.15rem 1.1rem 1.15rem 1.2rem !important;}
  #pph .ph-ab-voice p{font-size:1.02rem !important;}
  #pph .ph-ab-origin-img{height:300px !important;}
  #pph .ph-ab-sacred{font-size:1.12rem !important;margin:2rem auto 1.5rem !important;}
  #pph .ph-ab-strip{grid-template-columns:1fr 1fr !important;gap:.6rem !important;}
  #pph .ph-ab-stats{grid-template-columns:1fr 1fr !important;}
  #pph .ph-ab-stat{padding:1.3rem .75rem !important;}
  #pph .ph-ab-stat:nth-child(3){border-left:0 !important;}
  #pph .ph-ab-stat:nth-child(n+3){border-top:1px solid var(--border) !important;}
  #pph .ph-ab-stat .ph-stat-val{font-size:2rem !important;}
  #pph .ph-ab-shophead{flex-direction:column !important;align-items:flex-start !important;gap:1rem !important;margin-bottom:1.5rem !important;}
}
