/*
Theme Name: Flovra v2
Theme URI: https://flovra.app
Author: Flovra
Description: Official Flovra marketing theme — clean, minimal, Apple-style. The header and footer are fixed and built into the theme. Page content is added by you: create a page, add a Custom HTML block, and paste the Flovra page code.
Version: 2.1.0
License: Proprietary
Text Domain: flovra
*/

/* ============ design tokens ============ */
:root{
  --flv-blue:#2F6CE3; --flv-blue-dark:#295FDE; --flv-blue-light:#3477EC;
  --flv-grad:linear-gradient(135deg,#295FDE 0%,#2F6CE3 50%,#3477EC 100%);
  --flv-bg:#FAFAFB; --flv-card:#FFFFFF; --flv-ink:#1C1C20; --flv-gray:#6E6E73;
  --flv-line:#E8E8ED; --flv-max:1140px;
  --flv-header-h:64px; --flv-footer-h:54px;
}

.flovra-header,.flovra-footer,.flovra-content,
.flovra-header *,.flovra-footer *,.flovra-content *{box-sizing:border-box;}

body{
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;
  background:var(--flv-bg); color:var(--flv-ink); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  margin:0; padding:0;
}
::selection{background:rgba(47,108,227,.18);}

/* ============ fixed header ============ */
.flovra-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--flv-header-h);
  background:rgba(250,250,251,.85);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid var(--flv-line);
}
body.admin-bar .flovra-header{top:32px;}
@media (max-width:782px){ body.admin-bar .flovra-header{top:46px;} }

.flovra-header-in{
  max-width:var(--flv-max); margin:0 auto; padding:0 24px; height:100%;
  display:flex; align-items:center; gap:28px; position:relative;
}
.flovra-logo{font-size:22px; font-weight:800; letter-spacing:-.6px; text-decoration:none; color:var(--flv-ink);}
.flovra-logo span{background:var(--flv-grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.flovra-logo.sm{font-size:18px;}

.flovra-nav{
  position:absolute; left:50%; transform:translateX(-50%);
  display:flex; gap:26px; font-size:14.5px;
}
.flovra-nav ul{display:flex; gap:26px; margin:0; padding:0; list-style:none;}
.flovra-nav a{color:#3a3a40; text-decoration:none; opacity:.75; transition:opacity .15s;}
.flovra-nav a:hover,.flovra-nav .current-menu-item a,.flovra-nav a.flv-active{opacity:1; color:var(--flv-blue-dark); font-weight:600;}

.flovra-burger{display:none; margin-left:auto; border:none; background:none; cursor:pointer; padding:8px; color:var(--flv-ink);}
.flovra-burger svg{width:24px; height:24px;}

/* ============ page content area ============ */
.flovra-content{
  padding-top:var(--flv-header-h);
  padding-bottom:calc(var(--flv-footer-h) + 28px);
  min-height:100vh;
}
.flovra-article{max-width:100%;}

/* ============ fixed footer ============ */
.flovra-footer{
  position:fixed; bottom:0; left:0; right:0; z-index:1000;
  height:var(--flv-footer-h);
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-top:1px solid var(--flv-line);
}
.flovra-footer-in{
  max-width:var(--flv-max); margin:0 auto; padding:0 24px; height:100%;
  display:flex; align-items:center; gap:18px;
}
.flovra-copy{font-size:13px; color:var(--flv-gray); white-space:nowrap;}
.flovra-foot-links{margin-left:auto; display:flex; gap:20px;}
.flovra-foot-links a{font-size:13.5px; color:#3a3a40; text-decoration:none; opacity:.8;}
.flovra-foot-links a:hover{opacity:1; color:var(--flv-blue-dark);}

/* ============ 404 page ============ */
.flv-404{max-width:640px; margin:0 auto; padding:110px 24px; text-align:center;}
.flv-404 h1{font-size:clamp(32px,5vw,48px); font-weight:800; letter-spacing:-1.5px; margin:0 0 14px;}
.flv-404 p{color:var(--flv-gray); font-size:17px; margin:0 0 30px;}
.flv-404-btn{display:inline-flex; align-items:center; justify-content:center; text-decoration:none;
  color:#fff; font-weight:600; font-size:15px; background:var(--flv-grad);
  padding:14px 34px; border-radius:99px; box-shadow:0 8px 24px rgba(47,108,227,.35);}

/* ============ generic flv components (used by pasted page blocks) ============ */
/* reveal-on-scroll: only hidden when JS is on (progressive enhancement) */
.js .flv-rv{opacity:0; transform:translateY(26px); transition:opacity .6s ease, transform .6s ease;}
.js .flv-rv.in{opacity:1; transform:none;}

.flv-faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.flv-faq-item.open .flv-faq-q .flv-chev{transform:rotate(45deg);}
.flv-faq-q .flv-chev{transition:transform .2s; display:inline-block;}

/* ============ mobile ============ */
@media (max-width:860px){
  .flovra-nav{display:none;}
  .flovra-nav.open{
    display:block; position:absolute; top:var(--flv-header-h); left:0; right:0;
    transform:none;
    background:#fff; border-bottom:1px solid var(--flv-line);
    padding:8px 24px 18px; margin:0;
  }
  .flovra-nav.open ul{flex-direction:column; gap:2px;}
  .flovra-nav.open a{display:block; padding:10px 0; font-size:16px;}
  .flovra-burger{display:block;}
  .flovra-foot-links{display:none;}
  .flovra-copy{font-size:12px;}
}