:root{
  --rf-max: 1120px;
  --rf-radius-xxl: 30px;
  --rf-radius-xl: 24px;
  --rf-radius-lg: 20px;
  --rf-radius-md: 16px;
  --rf-radius-sm: 12px;

  --rf-border: rgba(255,255,255,.12);
  --rf-border-soft: rgba(255,255,255,.08);
  --rf-panel: rgba(12,16,28,.58);
  --rf-panel-soft: rgba(255,255,255,.05);
  --rf-shadow: 0 18px 60px rgba(0,0,0,.25);
  --rf-shadow-soft: 0 10px 30px rgba(0,0,0,.18);

  --rf-text: rgba(255,255,255,.96);
  --rf-text-soft: rgba(255,255,255,.78);
  --rf-text-faint: rgba(255,255,255,.58);

  --rf-gold-1: #ffd68a;
  --rf-gold-2: #f2b24e;
  --rf-dark: #0c111d;
}

/* ------------------------------
   Base
------------------------------ */
body.rentals-frontend-page{
  min-height:100vh;
}

.rentals-frontend-shell{
  max-width: var(--rf-max);
  margin: 0 auto;
  padding: 18px 16px 30px;
}

@media (max-width: 560px){
  .rentals-frontend-shell{
    padding: 16px 14px 34px;
  }
}

/* ------------------------------
   Topbar
------------------------------ */
.rentals-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:18px 22px;
  margin-bottom:26px;
  border-radius:26px;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid var(--rf-border);
  box-shadow: var(--rf-shadow-soft);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.rentals-brand{
  display:flex;
  align-items:center;
  gap:16px;
  min-width:0;
  text-decoration:none;
  color:inherit;
}

.rentals-brand__logo{
  width:58px;
  height:58px;
  border-radius:18px;
  overflow:hidden;
  flex:0 0 auto;
  background: rgba(255,255,255,.08);
  border:1px solid var(--rf-border);
  display:grid;
  place-items:center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.rentals-brand__logo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.rentals-brand__fallback{
  font-size:1.15rem;
  font-weight:800;
  letter-spacing:.06em;
}

.rentals-brand__copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.rentals-brand__name{
  font-size:1.02rem;
  font-weight:800;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.rentals-brand__sub{
  color: var(--rf-text-soft);
  font-size:.92rem;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.rentals-nav{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.rentals-nav a{
  text-decoration:none;
  color:rgba(255,255,255,.88);
  font-weight:700;
  font-size:.95rem;
  padding:11px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  transition:all .18s ease;
}

.rentals-nav a:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
}

@media (max-width: 820px){
  .rentals-topbar{
    flex-direction:column;
    align-items:flex-start;
  }

  .rentals-nav{
    width:100%;
    justify-content:flex-start;
  }
}

@media (max-width: 560px){
  .rentals-topbar{
    padding:16px;
    border-radius:22px;
  }
}

/* ------------------------------
   Buttons
------------------------------ */
.rf-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  text-decoration:none;
  font-weight:800;
  border:1px solid transparent;
  transition:all .18s ease;
  box-shadow: var(--rf-shadow-soft);
}

.rf-btn:hover{
  transform:translateY(-1px);
}

.rf-btn--primary{
  color:var(--rf-dark);
  background:linear-gradient(180deg, var(--rf-gold-1), var(--rf-gold-2));
  border-color:rgba(255,214,138,.38);
}

.rf-btn--ghost{
  color:#fff;
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.12);
}

/* ------------------------------
   Landing Hero
------------------------------ */
.landing-hero{
  position:relative;
  overflow:hidden;
  border-radius:var(--rf-radius-xxl);
  min-height:560px;
  display:grid;
  align-items:stretch;
  box-shadow: var(--rf-shadow);
  border:1px solid var(--rf-border);
  background:
    radial-gradient(circle at top left, rgba(255,215,140,.12), transparent 32%),
    linear-gradient(135deg, rgba(10,14,24,.95), rgba(18,24,40,.82));
  margin-bottom:28px;
}

.landing-hero__bg{
  position:absolute;
  inset:0;
  z-index:0;
}

.landing-hero__bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.02);
}

.landing-hero__veil{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(7,10,18,.84) 0%, rgba(7,10,18,.66) 32%, rgba(7,10,18,.18) 68%, rgba(7,10,18,.28) 100%);
  z-index:1;
}

.landing-hero__grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0, 1.15fr) minmax(320px, .85fr);
  gap:26px;
  padding:42px;
  min-height:560px;
  align-items:end;
}

.landing-hero__content{
  max-width:720px;
  align-self:end;
  padding-right:10px;
}

.landing-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.94);
  font-size:.9rem;
  font-weight:800;
  letter-spacing:.02em;
  margin-bottom:18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.landing-badge__dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:rgba(255,215,140,.95);
  box-shadow:0 0 0 4px rgba(255,215,140,.16);
  flex:0 0 auto;
}

.landing-hero h1{
  margin:0 0 16px;
  font-size:clamp(2.2rem, 5vw, 4.6rem);
  line-height:.96;
  letter-spacing:-.04em;
  max-width:11ch;
}

.landing-hero__lead{
  margin:0 0 22px;
  font-size:1.02rem;
  line-height:1.75;
  color: var(--rf-text-soft);
  max-width:58ch;
}

.landing-flow{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 24px;
}

.landing-flow__chip{
  padding:9px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.88);
  font-size:.9rem;
  font-weight:700;
}

.landing-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:center;
}

.landing-hero__aside{
  display:grid;
  gap:16px;
  align-self:end;
  justify-self:end;
  width:min(100%, 390px);
}

.hero-panel{
  border-radius:26px;
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: var(--rf-shadow-soft);
  overflow:hidden;
}

.hero-panel__body{
  padding:20px 20px 18px;
}

.hero-panel__title{
  margin:0 0 10px;
  font-size:1rem;
  font-weight:800;
}

.hero-panel__text{
  margin:0;
  color:var(--rf-text-soft);
  font-size:.95rem;
  line-height:1.65;
}

.hero-panel__list{
  display:grid;
  gap:10px;
  margin-top:14px;
}

.hero-panel__item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}

.hero-panel__item strong{
  font-size:.95rem;
}

.hero-panel__item span{
  font-size:.84rem;
  color:var(--rf-text-faint);
  text-align:right;
}

body.rentals-frontend-page.mode-property .landing-hero__veil{
  background:
    linear-gradient(90deg, rgba(10,14,24,.68) 0%, rgba(10,14,24,.44) 35%, rgba(10,14,24,.14) 68%, rgba(10,14,24,.18) 100%);
}

body.rentals-frontend-page.mode-vehicles .landing-hero__veil{
  background:
    linear-gradient(90deg, rgba(8,10,18,.82) 0%, rgba(8,10,18,.58) 36%, rgba(8,10,18,.14) 70%, rgba(8,10,18,.22) 100%);
}

body.rentals-frontend-page.mode-spaces .landing-hero__veil{
  background:
    linear-gradient(90deg, rgba(14,10,20,.82) 0%, rgba(14,10,20,.58) 36%, rgba(14,10,20,.14) 70%, rgba(14,10,20,.22) 100%);
}

@media (max-width: 1120px){
  .landing-hero__grid{
    grid-template-columns:1fr;
    align-items:end;
  }

  .landing-hero__aside{
    justify-self:start;
    width:min(100%, 520px);
  }
}

@media (max-width: 820px){
  .landing-hero{
    min-height:auto;
  }

  .landing-hero__grid{
    padding:24px;
    min-height:auto;
  }

  .landing-hero h1{
    max-width:13ch;
  }
}

@media (max-width: 560px){
  .landing-hero{
    border-radius:28px;
  }

  .landing-hero__grid{
    padding:18px;
  }

  .landing-hero h1{
    font-size:clamp(2rem, 10vw, 3rem);
  }

  .landing-hero__actions{
    align-items:stretch;
  }

  .rf-btn{
    width:100%;
  }

  .hero-panel__body{
    padding-left:16px;
    padding-right:16px;
  }
}

/* ------------------------------
   Metrics / Status
------------------------------ */
.hero-metric-strip{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-bottom:30px;
}

.metric-card{
  padding:18px 18px 16px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid var(--rf-border-soft);
  box-shadow: var(--rf-shadow-soft);
}

.metric-card__label{
  color:var(--rf-text-faint);
  font-size:.82rem;
  font-weight:700;
  margin-bottom:8px;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.metric-card__value{
  font-size:1.55rem;
  font-weight:900;
  letter-spacing:-.03em;
  line-height:1;
  margin-bottom:6px;
}

.metric-card__copy{
  color:var(--rf-text-soft);
  font-size:.92rem;
  line-height:1.45;
}

.landing-status{
  margin-bottom:30px;
  display:flex;
  justify-content:flex-start;
}

.status-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  font-weight:800;
  font-size:.92rem;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  box-shadow: var(--rf-shadow-soft);
}

.status-pill--ok{
  color:#fff;
}

.status-pill--warn{
  color:#fff;
  background:rgba(255,179,71,.12);
  border-color:rgba(255,179,71,.28);
}

@media (max-width: 820px){
  .hero-metric-strip{
    grid-template-columns:1fr;
  }
}

/* ------------------------------
   Section Head
------------------------------ */
.section-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
}

.section-head h2{
  margin:0 0 8px;
  font-size:clamp(1.5rem, 2vw, 2.1rem);
  letter-spacing:-.03em;
}

.section-head p{
  margin:0;
  max-width:62ch;
  color:var(--rf-text-soft);
  line-height:1.7;
  font-size:.97rem;
}

.section-head__action a{
  text-decoration:none;
  font-weight:800;
  color:#fff;
  padding:12px 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

@media (max-width: 820px){
  .section-head{
    flex-direction:column;
    align-items:flex-start;
  }
}

/* ------------------------------
   Cards
------------------------------ */
.landing-cards{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:20px;
  margin-bottom:34px;
}

.rental-card{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:26px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid var(--rf-border-soft);
  box-shadow: var(--rf-shadow-soft);
  min-height:100%;
}

.rental-card__media{
  display:block;
  aspect-ratio: 16 / 10;
  overflow:hidden;
  background:rgba(255,255,255,.04);
}

.rental-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .28s ease;
}

.rental-card:hover .rental-card__media img{
  transform:scale(1.04);
}

.rental-card__body{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:18px;
  flex:1 1 auto;
}

.rental-card__topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.rental-card__type,
.rental-card__status,
.meta-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:800;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.9);
}

.rental-card__status.is-available{
  background:rgba(72,187,120,.12);
  border-color:rgba(72,187,120,.25);
}

.rental-card__status.is-unavailable{
  background:rgba(255,107,107,.12);
  border-color:rgba(255,107,107,.24);
}

.rental-card__title{
  margin:0;
  font-size:1.18rem;
  line-height:1.18;
  letter-spacing:-.02em;
}

.rental-card__title a{
  text-decoration:none;
  color:#fff;
}

.rental-card__title a:hover{
  opacity:.92;
}

.rental-card__sub{
  color:var(--rf-text-faint);
  font-size:.9rem;
  line-height:1.4;
}

.rental-card__location{
  color:var(--rf-text-soft);
  font-size:.95rem;
  line-height:1.4;
}

.rental-card__summary{
  margin:0;
  color:var(--rf-text-soft);
  font-size:.94rem;
  line-height:1.65;
}

.rental-card__meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.rental-card__footer{
  margin-top:auto;
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:14px;
  padding-top:6px;
}

.rental-card__price{
  font-size:1.15rem;
  font-weight:900;
  letter-spacing:-.02em;
  line-height:1.1;
}

.rental-card__price small{
  display:block;
  margin-top:5px;
  font-size:.82rem;
  font-weight:700;
  color:var(--rf-text-faint);
}

.rental-card__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 16px;
  border-radius:999px;
  text-decoration:none;
  font-weight:800;
  color:var(--rf-dark);
  background:linear-gradient(180deg, var(--rf-gold-1), var(--rf-gold-2));
  border:1px solid rgba(255,214,138,.38);
  white-space:nowrap;
  flex:0 0 auto;
}

.landing-empty{
  padding:32px 24px;
  border-radius:26px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid var(--rf-border-soft);
  color:var(--rf-text-soft);
  line-height:1.7;
  text-align:center;
  box-shadow: var(--rf-shadow-soft);
  margin-bottom:34px;
}

@media (max-width: 1120px){
  .landing-cards{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px){
  .landing-cards{
    grid-template-columns:1fr;
  }
}

@media (max-width: 560px){
  .rental-card__body{
    padding:16px;
  }

  .rental-card__footer{
    flex-direction:column;
    align-items:stretch;
  }

  .rental-card__cta{
    width:100%;
  }
}

/* ------------------------------
   Bottom CTA
------------------------------ */
.landing-bottom-cta{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) auto auto;
  align-items:center;
  gap:18px;
  padding:24px 24px;
  border-radius:28px;
  background:
    radial-gradient(circle at top right, rgba(255,214,138,.10), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.04));
  border:1px solid var(--rf-border);
  box-shadow: var(--rf-shadow-soft);
  margin-top:8px;
}

.landing-bottom-cta__copy h3{
  margin:0 0 8px;
  font-size:1.2rem;
  letter-spacing:-.02em;
}

.landing-bottom-cta__copy p{
  margin:0;
  color:var(--rf-text-soft);
  line-height:1.7;
  font-size:.95rem;
  max-width:62ch;
}

.landing-bottom-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:flex-end;
}

.landing-powered{
  justify-self:end;
  text-align:right;
  color:var(--rf-text-faint);
  font-size:.86rem;
  white-space:nowrap;
}

.landing-powered strong{
  color:rgba(255,255,255,.92);
  font-weight:800;
}

@media (max-width: 1120px){
  .landing-bottom-cta{
    grid-template-columns:1fr;
    align-items:start;
  }

  .landing-bottom-cta__actions,
  .landing-powered{
    justify-self:start;
    text-align:left;
  }
}

@media (max-width: 560px){
  .landing-bottom-cta{
    padding-left:16px;
    padding-right:16px;
  }
}


/* ------------------------------
   Service-specific card skins
------------------------------ */

/* Equipment / Industrial */
body.rentals-frontend-page.mode-industrial .rental-card--equipment,
body.rentals-frontend-page.mode-equipment .rental-card--equipment{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04)),
    radial-gradient(circle at top right, rgba(255,214,138,.10), transparent 34%);
  border-color: rgba(255,214,138,.14);
}

body.rentals-frontend-page.mode-industrial .rental-card--equipment .rental-card__type,
body.rentals-frontend-page.mode-equipment .rental-card--equipment .rental-card__type{
  background: rgba(255,214,138,.10);
  border-color: rgba(255,214,138,.22);
  color: #ffe0a6;
}

body.rentals-frontend-page.mode-industrial .rental-card--equipment .rental-card__cta,
body.rentals-frontend-page.mode-equipment .rental-card--equipment .rental-card__cta{
  background: linear-gradient(180deg, #ffd68a, #f2b24e);
  color: #0c111d;
}

/* Vehicle */
body.rentals-frontend-page.mode-vehicle .rental-card--vehicle,
body.rentals-frontend-page.mode-vehicles .rental-card--vehicle{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04)),
    radial-gradient(circle at top right, rgba(78,165,255,.12), transparent 34%);
  border-color: rgba(78,165,255,.16);
}

body.rentals-frontend-page.mode-vehicle .rental-card--vehicle .rental-card__type,
body.rentals-frontend-page.mode-vehicles .rental-card--vehicle .rental-card__type{
  background: rgba(78,165,255,.12);
  border-color: rgba(78,165,255,.24);
  color: #cfe6ff;
}

body.rentals-frontend-page.mode-vehicle .rental-card--vehicle .rental-card__cta,
body.rentals-frontend-page.mode-vehicles .rental-card--vehicle .rental-card__cta{
  background: linear-gradient(180deg, #9fd0ff, #4ea5ff);
  color: #081223;
}

/* Property */
body.rentals-frontend-page.mode-property .rental-card--property{
  background:
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.045)),
    radial-gradient(circle at top right, rgba(214,198,170,.14), transparent 38%);
  border-color: rgba(214,198,170,.16);
}

body.rentals-frontend-page.mode-property .rental-card--property .rental-card__type{
  background: rgba(214,198,170,.12);
  border-color: rgba(214,198,170,.24);
  color: #f3e6d0;
}

body.rentals-frontend-page.mode-property .rental-card--property .rental-card__cta{
  background: linear-gradient(180deg, #f3e2c3, #d4b481);
  color: #17120d;
}

/* Space */
body.rentals-frontend-page.mode-space .rental-card--space,
body.rentals-frontend-page.mode-spaces .rental-card--space{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04)),
    radial-gradient(circle at top right, rgba(196,143,255,.14), transparent 36%);
  border-color: rgba(196,143,255,.16);
}

body.rentals-frontend-page.mode-space .rental-card--space .rental-card__type,
body.rentals-frontend-page.mode-spaces .rental-card--space .rental-card__type{
  background: rgba(196,143,255,.12);
  border-color: rgba(196,143,255,.24);
  color: #ead7ff;
}

body.rentals-frontend-page.mode-space .rental-card--space .rental-card__cta,
body.rentals-frontend-page.mode-spaces .rental-card--space .rental-card__cta{
  background: linear-gradient(180deg, #efd7ff, #c48fff);
  color: #140d1b;
}

body.rentals-frontend-page.mode-industrial .rental-card--equipment{
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    radial-gradient(circle at top right, rgba(246,196,83,.12), transparent 40%);
  border: 1px solid rgba(246,196,83,.18);
}

body.rentals-frontend-page.mode-industrial .rental-card__cta{
  background: linear-gradient(180deg, #ffd68a, #f2b24e);
  color: #0c111d;
}

body.rentals-frontend-page.mode-property .rental-card--property{
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)),
    radial-gradient(circle at top right, rgba(214,198,170,.10), transparent 45%);
}

body.rentals-frontend-page.mode-vehicle .rental-card--vehicle{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)),
    radial-gradient(circle at top right, rgba(78,165,255,.14), transparent 40%);
}

body.rentals-frontend-page.mode-vehicle .rental-card__cta{
  background: linear-gradient(180deg, #9fd0ff, #4ea5ff);
}

body.rentals-frontend-page.mode-space .rental-card--space{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)),
    radial-gradient(circle at top right, rgba(196,143,255,.16), transparent 42%);
}

body.rentals-frontend-page.mode-space .rental-card__cta{
  background: linear-gradient(180deg, #efd7ff, #c48fff);
}