/* =====================================================================
   Fundvaliz Investor Corner - shared stylesheet
   Used by all nine disclosure pages. Mobile first:
   base styles = phone, then tablet (min-width 700px), desktop (1000px).
   Brand colours come from the Fundvaliz logo.
   ===================================================================== */

:root { --lime: #AFCB1F; /* logo symbol - buttons, bars, accents (never as text on white) */ --lime-tint: #F1F6DA; /* soft panels */ --olive: #5E7010; /* green text and links - passes contrast on white */ --olive-dark: #3F4B08; --charcoal: #4D4D4D; /* logo wordmark - footer, secondary buttons */ --ink: #2B2B2B; /* body text */ --muted: #555555; --muted-2: #5F5F5F; --page: #F7F7F4; --card: #FFFFFF; --line: #DEDEDA; --line-soft: #ECECE7; --head-bg: #F0F0EC; --font-head: Questrial, "Century Gothic" , "Segoe UI" , sans-serif; --font-body: Mulish, "Helvetica Neue" , Arial, sans-serif; --gutter: 16px; --radius: 12px; }

.fv-main * { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--page); }
.fv-main img { max-width: 100%; height: auto; display: block; }
a { color: var(--olive); }
a:hover { color: var(--olive-dark); }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--olive); outline-offset: 2px; }

.fv-main { font-size: 16px; line-height: 1.6; font-family: var(--font-body); color: var(--ink); }
.fv-wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 var(--gutter); }

/* ---------- Mockup header (replace with site header) ---------- */
.fv-header { background: var(--card); border-top: 4px solid var(--lime); border-bottom: 1px solid var(--line); }
.fv-header .fv-wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; }
.fv-header__logo img { height: 32px; width: auto; }
.fv-nav { display: none; }
.fv-nav a { color: var(--ink); text-decoration: none !important; font-size: 15px; }
.fv-nav a[aria-current="page"] { font-weight: 700; border-bottom: 3px solid var(--lime); padding-bottom: 3px; }
.fv-menu { position: relative; }
.fv-menu summary { list-style: none; cursor: pointer; padding: 10px 14px; border: 1px solid var(--line); border-radius: 8px; font-weight: 600; font-size: 15px; }
.fv-menu summary::-webkit-details-marker { display: none; }
.fv-menu__panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 10; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 8px; min-width: 240px; display: flex; flex-direction: column; box-shadow: 0 8px 24px rgba(0,0,0,.08); }
.fv-menu__panel a { padding: 12px; text-decoration: none !important; color: var(--ink); border-radius: 8px; }
.fv-menu__panel a:hover { background: var(--lime-tint); }

/***Added by Midhun***/
#pageheadersec { display: none; }
.fv-main a { text-decoration: revert; }
.fv-card > ul > li { list-style: disc; }

/* ---------- Page blocks ---------- */
.fv-hero { padding: 36px 0 28px; }
.fv-crumb { font-size: 14px; color: var(--muted-2); margin: 0 0 12px; }
.fv-eyebrow { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--olive); font-weight: 700; margin: 0 0 10px; }
.fv-hero h1 { font-family: var(--font-head); font-weight: 500; font-size: 34px; line-height: 1.15; margin: 0 0 14px; }
.fv-lead { font-size: 17px; color: var(--muted); margin: 0 0 12px; max-width: 860px; }
.fv-updated { font-size: 14px; color: var(--muted-2); margin: 0; }

.fv-section { padding: 40px 0 0; }
.fv-section h2 { font-family: var(--font-head); font-weight: 500; font-size: 26px; line-height: 1.25; margin: 0 0 12px; }
.fv-section h2 .fv-num { color: var(--olive); }
.fv-section > .fv-wrap > p.fv-sub { color: var(--muted); margin: 0 0 20px; max-width: 900px; }
.fv-main { padding-bottom: 56px; }

.fv-callout { background: var(--lime-tint); border-radius: var(--radius); padding: 22px 22px; }
.fv-callout h2, .fv-callout h3 { font-size: 18px; font-family: var(--font-body); font-weight: 700; margin: 0 0 8px; }
.fv-callout p { margin: 0 0 8px; color: #3A3A3A; }
.fv-callout p:last-child { margin-bottom: 0; }

/* ---------- Grids and cards ---------- */
.fv-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.fv-card { min-width: 0; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.fv-card h3 { font-size: 18px; line-height: 1.3; margin: 0; }
.fv-card p { margin: 0; color: var(--muted); font-size: 15px; }
.fv-card ul { margin: 0; padding-left: 20px; font-size: 15px; color: #3A3A3A; }
.fv-card li + li { margin-top: 6px; }
.fv-card__num { font-size: 13px; font-weight: 700; color: var(--olive); }
.fv-card__rule { width: 40px; height: 4px; border-radius: 2px; background: var(--lime); }
.fv-card--tint { background: var(--lime-tint); border-color: var(--lime-tint); }
.fv-step { width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background: var(--lime); color: var(--ink); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.fv-card__head { display: flex; align-items: center; gap: 12px; }
.fv-big { font-family: var(--font-head); font-size: 36px; color: var(--olive); line-height: 1; }

/* Hub cards (whole card is a link) */
a.fv-hubcard { text-decoration: none !important; color: var(--ink); min-height: 180px; }
a.fv-hubcard p { flex-grow: 1; }
a.fv-hubcard .fv-go { font-weight: 700; color: var(--olive); font-size: 15px; }
a.fv-hubcard:hover { border-color: var(--olive); }
a.fv-hubcard--feature { background: var(--lime); border-color: var(--lime); }
a.fv-hubcard--feature .fv-card__num, a.fv-hubcard--feature p, a.fv-hubcard--feature .fv-go { color: var(--ink); }
.fv-hubcard h3 { font-family: var(--font-head); font-weight: 500; font-size: 22px; }

/* Verification strip */
.fv-verify { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; display: flex; flex-direction: column; gap: 18px; }
.fv-verify dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; }
.fv-verify dt { font-size: 13px; color: var(--muted-2); }
.fv-verify dd { margin: 2px 0 0; font-size: 17px; font-weight: 700; }

/* Buttons */
.fv-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 20px; border-radius: 8px; font-weight: 600; text-decoration: none !important; text-align: center; }
.fv-btn--primary { background: var(--lime); color: var(--ink); }
.fv-btn--primary:hover { background: #9FB91A; color: var(--ink); }
.fv-btn--outline { border: 1px solid var(--charcoal); color: var(--ink); background: var(--card); }
.fv-btn--dark { background: var(--ink); color: #FFFFFF; }
.fv-btn--dark:hover { color: #FFFFFF; background: #111; }
.fv-actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* Link chips */
.fv-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.fv-chips a { display: inline-block; padding: 10px 16px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; font-weight: 600; font-size: 15px; text-decoration: none !important; }

/* Definition list (officer details) */
.fv-dl { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px 20px; font-size: 15px; }
.fv-dl dt { color: var(--muted-2); margin-top: 10px; }
.fv-dl dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }

/* Tag */
.fv-tag { display: inline-block; padding: 1px 9px; border-radius: 999px; background: var(--lime-tint); font-size: 12px; font-weight: 700; color: #3A3A3A; margin-left: 6px; }

/* ---------- Tables: real tables on desktop, stacked cards on phones ---------- */
.fv-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 15px; }
.fv-table caption { text-align: left; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--olive); font-weight: 700; padding: 0 0 10px; }
.fv-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.fv-table tr { display: block; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 10px; }
.fv-table td { display: grid; grid-template-columns: 40% minmax(0, 1fr); gap: 12px; padding: 5px 0; border: 0; }
.fv-table td::before { content: attr(data-label); color: var(--muted-2); font-size: 13px; font-weight: 600; }
.fv-table td.fv-td-title { display: block; font-weight: 700; font-size: 16px; padding-bottom: 8px; }
.fv-table td.fv-td-title::before { content: none; }
.fv-table td.fv-hide-sm { display: none; }
.fv-num-cell { font-variant-numeric: tabular-nums; }

/* Range bar */
.fv-bar { position: relative; display: block; height: 8px; background: var(--line-soft); border-radius: 4px; min-width: 80px; }
.fv-bar span { position: absolute; top: 0; bottom: 0; background: var(--lime); border-radius: 4px; }
.fv-scale { display: flex; justify-content: space-between; font-weight: 500; color: var(--muted-2); }

/* Escalation ladder */
.fv-ladder { list-style: none; margin: 0; padding: 0; max-width: 900px; }
.fv-ladder li { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; padding-bottom: 16px; }
.fv-ladder li:not(:last-child)::after { content: ""; position: absolute; left: 19px; top: 44px; bottom: 0; width: 2px; background: var(--line); }
.fv-ladder__dot { width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--lime); background: var(--card); display: flex; align-items: center; justify-content: center; font-weight: 700; }
.fv-ladder li:first-child .fv-ladder__dot { background: var(--lime); }
.fv-ladder .fv-card { gap: 4px; }
.fv-ladder .fv-level { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--olive); font-weight: 700; }

/* Terms list */
.fv-terms { max-width: 1100px; }
.fv-terms > div { padding: 20px 0; border-top: 1px solid var(--line); }
.fv-terms h2 { font-family: var(--font-body); font-size: 18px; font-weight: 700; margin: 0 0 8px; }
.fv-terms p, .fv-terms ul { margin: 0; color: #3A3A3A; }
.fv-terms ul { padding-left: 20px; }
.fv-terms li + li { margin-top: 6px; }

/* ---------- Mockup footer (replace with site footer) ---------- */
.fv-footer { background: var(--charcoal); color: #E6E6E6; padding: 40px 0 32px; font-size: 14px; line-height: 1.7; }
.fv-footer a { color: #FFFFFF; }
.fv-footer__cols { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.fv-footer__logo { height: 30px; width: auto; margin-bottom: 10px; }
.fv-footer strong { color: #FFFFFF; }
.fv-footer p { margin: 0; }
.fv-footer__legal { margin-top: 28px; padding-top: 20px; border-top: 1px solid #6A6A6A; font-size: 13px; color: #D0D0D0; }

/* Point-of-sale disclosure snippet */
.fv-pos-note { padding: 14px 16px; background: var(--page); border-radius: 10px; font-size: 14px; line-height: 1.6; color: #3A3A3A; }

/* =====================  Tablet  ===================== */
@media (min-width: 700px) {
    :root { --gutter: 32px; }
    .fv-hero h1 { font-size: 44px; }
    .fv-section h2 { font-size: 30px; }
    .fv-grid--2, .fv-grid--3, .fv-grid--4, .fv-grid--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fv-verify dl { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .fv-dl { grid-template-columns: 170px minmax(0, 1fr); }
    .fv-dl dt, .fv-dl dd { margin-top: 10px; }
    .fv-footer__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .fv-callout { padding: 26px 32px; }

    /* tables become real tables */
    .fv-table { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
    .fv-table thead { position: static; width: auto; height: auto; overflow: visible; clip: auto; display: table-header-group; }
    .fv-table tr { display: table-row; border: 0; border-radius: 0; padding: 0; margin: 0; background: none; }
    .fv-table th { background: var(--head-bg); text-align: left; font-size: 13px; font-weight: 700; color: #3A3A3A; padding: 12px 16px; vertical-align: bottom; }
    .fv-table td, .fv-table td.fv-td-title { display: table-cell; padding: 13px 16px; border-top: 1px solid var(--line-soft); vertical-align: middle; font-size: 15px; }
    .fv-table td.fv-td-title { font-weight: 600; }
    .fv-table td::before { content: none; }
    .fv-table td.fv-hide-sm { display: table-cell; }
}

/* =====================  Desktop  ===================== */
@media (min-width: 1000px) {
    .fv-header .fv-wrap { min-height: 76px; }
    .fv-header__logo img { height: 40px; }
    .fv-nav { display: flex; gap: 28px; }
    .fv-menu { display: none; }
    .fv-hero { padding: 56px 0 36px; }
    .fv-hero h1 { font-size: 56px; }
    .fv-lead { font-size: 19px; }
    .fv-section { padding-top: 64px; }
    .fv-section h2 { font-size: 34px; }
    .fv-grid { gap: 20px; }
    .fv-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .fv-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .fv-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .fv-grid--split { grid-template-columns: 5fr 7fr; align-items: start; }
    .fv-card { padding: 26px; }
    .fv-verify { flex-direction: row; align-items: center; justify-content: space-between; padding: 24px 32px; }
    .fv-verify dl { flex-grow: 1; }
    .fv-ladder li { grid-template-columns: 44px minmax(0, 1fr); gap: 22px; }
    .fv-ladder__dot { width: 44px; height: 44px; }
    .fv-ladder li:not(:last-child)::after { left: 21px; top: 48px; }
    .fv-terms > div { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; padding: 26px 0; }
    .fv-terms h2 { margin: 0; }
    .fv-footer { padding: 56px 0 44px; }
}
