/* FRELUMO V32 • responsive hero and accessible 2-slide gallery; apply after V31. */
html {scroll-padding-top:82px}
.f28-site, .f28-site *, .f28-member-app, .f28-member-app * { box-sizing:border-box }
.f28-site { overflow-x:clip }
.f28-site img { max-width:100% }
.f28-site .shell { min-width:0 }
/* Two actual photographs. Only one is visually active; CSS never swaps the src itself. */
.f28-site .f28-hero{isolation:isolate;overflow:hidden;background:#071731}
.f28-site .f32-hero-slides,.f28-site .f32-hero-slide {position:absolute;inset:0;pointer-events:none}
.f28-site .f32-hero-slides{z-index:-3;overflow:hidden}
.f28-site .f32-hero-slide{opacity:0;visibility:hidden;transition:opacity .9s ease, visibility .9s ease}
.f28-site .f32-hero-slide.is-active{opacity:1;visibility:visible}
.f28-site .f32-hero-slide .f28-hero-image{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center 43%}
.f28-site .f28-hero-shade{z-index:-2;pointer-events:none}
.f32-slide-controls{position:absolute;right:18px;bottom:25px;z-index:7;display:flex;align-items:center;gap:9px;padding:8px 9px;border:1px solid #467bba8c;border-radius:15px;background:#04162cbd;backdrop-filter:blur(15px);box-shadow:0 12px 26px #0008}
.f32-slide-btn{border:1px solid #527eae;background:#081a38;min-width:66px;min-height:73px;color:#edf7ff;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:5px;cursor:pointer;font-family:inherit;font-weight:700;font-size:11px;line-height:1.2}
.f32-slide-btn img{width:51px;height:42px;border-radius:7px;object-fit:cover;object-position:center 28%}
.f32-slide-btn.is-active{border:2px solid #33d8ff;background:#122d62;box-shadow:0 0 17px #1bbafa99}
.f32-slide-btn span{font-size:11px;white-space:nowrap}
.f32-slide-next{border:1px solid #5181c5;min-width:36px;height:36px;border-radius:50%;color:#fff;background:#0e284d;cursor:pointer;font-size:1.3rem}
.f32-slide-controls button:is(:focus-visible,:hover){outline:2px solid #86dfff;outline-offset:2px}
.f32-review-jump{display:inline-flex;align-items:center;gap:10px;max-width:100%;margin-top:15px;text-decoration:none!important;color:#f4f9ff!important;padding:9px 13px;border-radius:13px;background:#102b54db;border:1px solid #5381b5;box-shadow:inset 0 1px #ffffff1c}
.f32-review-jump-icon{display:grid;place-items:center;font-size:1.2rem;color:#69e1f9;background:#173966;border-radius:50%;width:29px;height:29px;flex:none}
.f32-review-jump span:nth-child(2){display:flex;flex-direction:column;gap:1px;min-width:0}
.f32-review-jump strong{font-size:.8rem;line-height:1.1}.f32-review-jump small{font-size:.66rem;color:#d7eaff;line-height:1.35}
.f32-review-jump>span:last-child{color:#7fdfff;font-size:1.2rem;margin-left:3px}
.f32-review-jump:hover{border-color:#40ceff;box-shadow:0 0 18px #208ee954}
/* Restore obvious story cards and make reviews a clear section immediately after hero. */
.f28-site #reviews { scroll-margin-top:70px;border-top:1px solid #347eaf;position:relative }
.f28-site #reviews:before{content:"";height:3px;position:absolute;top:0;left:0;right:0;background:linear-gradient(90deg,#1ad9fd,#7a3cfc,#19d1ed)}
.f28-site #reviews .f22-stories-head{margin-bottom:20px}
.f28-site #reviews .f22-stories-head h2{max-width:780px}
.f28-site #reviews :is(.f23-example,.f22-review-card){min-width:0}
.f28-site #reviews .f23-example blockquote{font-size:clamp(.92rem,1.4vw,1.1rem);line-height:1.6}
.f28-site #reviews .f23-example .f23-sample-tag{white-space:normal;text-align:center}
.f28-site #reviews :is(.f23-examples,.f22-review-grid){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
/* Laptops: prevent captions and the controls from overlapping hero copy. */
@media(max-width:1200px) and (min-width:768px){
 .f28-site .f28-hero-text{max-width:670px}
 .f32-slide-controls{right:11px;bottom:11px;transform:scale(.91);transform-origin:right bottom}
}
@media(max-width:850px){
 .f28-site .f28-hero .f28-goal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;gap:9px;overflow:visible!important;padding:0;margin-top:16px}
 .f28-site .f28-hero .f28-goal{display:flex;min-width:0!important;width:100%;max-width:none!important;min-height:91px;flex:none;padding:10px 4px;overflow:hidden}
 .f28-site .f28-hero .f28-goal strong{font-size:.91rem;white-space:normal}
 .f28-site .f28-hero .f28-goal small{font-size:.71rem;white-space:normal}
 .f28-site .f28-hero .f28-emoji{font-size:1.45rem}
 .f28-site #reviews :is(.f23-examples,.f22-review-grid){grid-template-columns:1fr;gap:12px}
 .f28-site #reviews .f22-stories-head{flex-wrap:wrap;align-items:flex-start;gap:16px}
}
/* Image remains fully visible ABOVE the content, which flows and grows naturally. */
@media(max-width:767px){
 .f28-site .f28-hero,.f28-site .f28-hero-content{height:auto!important;min-height:0!important}
 .f28-site .f28-hero-content{display:block;padding-top:clamp(255px,74vw,345px);padding-bottom:26px;position:relative}
 .f28-site .f32-hero-slide .f28-hero-image{object-position:center top}
 .f28-site .f28-hero-shade{background:linear-gradient(to bottom, #050e2305 0%,#040e2315 17%,#04112876 32%,#041028ec 47%,#041128fa 61%,#05122b 100%)!important}
 .f28-site .f28-hero-text{padding:0!important;max-width:none!important;width:100%}
 .f28-site .f28-hero h1{font-size:clamp(2.05rem,8.5vw,3.25rem)!important;letter-spacing:-.055em;line-height:1.075!important;margin-top:12px;margin-bottom:11px;text-wrap:balance}
 .f28-site .f28-hero-text>p{font-size:clamp(.88rem,3.5vw,1rem)!important;line-height:1.55;margin-bottom:12px;overflow-wrap:break-word}
 .f28-site .f28-hero .f28-pill{font-size:.62rem;letter-spacing:.07em;max-width:100%;white-space:normal}
 .f28-site .f28-hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
 .f28-site .f28-hero-actions>a{display:flex;align-items:center;justify-content:center;min-height:48px!important;max-width:100%;font-size:clamp(.74rem,3.1vw,.86rem)!important;padding:11px 8px!important;text-align:center}
 .f28-site .f28-footnote{font-size:.71rem;line-height:1.5;margin-top:12px;overflow-wrap:break-word}
 .f28-site .f32-review-jump{margin-top:14px;width:100%;padding:10px}
 .f32-slide-controls{top:clamp(187px,53vw,256px);bottom:auto;right:14px;transform:none;padding:5px 7px;border-radius:11px;gap:5px}
 .f32-slide-btn{min-height:53px;min-width:45px;padding:3px 4px;gap:1px}
 .f32-slide-btn img{width:43px;height:34px}
 .f32-slide-btn span{font-size:9px}
 .f32-slide-next{width:26px;height:26px;min-width:26px;font-size:1rem}
 .f28-site .f22-stories{padding:35px 0!important}
 .f28-site #reviews .f22-stories-head h2{font-size:clamp(1.75rem,7vw,2.4rem);line-height:1.15}
 .f28-site #reviews .f23-notice{margin-bottom:15px}
 .f28-site #reviews .f23-examples article{width:100%}
 .f28-site #reviews .f23-review-cta{flex-wrap:wrap;gap:12px}
 .f28-site #reviews .f22-trustline{grid-template-columns:1fr;gap:12px}
}
@media(max-width:359px){
 .f28-site .f28-hero .f28-goal-grid{gap:6px}
 .f28-site .f28-hero .f28-goal{min-height:81px;padding:7px 2px}
 .f28-site .f28-hero .f28-goal strong{font-size:.77rem}
 .f28-site .f28-hero .f28-goal small{font-size:.64rem}
 .f28-site .f28-hero h1{font-size:clamp(1.93rem,9.3vw,2.25rem)!important}
 .f28-site .f28-hero-actions{grid-template-columns:1fr 1fr}
 .f28-site .f28-hero-actions>a{font-size:.72rem!important;line-height:1.25}
 .f32-slide-controls{top:185px;right:8px}
 .f28-site .f28-hero-content{padding-top:258px}
}
@media(prefers-reduced-motion:reduce){.f28-site .f32-hero-slide{transition:none}}
/* Shared mobile safety for dashboard/previews without hiding real content. */
@media(max-width:850px){
 .f30-app,.f28-member-app{max-width:100vw;overflow-x:clip}
 .f30-app :is(.f30-task,.f30-task-body,.f30-main),.f28-member-app :is(.f28-member-main,.f28-member-card-copy){min-width:0}
 .f30-app :is(.f30-task h3,.f30-task p,.f30-workflow-heading),.f28-member-app :is(.f28-member-card-copy h3,.f28-member-card-copy p){overflow-wrap:break-word}
 .f30-app .f30-goals button{min-width:0}
}