/* =========================================================
   EasyNajom — shared marketing/landing styles
   Used by: index, pre-prenajimatelov, pre-najomnikov,
            ai-certifikat, najomnici, faq, kontakt
   ========================================================= */

:root{
  --primary:#1F6E73;
  --primary-900:#145359;
  --primary-dark:#0F3A3E;
  --primary-light:#2D8A91;
  --primary-soft:rgba(31,110,115,0.08);
  --accent:#F5A54A;
  --accent-dark:#E68E2C;
  --tenant:#8B5CF6;
  --tenant-dark:#7C3AED;
  --tenant-soft:rgba(139,92,246,0.1);
  --green:#10B981;
  --green-soft:#DCFCE7;
  --dark:#0F172A;
  --text:#22303A;
  --text-light:#64748B;
  --border:#E2EAE8;
  --light:#F7FAFC;
  --paper:#F3F7F6;
  --card:#FFFFFF;
  --mono:'IBM Plex Mono', ui-monospace, monospace;
  --header-height:80px;
}

*{box-sizing:border-box;margin:0;padding:0}

html{
  overflow-x:clip;
  max-width:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-height) + env(safe-area-inset-top, 0px));
}

body{
  font-family:'Inter',sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.6;
  overflow-x:clip;
  max-width:100%;
  -webkit-font-smoothing:antialiased;
}

.container{
  max-width:1200px;
  width:100%;
  margin:0 auto;
  padding:0 40px;
  min-width:0;
}

i.ph{vertical-align:middle;position:relative;top:-2px}

section{padding:88px 0;width:100%;min-width:0}
section.section-tight{padding:64px 0}

/* ---------- header ---------- */
header{
  position:sticky;
  top:0;
  z-index:1000;
  width:100%;
  background:rgba(255,255,255,0.8);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid rgba(226,234,232,0.6);
  box-shadow:0 4px 24px rgba(0,0,0,0.05);
  transition:box-shadow 0.3s ease, background 0.3s ease;
}
header.scrolled{
  background:rgba(255,255,255,0.94);
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.header-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 0;
  gap:28px;
  min-height:var(--header-height);
  min-width:0;
}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}
.brand img{height:56px;width:auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.08))}

nav.main-nav{display:flex;gap:26px;align-items:center;flex-wrap:wrap}
nav.main-nav a{
  font-weight:600;
  color:var(--dark);
  font-size:14.5px;
  white-space:nowrap;
  position:relative;
  padding:8px 0;
  text-decoration:none;
  transition:color 0.25s;
}
nav.main-nav a::after{
  content:'';
  position:absolute;
  bottom:0;left:0;
  width:0;height:3px;
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-900) 100%);
  border-radius:3px 3px 0 0;
  transition:width 0.3s ease;
}
nav.main-nav a:hover{color:var(--primary)}
nav.main-nav a:hover::after{width:100%}
nav.main-nav a.active{color:var(--primary)}
nav.main-nav a.active::after{width:100%}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:14px 26px;
  border-radius:14px;
  font-weight:700;
  border:none;
  cursor:pointer;
  font-size:15px;
  font-family:inherit;
  transition:transform 0.25s, box-shadow 0.25s, background 0.25s, color 0.25s;
  text-decoration:none;
}
.btn:focus-visible{outline:3px solid rgba(31,110,115,0.4);outline-offset:2px}
.btn-lg{padding:17px 34px;font-size:16.5px}

.btn-primary{
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-900) 100%);
  color:#fff;
  box-shadow:0 4px 16px rgba(31,110,115,0.25);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(31,110,115,0.35)}

.btn-accent{
  background:linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%);
  color:#1a1a1a;
  box-shadow:0 4px 16px rgba(245,165,74,0.3);
}
.btn-accent:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(245,165,74,0.4)}

.btn-tenant{
  background:linear-gradient(135deg, var(--tenant) 0%, var(--tenant-dark) 100%);
  color:#fff;
  box-shadow:0 4px 16px rgba(139,92,246,0.25);
}
.btn-tenant:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(139,92,246,0.35)}

.btn-white{background:#fff;color:var(--primary);border:2px solid rgba(255,255,255,0.4)}
.btn-white:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.15)}

.btn-outline{
  background:transparent;
  color:var(--primary);
  border:2px solid var(--primary);
}
.btn-outline:hover{background:var(--primary);color:#fff;transform:translateY(-2px)}

.btn-outline-tenant{
  background:transparent;
  color:var(--tenant-dark);
  border:2px solid var(--tenant);
}
.btn-outline-tenant:hover{background:var(--tenant);color:#fff;transform:translateY(-2px)}

/* ---------- eyebrow / section headers ---------- */
.eyebrow{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--primary);
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
  font-weight:500;
}
.eyebrow::before{content:'';width:18px;height:1px;background:var(--primary)}
.eyebrow.eyebrow-center{justify-content:center}
.eyebrow.eyebrow-center::before{display:none}
.eyebrow.eyebrow-tenant{color:var(--tenant-dark)}
.eyebrow.eyebrow-tenant::before{background:var(--tenant-dark)}
.eyebrow.eyebrow-accent{color:var(--accent-dark)}
.eyebrow.eyebrow-accent::before{background:var(--accent-dark)}

.section-header{text-align:center;max-width:760px;margin:0 auto 56px}
.section-title{
  font-size:clamp(30px, 4vw, 42px);
  font-weight:900;
  color:var(--dark);
  line-height:1.15;
  letter-spacing:-0.015em;
  margin-bottom:14px;
}
.section-subtitle{font-size:18px;color:var(--text-light)}

/* ---------- hero (split, gateway) ---------- */
.hero-split{
  background:
    radial-gradient(ellipse 900px 500px at 85% -10%, rgba(31,110,115,0.07), transparent),
    linear-gradient(180deg, var(--paper) 0%, #fff 100%);
  padding:72px 0 88px;
  position:relative;
  overflow:hidden;
}
.hero-grid{
  display:grid;
  grid-template-columns:1.05fr 0.95fr;
  gap:56px;
  align-items:center;
}
.hero-copy .eyebrow{opacity:0;animation:rise .6s ease forwards}
.hero-copy h1{
  font-size:clamp(32px, 4.2vw, 50px);
  line-height:1.12;
  font-weight:900;
  letter-spacing:-0.02em;
  color:var(--dark);
  margin:0 0 20px;
  opacity:0;
  animation:rise .6s ease .08s forwards;
}
.hero-copy h1 em{
  font-style:normal;
  color:var(--primary);
  background:linear-gradient(transparent 64%, rgba(31,110,115,0.16) 64%);
}
.hero-copy .sub{
  font-size:17px;
  line-height:1.6;
  color:var(--text-light);
  max-width:480px;
  margin:0 0 32px;
  opacity:0;
  animation:rise .6s ease .16s forwards;
}
.hero-copy .sub-short{display:none}
.hero-copy .hero-note-short{display:none}
.hero-ctas{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  opacity:0;
  animation:rise .6s ease .24s forwards;
}
.hero-note{
  margin-top:18px;
  font-size:13px;
  color:var(--text-light);
  opacity:0;
  animation:rise .6s ease .3s forwards;
}
.hero-note a{color:var(--primary);font-weight:600}

@keyframes rise{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

/* ---------- certificate stage card ---------- */
.cert-stage{
  display:flex;
  justify-content:center;
  align-items:center;
  opacity:0;
  animation:cardIn .7s cubic-bezier(.2,.7,.3,1) .3s forwards;
}
@keyframes cardIn{
  from{opacity:0;transform:rotate(0deg) translateY(18px) scale(.97)}
  to{opacity:1;transform:rotate(-2.5deg) translateY(0) scale(1)}
}
.cert-stage.cert-stage-static{
  animation:none;
  opacity:1;
}
.cert{
  position:relative;
  width:380px;
  max-width:100%;
  background:var(--card);
  border-radius:12px;
  padding:24px 24px 22px;
  box-shadow:0 24px 55px -14px rgba(15,58,62,.35), 0 2px 8px rgba(15,58,62,.08);
  overflow:hidden;
}
.cert::before{
  /* guilloche-style security border */
  content:'';
  position:absolute;
  inset:9px;
  border:1px solid var(--border);
  border-radius:7px;
  pointer-events:none;
  background-image:repeating-linear-gradient(45deg, rgba(15,58,62,.045) 0 1px, transparent 1px 7px);
}
.cert-watermark{
  position:absolute;
  top:46%;left:50%;
  transform:translate(-50%,-50%) rotate(-18deg);
  font-family:var(--mono);
  font-size:44px;
  font-weight:500;
  letter-spacing:.15em;
  color:var(--primary-dark);
  opacity:.055;
  pointer-events:none;
  white-space:nowrap;
}
.cert-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  position:relative;
  z-index:1;
  margin-bottom:16px;
}
.cert-kicker{
  font-family:var(--mono);
  font-size:9.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--text-light);
}
.cert-id{font-family:var(--mono);font-size:9.5px;color:var(--text-light)}
.cert-body{position:relative;z-index:1;display:flex;gap:14px;margin-bottom:16px}
.cert-avatar{
  width:56px;height:56px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-900) 100%);
  color:#fff;
  font-weight:800;
  font-size:19px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.cert-name{font-weight:800;font-size:18px;color:var(--dark);margin:2px 0 4px;letter-spacing:-0.01em}
.cert-sample-tag{
  display:inline-block;
  font-family:var(--mono);
  font-size:9px;
  color:var(--accent-dark);
  border:1px solid var(--accent-dark);
  border-radius:3px;
  padding:1px 6px;
  letter-spacing:.05em;
}
.cert-fields{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:11px 14px;
  padding-top:14px;
  border-top:1px dashed var(--border);
}
.cert-field-label{
  font-family:var(--mono);
  font-size:9.5px;
  color:var(--text-light);
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:2px;
}
.cert-field-value{
  font-family:var(--mono);
  font-size:13px;
  color:var(--text);
  display:flex;
  align-items:center;
  gap:5px;
}
.cert-check{color:var(--green)}
.cert-seal{
  position:absolute;
  top:18px;right:20px;
  z-index:2;
  width:56px;height:56px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #16c795, var(--green));
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#fff;
  box-shadow:0 6px 14px rgba(16,185,129,.4);
  transform:scale(0);
  animation:stamp .5s cubic-bezier(.3,1.6,.4,1) 1.1s forwards;
}
.cert-stage-static .cert-seal{animation-delay:.4s}
.cert-seal::after{
  content:'';
  position:absolute;
  inset:-4px;
  border-radius:50%;
  border:1.5px dashed rgba(255,255,255,.55);
}
.cert-seal b{font-size:20px;line-height:1;font-weight:800}
.cert-seal small{font-family:var(--mono);font-size:7px;letter-spacing:.06em;margin-top:1px}
@keyframes stamp{
  0%{transform:scale(0) rotate(-15deg)}
  70%{transform:scale(1.12) rotate(3deg)}
  100%{transform:scale(1) rotate(0deg)}
}

/* ---------- role tabs ("Pre koho to je") ---------- */
.split-section{background:#fff}
.tabs{display:flex;justify-content:center;gap:6px}
.tab{
  font-family:inherit;
  font-size:15px;
  font-weight:600;
  padding:13px 26px;
  border-radius:16px 16px 0 0;
  background:transparent;
  border:1px solid var(--border);
  border-bottom:none;
  color:var(--text-light);
  cursor:pointer;
  position:relative;
  top:1px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:color 0.2s, background 0.2s;
}
.tab i{font-size:18px}
.tab[aria-selected="true"]{
  background:var(--light);
  color:var(--primary);
  box-shadow:0 -4px 12px rgba(15,58,62,.05);
}
.tab[aria-selected="true"].tab-tenant{color:var(--tenant-dark)}
.tab-panel-wrap{
  background:var(--light);
  border:1px solid var(--border);
  border-radius:8px;
  max-width:960px;
  margin:0 auto;
  padding:40px 44px 36px;
  box-shadow:0 12px 30px -18px rgba(15,58,62,.18);
}
.tab-panel{display:none;grid-template-columns:repeat(3, 1fr);gap:28px}
.tab-panel.active{display:grid;animation:fadeTab .35s ease}
@keyframes fadeTab{
  from{opacity:0;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}
.tp-item .n{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--primary);
  margin-bottom:8px;
  display:block;
}
.tab-panel.panel-tenant .tp-item .n{color:var(--tenant-dark)}
.tp-item h3{font-size:17px;font-weight:800;color:var(--dark);margin:0 0 8px;letter-spacing:-0.01em}
.tp-item p{font-size:14px;color:var(--text-light);line-height:1.55;margin:0}
.tp-cta{grid-column:1/-1;text-align:center;margin-top:14px}

/* ---------- steps ---------- */
.steps-band{background:var(--paper)}
.steps-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  gap:26px;
}
.step-card{
  background:#fff;
  padding:32px 30px;
  border-radius:20px;
  border:1px solid var(--border);
  position:relative;
  transition:transform 0.3s, box-shadow 0.3s, border-color 0.3s;
}
.step-card:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 50px rgba(15,58,62,0.1);
  border-color:var(--primary);
}
.step-card.step-tenant:hover{border-color:var(--tenant)}
.step-num{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--primary);
  display:block;
  margin-bottom:14px;
}
.step-card.step-tenant .step-num{color:var(--tenant-dark)}
.step-icon{
  width:56px;height:56px;
  background:var(--primary-soft);
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
}
.step-icon i{font-size:28px;color:var(--primary)}
.step-card.step-tenant .step-icon{background:var(--tenant-soft)}
.step-card.step-tenant .step-icon i{color:var(--tenant-dark)}
.step-card h3{font-size:19px;font-weight:800;color:var(--dark);margin-bottom:10px;letter-spacing:-0.01em}
.step-card p{color:var(--text-light);font-size:14.5px}

/* ---------- feature split rows (role pages) ---------- */
.feature-split{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:72px;
  align-items:center;
}
.feature-split h2{
  font-size:clamp(28px, 3.4vw, 40px);
  font-weight:900;
  color:var(--dark);
  line-height:1.15;
  letter-spacing:-0.015em;
  margin-bottom:20px;
}
.feature-split .lead{font-size:17.5px;color:var(--text-light);margin-bottom:28px}
.features-list{list-style:none;margin-bottom:32px}
.features-list li{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:18px;
  font-size:15.5px;
}
.features-list li i{color:var(--primary);font-size:22px;flex-shrink:0;margin-top:2px}
.features-list.features-tenant li i{color:var(--tenant-dark)}
.features-list li strong{color:var(--dark)}

/* ---------- benefit cards ---------- */
.benefits-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap:26px;
}
.benefit-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:20px;
  padding:32px 30px;
  transition:transform 0.3s, box-shadow 0.3s;
}
.benefit-card:hover{transform:translateY(-5px);box-shadow:0 18px 45px rgba(15,58,62,0.09)}
.benefit-icon{
  width:52px;height:52px;
  border-radius:13px;
  background:var(--primary-soft);
  color:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
  margin-bottom:18px;
}
.benefit-card.benefit-tenant .benefit-icon{background:var(--tenant-soft);color:var(--tenant-dark)}
.benefit-card h3{font-size:18px;font-weight:800;color:var(--dark);margin-bottom:8px}
.benefit-card p{font-size:14.5px;color:var(--text-light)}

/* ---------- tenant profile mockup ---------- */
.profile-mock{
  background:#fff;
  border-radius:22px;
  padding:32px;
  box-shadow:0 24px 60px rgba(15,58,62,0.14);
  border:1px solid var(--border);
  max-width:420px;
  margin:0 auto;
}
.profile-mock-head{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.profile-mock-avatar{
  width:60px;height:60px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--tenant) 0%, var(--tenant-dark) 100%);
  color:#fff;
  font-weight:800;
  font-size:20px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.profile-mock-head h3{font-size:19px;font-weight:800;color:var(--dark)}
.profile-mock-status{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:700;
  color:#059669;
}
.profile-mock-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:20px;
}
.profile-mock-stat{
  background:var(--light);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
  text-align:center;
}
.profile-mock-stat b{display:block;font-size:26px;font-weight:900;color:var(--tenant-dark)}
.profile-mock-stat span{font-size:12px;color:var(--text-light);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.profile-mock-demand{
  background:var(--tenant-soft);
  border-radius:14px;
  padding:16px 18px;
  margin-bottom:16px;
}
.profile-mock-demand h4{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  color:var(--tenant-dark);
  margin-bottom:10px;
}
.profile-mock-demand-row{
  display:flex;
  justify-content:space-between;
  font-size:13.5px;
  padding:4px 0;
}
.profile-mock-demand-row span:first-child{color:var(--text-light)}
.profile-mock-demand-row span:last-child{font-weight:700;color:var(--dark)}
.profile-mock-note{
  text-align:center;
  padding:13px;
  background:var(--light);
  border-radius:12px;
  font-size:13px;
  color:var(--text-light);
}

/* ---------- testimonials ---------- */
.testimonials-band{background:var(--paper)}
.testimonials-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap:26px;
  max-width:1000px;
  margin:0 auto;
}
.testimonial-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:20px;
  padding:30px;
  display:flex;
  flex-direction:column;
  gap:16px;
  transition:transform 0.3s, box-shadow 0.3s;
}
.testimonial-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(15,58,62,0.09)}
.testimonial-header{display:flex;align-items:center;gap:14px}
.testimonial-avatar{
  width:48px;height:48px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-900) 100%);
  color:#fff;
  font-weight:800;
  font-size:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.testimonial-avatar.avatar-tenant{background:linear-gradient(135deg, var(--tenant) 0%, var(--tenant-dark) 100%)}
.testimonial-info h4{font-size:16px;font-weight:800;color:var(--dark)}
.testimonial-info p{font-size:13px;color:var(--text-light)}
.testimonial-text{font-size:14.5px;color:var(--text);line-height:1.65;flex:1}
.testimonial-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  padding-top:14px;
  border-top:1px solid var(--border);
}
.testimonial-rating{color:var(--accent);font-size:15px;display:flex;gap:2px}
.testimonial-property{font-size:12.5px;color:var(--text-light);font-weight:600}

/* ---------- CTA band ---------- */
.cta-band{
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  color:#fff;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.cta-band::before{
  content:'';
  position:absolute;
  inset:0;
  background:url('data:image/svg+xml,<svg width="60" height="60" xmlns="http://www.w3.org/2000/svg"><circle cx="1" cy="1" r="1" fill="rgba(255,255,255,0.07)"/></svg>');
}
.cta-band .container{position:relative;z-index:1}
.cta-band h2{font-size:clamp(28px, 3.5vw, 40px);font-weight:900;letter-spacing:-0.015em;margin-bottom:14px}
.cta-band p{font-size:18px;color:rgba(255,255,255,0.85);max-width:560px;margin:0 auto 32px}
.cta-band .cta-buttons{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cta-band.cta-tenant{background:linear-gradient(135deg, var(--tenant) 0%, #5B21B6 100%)}
.cta-band.cta-tenant .btn-white{color:var(--tenant-dark)}

/* ---------- page hero (subpages) ---------- */
.page-hero{
  background:
    radial-gradient(ellipse 800px 400px at 90% -20%, rgba(31,110,115,0.08), transparent),
    linear-gradient(180deg, var(--paper) 0%, #fff 100%);
  padding:64px 0 72px;
}
.page-hero.page-hero-tenant{
  background:
    radial-gradient(ellipse 800px 400px at 90% -20%, rgba(139,92,246,0.09), transparent),
    linear-gradient(180deg, #F6F4FB 0%, #fff 100%);
}
.page-hero.page-hero-tenant .hero-copy h1 em{
  color:var(--tenant-dark);
  background:linear-gradient(transparent 64%, rgba(139,92,246,0.16) 64%);
}
.page-hero.page-hero-plain{padding:64px 0 56px}
.page-hero.page-hero-plain .hero-copy{max-width:720px;margin:0 auto;text-align:center}
.page-hero.page-hero-plain .eyebrow{justify-content:center}
.page-hero.page-hero-plain .eyebrow::before{display:none}
.page-hero.page-hero-plain .hero-copy .sub{margin-left:auto;margin-right:auto}
.page-hero.page-hero-plain .hero-ctas{justify-content:center}

/* ---------- FAQ ---------- */
.faq-toggle{
  display:flex;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:36px;
}
.faq-toggle button{
  font-family:inherit;
  font-size:14px;
  font-weight:700;
  padding:11px 22px;
  border-radius:100px;
  border:1.5px solid var(--border);
  background:#fff;
  color:var(--text-light);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:all 0.2s;
}
.faq-toggle button:hover{border-color:var(--primary);color:var(--primary)}
.faq-toggle button[aria-pressed="true"]{
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
.faq-list{max-width:860px;margin:0 auto}
.faq-item{
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  margin-bottom:14px;
  overflow:hidden;
  transition:box-shadow 0.25s, border-color 0.25s;
}
.faq-item:hover{border-color:rgba(31,110,115,0.35)}
.faq-item[hidden]{display:none}
.faq-button{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  text-align:left;
  font-family:inherit;
  font-size:16.5px;
  font-weight:700;
  color:var(--dark);
  background:none;
  border:none;
  cursor:pointer;
  padding:20px 24px;
}
.faq-button .faq-arrow{
  font-size:14px;
  color:var(--primary);
  transition:transform 0.3s;
  flex-shrink:0;
}
.faq-button[aria-expanded="true"] .faq-arrow{transform:rotate(180deg)}
.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height 0.35s ease;
}
.faq-answer.active{max-height:400px}
.faq-answer p{padding:0 24px 22px;color:var(--text-light);font-size:15px}
.faq-role-tag{
  display:inline-block;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  padding:3px 10px;
  border-radius:100px;
  margin-left:10px;
  flex-shrink:0;
}
.faq-role-tag.tag-landlord{background:var(--primary-soft);color:var(--primary)}
.faq-role-tag.tag-tenant{background:var(--tenant-soft);color:var(--tenant-dark)}

/* ---------- contact ---------- */
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:56px;
  align-items:start;
  max-width:1000px;
  margin:0 auto;
}
.contact-info h3{font-size:26px;font-weight:900;color:var(--dark);margin-bottom:14px}
.contact-info > p{color:var(--text-light);margin-bottom:28px;font-size:16px}
.contact-methods{display:flex;flex-direction:column;gap:14px}
.contact-method{
  display:flex;
  align-items:center;
  gap:16px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  padding:16px 20px;
  text-decoration:none;
  transition:transform 0.25s, box-shadow 0.25s, border-color 0.25s;
}
.contact-method:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(15,58,62,0.09);
  border-color:rgba(31,110,115,0.35);
}
.contact-method-icon{
  width:48px;height:48px;
  border-radius:13px;
  background:var(--primary-soft);
  color:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  flex-shrink:0;
}
.contact-method-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-light)}
.contact-method-value{font-size:15.5px;font-weight:700;color:var(--dark)}

.contact-form{
  background:#fff;
  border:1px solid var(--border);
  border-radius:22px;
  padding:36px;
  box-shadow:0 18px 50px rgba(15,58,62,0.08);
}
.contact-form label{
  display:block;
  font-size:13px;
  font-weight:700;
  color:var(--dark);
  margin-bottom:7px;
}
.contact-form input,
.contact-form select,
.contact-form textarea{
  width:100%;
  padding:13px 15px;
  border:1.5px solid var(--border);
  border-radius:12px;
  font:inherit;
  font-size:15px;
  background:#fff;
  transition:border-color 0.2s, box-shadow 0.2s;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(31,110,115,0.12);
}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.form-group{margin-bottom:16px}
.form-message{
  display:none;
  padding:14px 18px;
  border-radius:12px;
  font-size:14.5px;
  font-weight:600;
  margin-bottom:18px;
}
.form-message.show{display:block}
.form-message.success{background:var(--green-soft);color:#166534}
.form-message.error{background:#FEE2E2;color:#991B1B}

/* ---------- marketplace / listings ---------- */
.marketplace-filters{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:12px;
  margin-bottom:24px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  padding:20px;
}
.marketplace-filters label{
  display:block;
  font-size:12px;
  font-weight:700;
  color:var(--text-light);
  margin-bottom:6px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.marketplace-filters select,
.marketplace-filters input{
  width:100%;
  padding:12px 14px;
  border:1.5px solid var(--border);
  border-radius:11px;
  font:inherit;
  background:#fff;
}
.marketplace-filters select:focus,
.marketplace-filters input:focus{outline:none;border-color:var(--primary)}
.listings-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:22px;
}
.listing-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 8px 24px rgba(15,23,42,0.06);
  display:flex;
  flex-direction:column;
  transition:transform 0.25s, box-shadow 0.25s;
}
.listing-card:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(15,23,42,0.1)}
.listing-card-media{display:block}
.listing-card-image-wrap{position:relative}
.listing-card-image{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
  background:var(--light);
}
.listing-image-badge{
  position:absolute;left:10px;bottom:10px;
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 10px;border-radius:999px;font-size:11px;font-weight:700;
  background:rgba(255,255,255,0.92);color:var(--text-light);
}
.listing-image-badge-real{color:var(--primary)}
.listing-score-container{
  display:flex;align-items:center;gap:12px;
  border:1px solid rgba(16,185,129,0.2);
  background:linear-gradient(135deg, rgba(16,185,129,0.08) 0%, rgba(16,185,129,0.03) 100%);
  border-radius:12px;
  padding:10px 12px;
}
.listing-score-container.listing-score-pending{background:#F8FAFC}
.listing-score-circle{
  width:58px;height:58px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:4px solid;flex-shrink:0;background:#fff;
}
.listing-score-compact .listing-score-circle{width:50px;height:50px;border-width:3px}
.listing-score-circle.score-success{border-color:#10B981}
.listing-score-circle.score-warning{border-color:#F59E0B}
.listing-score-circle.score-danger{border-color:#EF4444}
.listing-score-circle.score-info{border-color:var(--primary)}
.listing-score-value{font-size:22px;font-weight:800;line-height:1}
.listing-score-compact .listing-score-value{font-size:18px}
.listing-score-value.score-success{color:#10B981}
.listing-score-value.score-warning{color:#F59E0B}
.listing-score-value.score-danger{color:#EF4444}
.listing-score-value.score-info{color:var(--primary)}
.listing-score-label{font-size:8px;font-weight:700;text-transform:uppercase;opacity:.8}
.listing-score-title{font-size:13px;font-weight:700;color:var(--dark)}
.listing-score-subtitle{font-size:12px;color:var(--text-light);line-height:1.4}
.listing-card-body{padding:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.listing-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;
}
.listing-badge-success{background:#DCFCE7;color:#166534}
.listing-badge-warning{background:#FEF3C7;color:#92400E}
.listing-card-title{font-size:18px;font-weight:800;color:var(--dark)}
.listing-card-title a{color:inherit;text-decoration:none}
.listing-card-title-meta{font-weight:600;color:var(--text-light)}
.listing-card-subtitle,.listing-card-meta{color:var(--text-light);font-size:14px}
.listing-card-price{font-size:20px;font-weight:800;color:var(--primary)}
.listing-card-desc{
  color:var(--text-light);
  font-size:14px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.listing-card-teaser{font-size:12px;color:var(--primary);font-weight:600}
.listing-card-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:8px}
.btn-listing{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 14px;border-radius:10px;font-size:13px;font-weight:700;
  text-decoration:none;border:none;cursor:pointer;
}
.btn-listing-primary{background:var(--primary);color:#fff}
.btn-listing-outline{background:#fff;border:1px solid var(--border);color:var(--dark)}
.btn-listing-muted{background:#E2E8F0;color:#64748B;cursor:not-allowed}
.listings-loading,.listings-empty{
  grid-column:1/-1;
  text-align:center;
  padding:40px 20px;
  color:var(--text-light);
}
.marketplace-limit-note{
  margin-top:24px;
  text-align:center;
  font-size:14px;
  color:var(--text-light);
}
.marketplace-limit-note a{color:var(--primary);font-weight:700}

/* ---------- score bands (cert explainer) ---------- */
.score-bands{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap:24px;
  max-width:960px;
  margin:0 auto;
}
.score-band{
  background:#fff;
  border:1px solid var(--border);
  border-radius:20px;
  padding:30px;
  text-align:center;
}
.score-band-circle{
  width:76px;height:76px;
  border-radius:50%;
  border:5px solid;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  margin:0 auto 18px;
  font-weight:900;
  font-size:19px;
}
.score-band-circle.band-success{border-color:#10B981;color:#10B981}
.score-band-circle.band-warning{border-color:#F59E0B;color:#F59E0B}
.score-band-circle.band-danger{border-color:#EF4444;color:#EF4444}
.score-band h3{font-size:17px;font-weight:800;color:var(--dark);margin-bottom:8px}
.score-band p{font-size:14px;color:var(--text-light)}

/* ---------- scroll animations ---------- */
.fade-in{opacity:0;transform:translateY(28px);transition:opacity 0.6s ease-out, transform 0.6s ease-out}
.fade-in.visible{opacity:1;transform:translateY(0)}
.fade-in-left{opacity:0;transform:translateX(-28px);transition:opacity 0.6s ease-out, transform 0.6s ease-out}
.fade-in-left.visible{opacity:1;transform:translateX(0)}
.fade-in-right{opacity:0;transform:translateX(28px);transition:opacity 0.6s ease-out, transform 0.6s ease-out}
.fade-in-right.visible{opacity:1;transform:translateX(0)}

/* ---------- WhatsApp float ---------- */
.whatsapp-float{
  position:fixed;
  bottom:24px;
  right:24px;
  width:58px;height:58px;
  background:#25D366;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:30px;
  box-shadow:0 8px 24px rgba(37,211,102,0.4);
  z-index:900;
  transition:transform 0.25s;
}
.whatsapp-float:hover{transform:scale(1.08)}

/* ---------- footer ---------- */
footer{
  background:var(--dark);
  color:#94a3b8;
  padding:64px 0 36px;
}
.footer-top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:48px;
  padding-bottom:40px;
  border-bottom:1px solid rgba(148,163,184,0.15);
  margin-bottom:32px;
}
.footer-brand{display:flex;align-items:flex-start;gap:16px}
.footer-brand img{height:52px;filter:brightness(0) invert(1);opacity:0.9}
.footer-brand strong{display:block;color:#fff;font-size:18px;margin-bottom:4px}
.footer-brand p{font-size:14px}
.footer-col h4{
  color:#fff;
  font-size:13px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:16px;
}
.footer-col a{
  display:block;
  color:#94a3b8;
  text-decoration:none;
  font-size:14.5px;
  padding:5px 0;
  transition:color 0.2s;
}
.footer-col a:hover{color:#fff}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
  font-size:13.5px;
  line-height:1.7;
}
.footer-bottom a{color:#cbd5e1}
.footer-bottom strong{color:#e2e8f0}

/* ---------- responsive ---------- */
@media (max-width: 968px){
  nav.main-nav{display:none}
  .header-wrap > .btn{display:none}
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .cert-stage{order:-1}
  .feature-split{grid-template-columns:1fr;gap:44px}
  .footer-top{grid-template-columns:1fr;gap:32px}
  .contact-grid{grid-template-columns:1fr;gap:40px}
}

@media (max-width: 768px){
  .container{padding:0 24px}
  section{padding:64px 0}
  .hero-split{padding:48px 0 64px}
  .tab-panel{grid-template-columns:1fr}
  .tab-panel-wrap{padding:28px 24px}
  .tab{padding:11px 18px;font-size:14px}
  .form-grid{grid-template-columns:1fr}
}

@media (max-width: 640px){
  .container{padding:0 16px}
  .brand img{height:48px}
  .hero-copy .sub-full{display:none}
  .hero-copy .sub-short{
    display:block;
    font-size:15px;
    line-height:1.5;
    margin-bottom:24px;
  }
  .hero-copy .hero-note-full{display:none}
  .hero-copy .hero-note-short{
    display:block;
    margin-top:14px;
  }
  .hero-ctas .btn{width:100%}
  .cta-band .cta-buttons .btn{width:100%}
  .whatsapp-float{width:52px;height:52px;font-size:26px;bottom:18px;right:18px}
}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  .hero-copy .eyebrow,.hero-copy h1,.hero-copy .sub,.hero-copy .hero-note,.hero-ctas,.cert-stage,.cert-seal{opacity:1 !important;transform:none !important}
  .fade-in,.fade-in-left,.fade-in-right{opacity:1 !important;transform:none !important}
}