/* Recovery Familia owner-approved color direction:
   true Italian tricolor (solid green/white/red), black ground,
   warm champagne-gold reserved for the authentic approved logo / typography.
   Overrides legacy neutral gradients without changing official artwork. */
:root {
  --ink:#050505;
  --panel:#101010;
  --panel2:#181818;
  --stroke:#353333;
  --text:#fffaf2;
  --muted:#c5bfb7;
  --gold:#e5c39a;
  --gold2:#f8e6ce;
  --green:#00be29;
  --red:#f01820;
  --rf-green:#00be29;
  --rf-white:#ffffff;
  --rf-red:#f01820;
  --rf-black:#050505;
  --rf-gold:#e5c39a;
  --rf-cream:#fff9ef;
  --rf-line:#3e3833;
  --rf-deep:#050505;
}
body{background:#050505;color:var(--text)}
.site-head{background:rgba(5,5,5,.98);border-bottom:0}
.site-head:after{height:4px;opacity:1;background:linear-gradient(to right,
  var(--rf-green) 0%,var(--rf-green) 33.333%,
  var(--rf-white) 33.333%,var(--rf-white) 66.666%,
  var(--rf-red) 66.666%,var(--rf-red) 100%)}
.stripe{background:linear-gradient(to right,
  var(--rf-green) 0%,var(--rf-green) 33.333%,
  var(--rf-white) 33.333%,var(--rf-white) 66.666%,
  var(--rf-red) 66.666%,var(--rf-red) 100%);height:4px}
.flag{height:6px}
.flag span:nth-child(1){background:var(--rf-green)}
.flag span:nth-child(2){background:var(--rf-white)}
.flag span:nth-child(3){background:var(--rf-red)}
.nav a[aria-current=page]{color:#fff;border-color:var(--rf-green)}
.nav a:hover{border-color:var(--rf-red);color:#fff}
.head-join,.button{background:var(--rf-gold);border:1px solid var(--rf-gold);color:#080808;box-shadow:none}
.head-join:hover,.button:hover{background:#f9e7cf;border-color:#f9e7cf}
.button-ghost{border-color:#d4bb9a}
.button-ghost:hover{border-color:var(--rf-green);color:white}
.menu{border:1px solid #625545;background:#12100e;min-height:44px;min-width:44px}
.menu:hover{border-color:var(--rf-green)}
.home-hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.98) 0%,rgba(0,0,0,.90) 24%,rgba(0,0,0,.65) 57%,rgba(0,0,0,.23) 100%),linear-gradient(0deg,#050505 0%,transparent 34%)}
.hero-kicker span{background:var(--rf-green)}
.hero-kicker{color:#f8dbb4}
.hero-proof span{color:var(--rf-red)}
.home-hero h1 em{color:#f5d6af}
.section-alt{background:#0e0d0d}
.tile,.feature-card{background:#131111;border-color:#4d4036}
.visual-gradient{background:linear-gradient(0deg,#050505 0%,#050505a6 42%,transparent 92%)}
.board-panel-top{background:#171514}
.board-row:hover{background:#1e1a18}
.board-row:focus-visible,.visual-tile:focus-visible,.collection-card:focus-visible{outline:3px solid var(--rf-green);outline-offset:4px}
.board-icon{border-color:#aa8c68}
.program-pill{background:#161414}
.program-pill:hover{border-color:var(--rf-green);color:#fff}
.final-cta{background:radial-gradient(ellipse at 50% 0%,#35271d 0%,#0e0b09 52%,#050505 100%);border-top:4px solid var(--rf-green)}
.footer{background:#080808}
.footer-top .eyebrow{color:var(--rf-gold)}
.footer-bottom{border-top-color:#4b3d31}
.rf-live-board{margin:44px 0 27px}
.rf-live-board h2,.rf-live-products h2{font-size:clamp(1.7rem,3.5vw,2.8rem)}
.rf-empty-message{padding:28px;background:#151313;border:1px solid #504035;border-radius:8px;color:#e7d5bd}
.rf-live-list{display:grid;gap:14px}
.rf-thread-link{padding:22px;border:1px solid #5e4935;background:#181514;border-radius:8px;display:grid;gap:7px}
.rf-thread-link strong{font:500 1.5rem/1.2 Georgia,serif;color:#f5dbc0}
.rf-thread-link span{color:#d6c9bc}
.rf-thread-link small{color:#00cf42;font-size:.8rem}
.rf-thread-link:hover{border-color:#00be29}
.rf-thread-page h1{font-size:clamp(2.25rem,5vw,4rem)}
.rf-approved-thread{padding:26px 30px;border:1px solid #5a4939;background:#151313;border-radius:9px;max-width:860px;margin:20px 0 30px}
.rf-approved-thread h2{font:500 clamp(1.9rem,3.4vw,2.8rem) Georgia,serif}
.rf-approved-thread p{white-space:pre-wrap;overflow-wrap:anywhere;color:#e4d9cb}
.rf-approved-reply{border-top:1px solid #4c3c30;padding:15px 0}
.rf-live-products{margin:45px 0}
.rf-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.rf-product{border:1px solid #544431;border-radius:9px;overflow:hidden;background:#191515;min-width:0}
.rf-product>img{width:100%;height:270px;object-fit:cover;background:#080808}
.rf-product-info{padding:24px;display:flex;flex-direction:column;gap:11px}
.rf-product-info small{color:#e5c39a;letter-spacing:.12em}
.rf-product-info h3{font:500 1.7rem/1.2 Georgia,serif;margin:0}
.rf-product-info p{color:#cfc2b4;margin:0}
.rf-price{font-size:1.25rem;color:white}
.rf-product-info .button{align-self:flex-start;margin-top:8px}
.nav{scrollbar-width:thin}
@media(max-width:1050px){.rf-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){
 .nav{background:#0b0b0b;box-shadow:0 25px 55px #000d}
 .site-head:after{height:4px}
 .home-hero-shade{background:linear-gradient(90deg,#030303ed 0%,#030303ca 64%,#0303039c 100%),linear-gradient(0deg,#050505 0%,transparent 48%)}
 .head-inner{min-height:76px}
 .menu{background:#171311;border-color:#9b805f}
}
@media(max-width:590px){
 .rf-product-grid{grid-template-columns:1fr}
 .rf-product>img{height:240px}
 .rf-product-info .button{width:100%}
 .rf-approved-thread{padding:22px 18px}
 .hero-proof span{color:var(--rf-green)}
 .board-row{border-color:#42352c}
 .rf-empty-message{padding:23px}
}
@media(prefers-reduced-motion:reduce){
 .visual-tile img,.collection-card img{transition:none!important}
}

/* Official unredrawn wordmark / physical merchandise concept imagery */
.brand{gap:0;max-width:250px;min-width:0}
.brand-wordmark{display:block;width:245px;height:auto;max-height:76px;object-fit:contain;object-position:left center}
.brand-fallback{display:none}
.hero-official-wordmark{width:min(405px,74vw);height:auto;object-fit:contain;margin:29px 0 13px}
.home-hero-content>.hero-official-wordmark{filter:drop-shadow(0 2px 14px #000c)}
.merch-visual>.editorial-image img{object-fit:cover;object-position:center center;filter:none}
.collection-card>.editorial-image img{object-fit:cover;filter:none}
.visual-tile img[src*="recovery-familia-merch"]{object-position:50% 40%;filter:none}
.page-hero-photo img[src*="recovery-familia-merch"]{object-fit:contain;background:#050505}
.merch-visual>.editorial-image{background:#050505;border-color:#6a5541}
@media(max-width:1080px){.brand-wordmark{width:195px}.brand{max-width:195px}}
@media(max-width:820px){.brand-wordmark{width:205px;max-height:72px}.brand{max-width:205px}}
@media(max-width:590px){
 .brand-wordmark{width:187px;max-height:65px}
 .brand{max-width:187px}
 .hero-official-wordmark{width:min(310px,86vw);margin:15px 0 7px}
}
@media(max-width:355px){.brand-wordmark{width:168px}.brand{max-width:168px}}


/* P0 navigation + horizontal-gesture correction: official logo in header only.
   Layout is a three-track mobile header: menu | wordmark | balance spacer. */
html{
  max-width:100%;
  overflow-x:clip;
  overscroll-behavior-x:none;
}
body{
  width:100%;
  max-width:100%;
  overflow-x:clip;
  overscroll-behavior-x:none;
}
main,.section,.home-hero,.page-hero,.footer{
  max-width:100%;
  min-width:0;
}
.home-hero-content{padding-top:clamp(55px,7vw,95px)}
@media(max-width:820px){
  .head-inner{
    display:grid;
    grid-template-columns:48px minmax(0,1fr) 48px;
    gap:0;
    align-items:center;
    min-height:76px;
  }
  .head-inner .menu{
    display:inline-flex;
    grid-column:1;
    grid-row:1;
    justify-self:start;
    justify-content:center;
    align-items:center;
    margin:0;
    width:46px;
    height:46px;
    padding:0;
    z-index:2;
    border-radius:6px;
    line-height:1;
    font-size:1.45rem;
  }
  .head-inner .brand{
    grid-column:2;
    grid-row:1;
    justify-self:center;
    justify-content:center;
    width:min(216px,100%);
    max-width:100%;
    min-width:0;
    margin:0;
    padding:0;
  }
  .head-inner .brand-wordmark{
    width:100%;
    max-width:100%;
    height:auto;
    max-height:64px;
    object-fit:contain;
    object-position:center;
  }
  .head-inner .nav{
    grid-column:auto;
    width:auto;
    left:0;
    right:0;
    top:100%;
    margin:0;
  }
  .home-hero-content{
    padding-top:44px;
    padding-bottom:68px;
  }
}
@media(max-width:590px){
  .home-hero-content{padding-top:38px}
  .home-hero h1{margin-top:16px}
}
@media(max-width:360px){
  .head-inner{grid-template-columns:45px minmax(0,1fr) 45px}
  .head-inner .menu{height:44px;width:44px}
  .head-inner .brand{width:min(195px,100%)}
}
@supports (touch-action:pan-y pinch-zoom){
  body{touch-action:pan-y pinch-zoom}
}


/* P0 iOS horizontal-scroll hardening: treat the document as a vertical-only surface.
   Prevents horizontal rubber-banding and overwide dynamic sections without disabling
   vertical scroll, taps, accessible zoom, or the mobile navigation overlay. */
html,
body {
  inline-size: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  overflow-x: hidden; /* older WebKit fallback */
  overflow-x: clip;
  overscroll-behavior-x: none;
  touch-action: pan-y pinch-zoom;
}
#main {
  display: block;
  inline-size: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
  overflow-x: clip;
}
#main > *,
#main .shell,
#main .section,
#main .section-head,
#main .visual-grid,
#main .feature-grid,
#main .collection-grid,
#main .photo-triptych,
#main .merch-showcase,
#main .split-editorial,
#main .rf-product-grid {
  min-inline-size: 0;
  max-inline-size: 100%;
}
#main img,
#main video {
  max-inline-size: 100%;
}
#main h1,
#main h2,
#main h3,
#main p,
#main a {
  overflow-wrap: break-word;
}
@media (max-width: 820px) {
  .site-head,
  .head-inner {
    max-inline-size: 100%;
    min-inline-size: 0;
  }
  .nav {
    max-inline-size: 100%;
    overflow-x: hidden;
    overscroll-behavior-x: none;
    touch-action: pan-y;
  }
  .merch-mark {
    right: 0; /* replaces the legacy -20px decorative overflow */
  }
  .board-row,
  .meeting-card,
  .feature-card,
  .collection-card,
  .visual-tile,
  .rf-product {
    min-inline-size: 0;
    max-inline-size: 100%;
  }
}
