/* HerClarity final launch pass
   Home/photo, Community, Explore, Private, Profile, public/auth and narrow-iPhone QA.
   Presentation only: no auth, verification, AI, database, moderation or navigation logic changes. */

/* ---------- Global mobile QA guardrails ---------- */
html{-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
.screen,.card,.panel,.modal,.tool-panel,.post,.resource-card,.option-card,.hub-card{min-width:0}
.page-title,.section-title,.welcome-name,.post-title,.tool-panel h3,.hub-card h2,.option-card h3,.resource-card h3{overflow-wrap:anywhere}
.body,.small,.post-body,.resource-card p,.option-card p,.hub-card p,.legal p,.legal li{overflow-wrap:anywhere}
.screen.with-nav{padding-bottom:calc(var(--nav-height) + env(safe-area-inset-bottom,0px) + 42px)!important}
.btn,.settings-button,.mood-button,.post-actions button,.entry-actions button,.resource-actions a,.resource-actions button{min-height:44px}
.form-group input,.form-group textarea,.form-group select,.field{max-width:100%}

/* ---------- Home / photo composition ---------- */
.home-editorial-head{gap:12px!important;margin-bottom:2px!important}
.home-copy-block{padding-right:5px}
.home-copy-block .body{max-width:315px!important}
.member-photo{
  min-height:168px!important;
  aspect-ratio:2.08/1;
  background-position:center 38%!important;
  border-radius:26px 7px 26px 26px!important;
  box-shadow:0 13px 30px rgba(71,21,42,.095)!important;
}
.member-photo:before{inset:7px!important}
.member-photo:after{
  content:"A PRIVATE PLACE TO FIND YOUR FOOTING"!important;
  max-width:235px;
  padding:6px 9px 5px!important;
  white-space:normal;
  line-height:1.25;
  letter-spacing:.11em!important;
  background:rgba(252,248,243,.91)!important;
}
.welcome-name{margin-bottom:9px!important}
.home-guide{margin-top:16px!important}
.home-grid{margin-top:1px}
.home-card{position:relative;overflow:hidden}
.home-card:after{
  content:"";
  position:absolute;
  right:-26px;
  bottom:-35px;
  width:78px;
  height:78px;
  border:1px solid rgba(103,34,60,.055);
  border-radius:50%;
}
.support-strip{align-items:center!important}

/* ---------- Community ---------- */
.section-head{margin-bottom:15px!important;padding-bottom:14px!important}
.section-head .page-title{font-size:clamp(41px,10.8vw,49px)!important;line-height:.92!important;margin-bottom:8px!important}
.section-head .small{font-size:11.5px!important;line-height:1.5!important}
#toggleComposer{
  margin-top:14px!important;
  min-height:50px!important;
  border-radius:17px 6px 17px 17px!important;
}
#toggleComposer:before{width:26px!important;height:26px!important;flex-basis:26px!important;font-size:18px!important}
.privacy-note{margin-bottom:14px}
.privacy-note p{font-size:11px!important;line-height:1.52!important}
.composer{padding:18px!important;margin:13px 0 15px!important}
.composer .form-group{margin-bottom:13px}
.composer textarea{min-height:118px!important}
.composer .check-row{margin:3px 0 15px}
.feed{gap:12px!important;margin-top:13px!important}
.post{padding:19px 17px 17px!important;border-radius:24px 7px 24px 24px!important}
.post-meta{font-size:9.5px!important;gap:5px!important}
.post-title{font-size:29px!important;line-height:1!important;margin:14px 0 9px!important}
.post-body{font-size:12.5px!important;line-height:1.58!important;margin:0 0 15px!important;white-space:pre-wrap}
.post-actions{gap:6px!important;padding-top:12px!important}
.post-actions button,.entry-actions button{min-height:36px!important;padding:0 10px!important;font-size:9px!important}
.reply{
  grid-template-columns:34px minmax(0,1fr)!important;
  gap:10px!important;
  padding:15px 0!important;
}
.reply .avatar{width:34px!important;height:34px!important;font-size:13px!important}
.reply p{font-size:12px;line-height:1.55;overflow-wrap:anywhere}
.reply .entry-actions{flex-wrap:wrap}

/* ---------- Explore ---------- */
.hub-grid{gap:11px!important}
.hub-card{
  position:relative;
  min-height:150px;
  padding:19px!important;
  overflow:hidden;
  border-radius:24px 7px 24px 24px!important;
}
.hub-card:after{
  content:"→";
  position:absolute;
  right:16px;
  bottom:14px;
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  border:1px solid rgba(103,34,60,.10);
  border-radius:50%;
  color:#6b2941;
  background:rgba(255,253,249,.56);
  font-size:13px;
}
.hub-card:nth-child(1){background:linear-gradient(145deg,rgba(255,253,249,.95),rgba(236,220,202,.39))!important}
.hub-card:nth-child(2){background:linear-gradient(145deg,rgba(255,253,249,.95),rgba(247,236,226,.82))!important}
.hub-card:nth-child(3){
  background:linear-gradient(145deg,#5a1c33,#7b3149)!important;
  border-color:rgba(216,190,160,.35)!important;
}
.hub-card:nth-child(3) .eyebrow{color:#f1dce2!important}
.hub-card:nth-child(3) .eyebrow:before{background:linear-gradient(90deg,#f4dce2,#d8bea0)!important}
.hub-card:nth-child(3) h2,.hub-card:nth-child(3) p{color:#fff!important}
.hub-card:nth-child(3) p{opacity:.86}
.hub-card:nth-child(3):after{color:#fff;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.08)}
.hub-card h2{font-size:30px!important;line-height:.98!important;margin:14px 36px 8px 0!important}
.hub-card p{font-size:11px!important;line-height:1.5!important;max-width:300px}
.option-grid,.resource-grid{gap:11px!important}
.option-card,.resource-card{padding:18px!important;border-radius:24px 7px 24px 24px!important}
.option-card h3,.resource-card h3{font-size:27px!important;line-height:1!important;margin:13px 0 8px!important}
.option-card>p,.resource-card>p{font-size:11.5px!important;line-height:1.52!important}
.option-card .text-button{min-height:38px;padding-left:0}
.detail{font-size:11px!important;line-height:1.55!important}
.detail.open{padding-top:12px;margin-top:5px;border-top:1px solid rgba(103,34,60,.09)}
.resource-actions{gap:6px!important;margin-top:12px!important}
.resource-actions a,.resource-actions button{min-height:38px!important;padding:0 10px!important;font-size:9.5px!important}
.source-line{margin-top:11px!important;padding-top:9px;border-top:1px solid rgba(103,34,60,.08);font-size:8.5px!important;line-height:1.45!important}

/* ---------- Private space ---------- */
.tool-stack{display:grid;gap:13px!important}
.tool-panel{
  padding:19px!important;
  border-radius:25px 7px 25px 25px!important;
  background:linear-gradient(145deg,rgba(255,253,249,.93),rgba(247,238,231,.72))!important;
  box-shadow:0 9px 24px rgba(71,21,42,.05)!important;
}
.tool-panel:nth-child(even){background:linear-gradient(145deg,rgba(255,253,249,.94),rgba(241,224,229,.40))!important}
.tool-panel h3{font:500 29px/1 var(--serif)!important;letter-spacing:-.02em!important;margin:12px 0 15px!important;color:#4d2835!important}
.tool-panel>p{font-size:11px;line-height:1.52;color:#74646a}
.mood-grid{grid-template-columns:1fr 1fr!important;gap:7px!important}
.mood-button{min-height:44px!important;border-radius:15px 5px 15px 15px!important;font-size:10.5px!important}
.mood-button:last-child:nth-child(odd){grid-column:1/-1}
.mood-button.selected{box-shadow:0 7px 15px rgba(71,21,42,.08)}
.journal-entry{
  padding:15px!important;
  margin-top:10px!important;
  border:1px solid rgba(103,34,60,.10);
  border-radius:20px 6px 20px 20px!important;
  background:rgba(255,253,249,.66)!important;
}
.journal-entry h4{font:500 23px/1 var(--serif);color:#4d2835;margin:0}
.journal-entry p{font-size:11px!important;line-height:1.55!important;white-space:pre-wrap}
.saved-chip{
  min-height:42px;
  gap:8px;
  padding:7px 7px 7px 12px!important;
  border-radius:15px 5px 15px 15px!important;
  font-size:10.5px!important;
}
.saved-chip span{min-width:0;overflow-wrap:anywhere}
.saved-chip button{width:30px!important;height:30px!important;flex:0 0 30px!important}
.plan-entry{margin-top:10px!important}

/* ---------- Profile / privacy ---------- */
.profile-card{padding:5px 16px!important;border-radius:24px 7px 24px 24px!important;background:rgba(255,253,249,.74)!important}
.profile-row{gap:14px!important;min-height:53px!important;padding:12px 0!important}
.profile-row span{flex:0 0 84px;font-size:9px!important;letter-spacing:.06em;text-transform:uppercase;color:#8b737c}
.profile-row strong{min-width:0;text-align:right;font-size:11px!important;line-height:1.45;overflow-wrap:anywhere;word-break:break-word}
.settings-list{margin-top:14px!important;display:grid;gap:7px}
.settings-button{
  min-height:51px!important;
  padding:0 14px!important;
  border:1px solid rgba(103,34,60,.10)!important;
  border-radius:17px 6px 17px 17px!important;
  background:rgba(255,253,249,.65)!important;
  font-size:11px!important;
}
.settings-button svg{width:17px!important;height:17px!important}
.settings-button.danger{background:#faecee!important}
.legal{padding-bottom:12px}
.legal h1{margin-bottom:17px!important}
.legal h2{font-size:26px!important;line-height:1!important;margin:24px 0 9px!important}
.legal p,.legal li{font-size:11.5px!important;line-height:1.62!important}
.legal ul{padding-left:20px}

/* ---------- Public / join / auth / verification ---------- */
.wordmark{max-width:100%;overflow-wrap:normal}
.hero-photo{height:min(400px,52vh)!important;min-height:330px}
.hero-copy{padding:25px 21px 24px 26px!important}
.hero-copy h2{font-size:41px!important;line-height:.93!important}
.hero-copy p{font-size:12.5px!important}
.public-proof{gap:5px!important;margin:24px 0!important}
.proof{padding:10px 4px!important}
.proof strong{font-size:20px!important}
.proof span{font-size:7.5px!important;letter-spacing:.055em!important}
.feature{grid-template-columns:42px minmax(0,1fr)!important;gap:11px!important}
.feature-icon{width:42px!important;height:42px!important}
.feature strong{font-size:12px!important}
.feature p{font-size:10.5px!important}
.auth-tabs,.segmented{margin:15px 0!important}
.verification-visual{margin:22px auto!important;max-width:60vw}
.status-grid{gap:7px!important}
.status-card{padding:12px!important}
.status-card strong{overflow-wrap:anywhere}
.step-label{margin-top:2px}

/* ---------- Admin / modal / dense utility screens ---------- */
.metrics{grid-template-columns:1fr 1fr!important;gap:8px!important}
.metric{min-width:0;padding:13px!important;border-radius:17px 6px 17px 17px!important}
.metric strong{font-size:25px!important}
.metric span{font-size:8.5px!important;line-height:1.35!important}
.admin-card{padding:16px!important;border-radius:22px 7px 22px 22px!important}
.admin-grid{grid-template-columns:85px minmax(0,1fr)!important;gap:7px 10px!important}
.admin-grid span{font-size:9px!important}
.admin-grid strong{font-size:10.5px!important;overflow-wrap:anywhere}
.admin-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important}
.modal-backdrop{padding:calc(env(safe-area-inset-top,0px) + 18px) 14px calc(env(safe-area-inset-bottom,0px) + 18px)!important}
.modal{width:min(100%,390px)!important;max-height:calc(100dvh - 36px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;padding:20px!important;border-radius:26px 8px 26px 26px!important}
.modal h2{font-size:31px!important;line-height:.96!important;margin-top:0}
.modal-actions{gap:7px!important}

/* ---------- Narrow iPhone / Safari ---------- */
@media (max-width:430px){
  .screen{padding-left:20px!important;padding-right:20px!important}
  .screen.with-nav{padding-left:19px!important;padding-right:19px!important}
  input,textarea,select{font-size:16px!important} /* prevents iOS focus zoom */
  .form-group textarea{line-height:1.5!important}
  .page-title{font-size:clamp(39px,10.5vw,47px)!important;line-height:.93!important}
  .section-title{font-size:30px!important}
  .member-head{padding-right:68px!important}
  .quick-exit{right:max(10px,calc((100vw - 430px)/2 + 10px))!important}
  .bottom-nav{padding-left:5px!important;padding-right:5px!important}
  .nav-item{padding-left:3px!important;padding-right:3px!important;min-width:0!important}
  .nav-item svg{width:20px!important;height:20px!important}
  .nav-item span{font-size:8.5px!important;letter-spacing:-.01em}
  .member-photo{min-height:154px!important}
  .member-photo:after{font-size:6.5px!important;max-width:215px}
  .home-grid{gap:9px!important}
  .home-card{min-height:137px!important;padding:15px!important}
  .home-card h3{font-size:23px!important;margin-top:18px!important}
  .home-card p{font-size:10px!important}
  .support-strip{gap:7px!important;padding:12px 13px!important}
  .support-strip strong{font-size:10px!important}
  .support-strip .tiny{font-size:8.5px!important}
  .support-strip .text-button{font-size:10px!important}
  .section-head .page-title{font-size:43px!important}
  .post-title{font-size:27px!important}
  .post-actions button{flex:0 1 auto}
  .hub-card{min-height:141px;padding:17px!important}
  .hub-card h2{font-size:28px!important}
  .tool-panel{padding:17px!important}
  .tool-panel h3{font-size:27px!important}
  .profile-row span{flex-basis:75px}
  .legal h2{font-size:24px!important}
  .hero-photo{height:350px!important;min-height:0}
  .hero-copy{margin-top:-45px!important;margin-left:23px!important}
  .hero-copy h2{font-size:38px!important}
  .status-grid{grid-template-columns:1fr 1fr!important}
  .admin-actions{grid-template-columns:1fr!important}
}

@media (max-width:350px){
  .screen,.screen.with-nav{padding-left:16px!important;padding-right:16px!important}
  .member-brand{font-size:32px!important}
  .quick-exit{font-size:9px!important;padding:0 10px!important}
  .page-title{font-size:38px!important}
  .welcome-name{font-size:42px!important}
  .home-grid{grid-template-columns:1fr 1fr!important;gap:7px!important}
  .home-card{min-height:132px!important;padding:13px!important}
  .nav-item span{font-size:8px!important}
  .post{padding-left:15px!important;padding-right:15px!important}
  .post-actions{gap:5px!important}
  .post-actions button{padding:0 8px!important;font-size:8.5px!important}
  .public-proof{grid-template-columns:1fr!important}
  .proof{text-align:left!important;display:flex;align-items:center;justify-content:space-between;gap:8px}
  .proof strong{margin:0!important}
  .status-grid{grid-template-columns:1fr!important}
  .metrics{grid-template-columns:1fr!important}
}

@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
}