.vd-homepage-concept{
      --evergreen: #12392f;
      --evergreen-deep: #0b2821;
      --evergreen-soft: #dce8df;
      --paper: #fbfbf7;
      --cream: #f1efe5;
      --cream-deep: #e7e3d5;
      --ink: #1e2b26;
      --muted: #5c6962;
      --line: #dfe4de;
      --gold: #b89a64;
      --white: #fff;
      --serif: Georgia, "Times New Roman", serif;
      --sans: Inter, "Segoe UI", Arial, sans-serif;
      --content: 1240px;
    }
.vd-homepage-concept, .vd-homepage-concept *{ box-sizing: border-box; }
.vd-homepage-concept{ scroll-behavior: smooth; }
.vd-homepage-concept{
      margin: 0;
      color: var(--ink);
      background: var(--paper);
      font-family: var(--sans);
      font-size: 16px;
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }
.vd-homepage-concept a{ color: inherit; text-decoration: none; }
.vd-homepage-concept button,
.vd-homepage-concept input{ font: inherit; }
.vd-homepage-concept button,
.vd-homepage-concept a{ -webkit-tap-highlight-color: transparent; }
.vd-homepage-concept .skip-link{ position: absolute; left: 16px; top: -60px; z-index: 99; padding: 12px 16px; background: var(--white); color: var(--evergreen); }
.vd-homepage-concept .skip-link:focus{ top: 16px; }
.vd-homepage-concept .wrap{ width: min(var(--content), calc(100% - 64px)); margin-inline: auto; }
.vd-homepage-concept .topbar{ background: var(--evergreen); color: var(--white); font-size: 13px; }
.vd-homepage-concept .topbar-inner{ min-height: 38px; display: flex; align-items: center; justify-content: center; gap: 9px; text-align: center; }
.vd-homepage-concept .topbar strong{ font-weight: 650; }
.vd-homepage-concept .topbar a{ color: #f1e8d2; text-decoration: underline; text-underline-offset: 3px; }
.vd-homepage-concept .topbar-dot{ width: 6px; height: 6px; border-radius: 50%; background: #cdb781; }
.vd-homepage-concept .site-header{ position: relative; z-index: 5; background: rgba(251,251,247,.97); border-bottom: 1px solid rgba(18,57,47,.09); }
.vd-homepage-concept .header-inner{ height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.vd-homepage-concept .brand{ display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; font-size: 20px; font-weight: 700; letter-spacing: -.7px; }
.vd-homepage-concept .brand-mark{ width: 34px; height: 34px; display: grid; place-items: center; border: 1.5px solid var(--evergreen); border-radius: 50%; color: var(--evergreen); font: 20px/1 var(--serif); }
.vd-homepage-concept .brand span:last-child{ color: var(--evergreen); }
.vd-homepage-concept .nav{ display: flex; align-items: center; gap: clamp(18px, 2.5vw, 36px); color: #36443d; font-size: 14px; font-weight: 550; }
.vd-homepage-concept .nav a:hover,
.vd-homepage-concept .nav a:focus-visible{ color: var(--evergreen); text-decoration: underline; text-underline-offset: 5px; }
.vd-homepage-concept .header-actions{ display: flex; align-items: center; gap: 14px; }
.vd-homepage-concept .phone-link{ display: inline-flex; align-items: center; gap: 8px; color: var(--evergreen); font-size: 13px; font-weight: 650; white-space: nowrap; }
.vd-homepage-concept .phone-link svg{ width: 17px; height: 17px; }
.vd-homepage-concept .header-project{ border: 1px solid var(--evergreen); border-radius: 999px; padding: 11px 17px; color: var(--evergreen); font-size: 13px; font-weight: 650; white-space: nowrap; transition: .2s ease; }
.vd-homepage-concept .header-project:hover{ background: var(--evergreen); color: var(--white); }
.vd-homepage-concept .menu-toggle{ display: none; border: 1px solid var(--line); background: transparent; border-radius: 50%; width: 42px; height: 42px; color: var(--evergreen); cursor: pointer; }
.vd-homepage-concept .hero{ overflow: hidden; background: linear-gradient(90deg, var(--paper) 0%, var(--paper) 56%, var(--cream) 56%, var(--cream) 100%); }
.vd-homepage-concept .hero-inner{ min-height: 620px; display: grid; grid-template-columns: 1fr 1.02fr; align-items: center; gap: 48px; padding-top: 56px; padding-bottom: 62px; }
.vd-homepage-concept .eyebrow{ margin: 0 0 20px; color: #65736b; font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.vd-homepage-concept h1,
.vd-homepage-concept h2,
.vd-homepage-concept h3,
.vd-homepage-concept p{ margin-top: 0; }
.vd-homepage-concept h1{ max-width: 590px; margin-bottom: 22px; color: var(--evergreen-deep); font: 400 clamp(48px, 5.05vw, 72px)/1.03 var(--serif); letter-spacing: -2.6px; }
.vd-homepage-concept .hero-copy{ max-width: 555px; margin-bottom: 26px; color: #435149; font-size: 17px; line-height: 1.72; }
.vd-homepage-concept .hero-actions{ display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.vd-homepage-concept .button{ min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 11px; border: 1px solid transparent; border-radius: 999px; padding: 13px 21px; font-size: 14px; font-weight: 650; transition: transform .2s ease, background .2s ease, color .2s ease; cursor: pointer; }
.vd-homepage-concept .button:hover{ transform: translateY(-2px); }
.vd-homepage-concept .button-primary{ background: var(--evergreen); color: var(--white); }
.vd-homepage-concept .button-primary:hover{ background: var(--evergreen-deep); }
.vd-homepage-concept .button-quiet{ border-color: #bdc9c0; background: transparent; color: var(--evergreen); }
.vd-homepage-concept .button-quiet:hover{ background: var(--evergreen-soft); }
.vd-homepage-concept .button svg{ width: 16px; height: 16px; }
.vd-homepage-concept .hero-note{ display: flex; align-items: flex-start; gap: 10px; max-width: 490px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.vd-homepage-concept .hero-note svg{ width: 17px; height: 17px; color: var(--gold); flex: 0 0 auto; margin-top: 1px; }
.vd-homepage-concept .hero-note a{ color: var(--evergreen); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.vd-homepage-concept .video-stage{ position: relative; min-height: 430px; display: grid; place-items: center; padding: 28px 18px 54px; }
.vd-homepage-concept .stage-label{ position: absolute; top: 11px; left: 24px; color: #7a8074; font-size: 10px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.vd-homepage-concept .laptop{ position: relative; width: min(100%, 590px); filter: drop-shadow(0 26px 30px rgba(20,39,31,.16)); }
.vd-homepage-concept .laptop-screen{ overflow: hidden; position: relative; aspect-ratio: 1.55; border: 10px solid #16211d; border-bottom-width: 16px; border-radius: 17px 17px 8px 8px; background: var(--paper); }
.vd-homepage-concept .screen-bar{ height: 28px; display: flex; align-items: center; gap: 6px; padding: 0 12px; background: #f5f6f1; border-bottom: 1px solid #e3e5dd; color: #778179; font-size: 9px; }
.vd-homepage-concept .screen-dot{ width: 6px; height: 6px; background: #c6c9c1; border-radius: 50%; }
.vd-homepage-concept .screen-url{ margin-left: auto; font-size: 8px; letter-spacing: .02em; }
.vd-homepage-concept .screen-content{ height: calc(100% - 28px); display: grid; grid-template-columns: 1fr .82fr; gap: 14px; align-items: center; padding: 22px 25px; background: linear-gradient(125deg, #fafaf6 0 60%, #e9eee6 60% 100%); }
.vd-homepage-concept .screen-copy small{ display: block; margin-bottom: 9px; color: #718078; font-size: 7px; font-weight: 700; letter-spacing: .15em; }
.vd-homepage-concept .screen-copy strong{ display: block; max-width: 230px; color: var(--evergreen); font: 22px/1.08 var(--serif); font-weight: 400; }
.vd-homepage-concept .screen-copy span{ display: block; max-width: 225px; margin-top: 10px; color: #647069; font-size: 8px; line-height: 1.5; }
.vd-homepage-concept .screen-lines{ margin-top: 14px; display: flex; gap: 6px; }
.vd-homepage-concept .screen-lines i{ display: block; height: 5px; width: 48px; border-radius: 5px; background: #dbe4dc; }
.vd-homepage-concept .screen-lines i:first-child{ width: 65px; background: var(--evergreen); }
.vd-homepage-concept .screen-art{ position: relative; height: 78%; border-radius: 48% 48% 13px 13px; background: #c7d9cd; overflow: hidden; }
.vd-homepage-concept .screen-art:before{ content: ""; position: absolute; width: 120px; height: 120px; right: -22px; top: -20px; border-radius: 50%; background: #e9d9b8; }
.vd-homepage-concept .screen-art:after{ content: ""; position: absolute; width: 120px; height: 170px; left: 7px; bottom: -76px; border-radius: 55% 55% 0 0; background: #6d8879; transform: rotate(-17deg); }
.vd-homepage-concept .screen-art span{ position: absolute; z-index: 1; left: 18px; right: 18px; bottom: 20px; height: 42px; border-radius: 4px; background: rgba(251,251,247,.89); box-shadow: 0 7px 14px rgba(30,43,38,.08); }
.vd-homepage-concept .play-button{ position: absolute; z-index: 2; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.85); border-radius: 50%; background: rgba(18,57,47,.94); color: white; box-shadow: 0 8px 22px rgba(18,57,47,.22); cursor: pointer; }
.vd-homepage-concept .play-button:hover{ transform: translate(-50%,-50%) scale(1.06); }
.vd-homepage-concept .play-button svg{ width: 19px; height: 19px; margin-left: 3px; }
.vd-homepage-concept .laptop-base{ width: 112%; height: 17px; margin-left: -6%; border-radius: 0 0 22px 22px; background: linear-gradient(#a9b0ab,#d8dcd8 44%,#7a837d 100%); }
.vd-homepage-concept .laptop-base:after{ content: ""; display: block; width: 22%; height: 4px; margin: auto; border-radius: 0 0 6px 6px; background: #89918c; }
.vd-homepage-concept .video-caption{ position: absolute; bottom: 17px; left: 26px; right: 26px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #56645b; font-size: 12px; }
.vd-homepage-concept .video-caption strong{ color: var(--evergreen); font-weight: 650; }
.vd-homepage-concept .caption-time{ flex-shrink: 0; color: #78847a; font-variant-numeric: tabular-nums; }
.vd-homepage-concept .proof-strip{ background: var(--evergreen); color: var(--white); }
.vd-homepage-concept .proof-inner{ display: grid; grid-template-columns: repeat(3,1fr); min-height: 102px; align-items: center; }
.vd-homepage-concept .proof-item{ min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 12px; border-right: 1px solid rgba(255,255,255,.17); font-size: 14px; }
.vd-homepage-concept .proof-item:last-child{ border: 0; }
.vd-homepage-concept .proof-number{ display: inline-grid; place-items: center; width: 27px; height: 27px; border: 1px solid rgba(230,238,231,.4); border-radius: 50%; color: #e5d6b2; font: 14px var(--serif); }
.vd-homepage-concept .section{ padding: 112px 0; }
.vd-homepage-concept .section-heading{ max-width: 720px; margin-bottom: 42px; }
.vd-homepage-concept .section-heading .eyebrow{ margin-bottom: 14px; }
.vd-homepage-concept h2{ margin-bottom: 14px; color: var(--evergreen-deep); font: 400 clamp(38px, 4vw, 54px)/1.08 var(--serif); letter-spacing: -1.6px; }
.vd-homepage-concept .section-heading > p:last-child{ max-width: 610px; margin-bottom: 0; color: var(--muted); font-size: 16px; }
.vd-homepage-concept .routes{ background: var(--paper); }
.vd-homepage-concept .route-grid{ display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.vd-homepage-concept .route-card{ min-height: 276px; display: flex; flex-direction: column; padding: 29px 30px 27px; border-right: 1px solid var(--line); transition: background .2s ease; }
.vd-homepage-concept .route-card:first-child{ padding-left: 0; }
.vd-homepage-concept .route-card:last-child{ border-right: 0; padding-right: 0; }
.vd-homepage-concept .route-card:hover{ background: #f4f5ef; }
.vd-homepage-concept .route-index{ margin-bottom: 28px; color: #879389; font: 14px var(--serif); }
.vd-homepage-concept .route-card h3{ margin-bottom: 10px; color: var(--evergreen); font-size: 21px; font-weight: 650; letter-spacing: -.4px; }
.vd-homepage-concept .route-card p{ margin-bottom: 20px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.vd-homepage-concept .text-link{ display: inline-flex; align-items: center; gap: 8px; margin-top: auto; color: var(--evergreen); font-size: 13px; font-weight: 700; }
.vd-homepage-concept .text-link span{ transition: transform .2s ease; }
.vd-homepage-concept .text-link:hover span{ transform: translateX(4px); }
.vd-homepage-concept .projects{ background: var(--cream); }
.vd-homepage-concept .project-grid{ display: grid; grid-template-columns: 1.16fr .84fr; gap: 22px; }
.vd-homepage-concept .project-card{ overflow: hidden; border: 1px solid rgba(18,57,47,.12); border-radius: 10px; background: var(--paper); }
.vd-homepage-concept .project-visual{ min-height: 290px; display: grid; place-items: center; padding: 30px; background: #e3e8dc; }
.vd-homepage-concept .project-visual.secondary{ min-height: 290px; background: #e8e3d6; }
.vd-homepage-concept .site-sheet{ width: min(100%,500px); overflow: hidden; border: 1px solid rgba(18,57,47,.15); border-radius: 7px; background: var(--white); box-shadow: 0 18px 35px rgba(23,47,36,.13); }
.vd-homepage-concept .sheet-top{ height: 22px; display: flex; align-items: center; gap: 5px; padding: 0 9px; border-bottom: 1px solid #e6e8e1; color: #738078; font-size: 7px; }
.vd-homepage-concept .sheet-top i{ width: 5px; height: 5px; border-radius: 50%; background: #c4c9c3; }
.vd-homepage-concept .sheet-top span{ margin-left: auto; }
.vd-homepage-concept .sheet-body{ padding: 18px 22px 21px; }
.vd-homepage-concept .sheet-body small{ color: #738078; font-size: 7px; letter-spacing: .14em; }
.vd-homepage-concept .sheet-body h4{ max-width: 285px; margin: 7px 0 8px; color: var(--evergreen); font: 25px/1.08 var(--serif); font-weight: 400; }
.vd-homepage-concept .sheet-body p{ max-width: 300px; margin: 0; color: #68746d; font-size: 8px; }
.vd-homepage-concept .sheet-blocks{ display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 7px; margin-top: 16px; }
.vd-homepage-concept .sheet-blocks i{ height: 39px; border-radius: 4px; background: #e2e9e3; }
.vd-homepage-concept .sheet-blocks i:first-child{ background: #244a3e; }
.vd-homepage-concept .project-body{ padding: 25px 28px 28px; }
.vd-homepage-concept .project-kicker{ margin-bottom: 9px; color: #7b887e; font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.vd-homepage-concept .project-body h3{ margin-bottom: 9px; color: var(--evergreen); font: 29px/1.1 var(--serif); font-weight: 400; }
.vd-homepage-concept .project-body p{ margin-bottom: 17px; color: var(--muted); font-size: 14px; }
.vd-homepage-concept .project-tags{ display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 18px; }
.vd-homepage-concept .tag{ padding: 5px 9px; border: 1px solid #d7dfd6; border-radius: 999px; color: #53645a; font-size: 10px; }
.vd-homepage-concept .project-card.compact .project-visual{ min-height: 290px; }
.vd-homepage-concept .abstract-layout{ width: min(100%,390px); display: grid; grid-template-columns: .7fr 1.3fr; gap: 9px; transform: rotate(-2deg); }
.vd-homepage-concept .abstract-layout div{ min-height: 135px; border-radius: 5px; background: rgba(255,255,255,.8); }
.vd-homepage-concept .abstract-layout div:first-child{ background: #23463a; }
.vd-homepage-concept .abstract-layout div:last-child{ background: linear-gradient(145deg,#fff 0 50%,#d8dfd3 50% 100%); }
.vd-homepage-concept .process{ background: var(--paper); }
.vd-homepage-concept .process-grid{ display: grid; grid-template-columns: repeat(4,1fr); gap: 22px; }
.vd-homepage-concept .process-step{ padding-top: 18px; border-top: 1px solid var(--evergreen); }
.vd-homepage-concept .step-num{ display: block; margin-bottom: 29px; color: var(--gold); font: 18px var(--serif); }
.vd-homepage-concept .process-step h3{ margin-bottom: 8px; color: var(--evergreen); font-size: 18px; font-weight: 650; }
.vd-homepage-concept .process-step p{ margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.72; }
.vd-homepage-concept .tools-showcase{
  position: relative;
  overflow: hidden;
  padding: 100px 0 92px;
  background:
    radial-gradient(ellipse at 5% 5%, rgba(222,207,159,.24), transparent 32%),
    radial-gradient(ellipse at 96% 30%, rgba(183,218,196,.35), transparent 30%),
    linear-gradient(125deg,#f8f7f0 0%,#f0f3eb 52%,#e9f1e9 100%);
}
.vd-homepage-concept .tools-showcase:before{
  position:absolute;top:0;left:max(32px,calc((100% - var(--content))/2));right:max(32px,calc((100% - var(--content))/2));height:1px;
  background:rgba(21,65,52,.13);content:"";
}
.vd-homepage-concept .tools-showcase .section-heading{max-width:780px;margin-bottom:38px}
.vd-homepage-concept .tools-showcase .section-heading .eyebrow{margin-bottom:14px}
.vd-homepage-concept .tools-showcase .section-heading h2{max-width:740px;margin-bottom:14px}
.vd-homepage-concept .tools-showcase .section-heading>p:last-child{max-width:650px;margin-bottom:0;color:#64766d;font-size:15px;line-height:1.75}
.vd-homepage-concept .tools-grid{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(270px,.78fr);align-items:stretch;gap:20px}
.vd-homepage-concept .tool-checker{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,.86fr);align-items:center;gap:clamp(24px,3.5vw,48px);min-height:430px;overflow:hidden;
  padding:clamp(28px,3.7vw,48px);border:1px solid rgba(255,255,255,.2);border-radius:20px;
  background:radial-gradient(ellipse at 95% 4%,rgba(129,176,145,.32),transparent 42%),linear-gradient(128deg,#0b382e 0%,#0b4034 55%,#155044 100%);
  box-shadow:0 22px 50px rgba(10,54,43,.16);color:#fffefa
}
.vd-homepage-concept .tool-checker:after{
  position:absolute;right:-105px;bottom:-170px;width:330px;height:330px;border:1px solid rgba(217,203,155,.17);border-radius:50%;
  box-shadow:0 0 0 34px rgba(217,203,155,.035),0 0 0 70px rgba(217,203,155,.025);content:"";pointer-events:none
}
.vd-homepage-concept .tool-checker-copy{position:relative;z-index:1;max-width:500px}
.vd-homepage-concept .tool-status{display:inline-flex;align-items:center;gap:8px;margin:0 0 19px;color:#d9e9de;font-size:10px;font-weight:760;letter-spacing:.15em;text-transform:uppercase}
.vd-homepage-concept .tool-status>span{width:7px;height:7px;border-radius:50%;background:#b8d8bd;box-shadow:0 0 0 4px rgba(184,216,189,.12)}
.vd-homepage-concept .tool-checker h3{margin:0;color:#fffefa;font:400 clamp(33px,3.1vw,44px)/1.08 var(--serif);letter-spacing:-1.5px}
.vd-homepage-concept .tool-checker-copy>p:not(.tool-status){max-width:490px;margin:16px 0 0;color:rgba(245,249,243,.8);font-size:14px;line-height:1.72}
.vd-homepage-concept .tool-checker-button{display:inline-flex;min-height:52px;align-items:center;justify-content:center;gap:17px;margin-top:24px;padding:0 21px;border:1px solid #e2ca8c;border-radius:999px;background:linear-gradient(110deg,#ead9a9,#d9c183);color:#173b30;font-size:13px;font-weight:750;transition:transform .18s ease,box-shadow .18s ease}
.vd-homepage-concept .tool-checker-button:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.16)}
.vd-homepage-concept .tool-checker-button:focus-visible,.vd-homepage-concept .tool-social:focus-visible{outline:3px solid #fff;outline-offset:4px}
.vd-homepage-concept .tool-checker-button .vd-arrow-icon{border-color:#173b30}
.vd-homepage-concept .tool-trust{display:flex;flex-wrap:wrap;gap:8px 16px;margin:16px 0 0;padding:0;list-style:none;color:rgba(239,247,240,.77);font-size:10px}
.vd-homepage-concept .tool-trust li{display:inline-flex;align-items:center;gap:7px}
.vd-homepage-concept .tool-trust li:before{color:#c4d9c4;content:"✓"}
.vd-homepage-concept .tool-report-frame{position:relative;z-index:1;transform:rotate(1deg);padding:9px;border:1px solid rgba(245,248,239,.22);border-radius:17px;background:rgba(218,237,224,.12);box-shadow:0 18px 42px rgba(0,0,0,.18)}
.vd-homepage-concept .tool-report{overflow:hidden;border:1px solid rgba(15,57,44,.08);border-radius:12px;background:#fffefa;color:var(--ink)}
.vd-homepage-concept .tool-report-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 14px;border-bottom:1px solid #edf0e9}
.vd-homepage-concept .tool-report-brand{display:flex;align-items:center;gap:8px;color:#526a5e;font-size:9px;font-weight:750;letter-spacing:.07em;text-transform:uppercase}
.vd-homepage-concept .tool-v-mark{display:grid;width:22px;height:22px;place-items:center;border-radius:7px;background:#e5efe4;color:var(--evergreen);font-weight:800}
.vd-homepage-concept .tool-report-caption{color:#9aa69e;font-size:8px}
.vd-homepage-concept .tool-report-content{padding:15px}
.vd-homepage-concept .tool-report-kicker{margin:0;color:#7d8b81;font-size:8px;font-weight:750;letter-spacing:.1em;text-transform:uppercase}
.vd-homepage-concept .tool-report-title{margin:6px 0 13px;color:var(--evergreen);font:20px/1.12 var(--serif)}
.vd-homepage-concept .tool-signal{display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:8px;min-height:42px;border-top:1px solid #edf0e9}
.vd-homepage-concept .tool-signal-icon{display:grid;width:23px;height:23px;place-items:center;border-radius:7px;background:#e8f2e6;color:#365e4d;font-size:11px}
.vd-homepage-concept .tool-signal:nth-of-type(3) .tool-signal-icon{background:#edf0fa;color:#53648c}
.vd-homepage-concept .tool-signal:nth-of-type(4) .tool-signal-icon{background:#fbf0d9;color:#92753d}
.vd-homepage-concept .tool-signal:nth-of-type(5) .tool-signal-icon{background:#e4f1ef;color:#39756b}
.vd-homepage-concept .tool-signal-name{color:#324d40;font-size:9px;font-weight:650}
.vd-homepage-concept .tool-signal-state{color:#819087;font-size:8px}
.vd-homepage-concept .tool-report-bottom{padding:10px 14px;background:#f7f8f3;color:#78877e;font-size:8px;line-height:1.5}
.vd-homepage-concept .tool-social{
  position:relative;display:flex;min-height:430px;flex-direction:column;overflow:hidden;padding:27px;border:1px solid rgba(25,62,50,.09);border-radius:20px;
  background:radial-gradient(ellipse at 102% 0%,rgba(213,220,245,.7),transparent 46%),linear-gradient(150deg,#fffefa 10%,#f7f5ed 100%);box-shadow:0 18px 42px rgba(26,56,46,.07)
}
.vd-homepage-concept .tool-social-status{display:inline-flex;width:fit-content;align-items:center;gap:7px;padding:8px 10px;border:1px solid #eadcb7;border-radius:999px;background:#fbf6e8;color:#8b7442;font-size:9px;font-weight:760;letter-spacing:.1em;text-transform:uppercase}
.vd-homepage-concept .tool-social-status>span{width:6px;height:6px;border-radius:50%;background:#c5a555}
.vd-homepage-concept .tool-social h3{margin:19px 0 0;color:var(--evergreen);font:400 30px/1.1 var(--serif);letter-spacing:-1px}
.vd-homepage-concept .tool-social>p{margin:11px 0 0;color:#697a71;font-size:13px;line-height:1.7}
.vd-homepage-concept .tool-social-preview{position:relative;display:flex;min-height:126px;align-items:center;justify-content:center;margin:auto -7px 0;overflow:hidden;border:1px solid rgba(85,100,139,.1);border-radius:14px;background:linear-gradient(130deg,#e7eee4,#eaebf5 54%,#f4e4d7)}
.vd-homepage-concept .tool-social-preview:before,.vd-homepage-concept .tool-social-preview:after{position:absolute;border-radius:50%;content:""}
.vd-homepage-concept .tool-social-preview:before{top:-70px;left:-22px;width:135px;height:135px;background:rgba(187,209,178,.74)}
.vd-homepage-concept .tool-social-preview:after{right:-37px;bottom:-80px;width:128px;height:128px;background:rgba(221,190,163,.54)}
.vd-homepage-concept .tool-post-sheet{position:relative;z-index:1;width:min(80%,230px);padding:12px 14px;border:1px solid rgba(36,68,56,.1);border-radius:10px;background:rgba(255,255,250,.91);box-shadow:0 9px 22px rgba(29,48,42,.1)}
.vd-homepage-concept .tool-post-topline{display:flex;align-items:center;gap:6px;margin-bottom:8px;color:#728077;font-size:8px;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.vd-homepage-concept .tool-post-topline span{width:7px;height:7px;border-radius:50%;background:#b8a064}
.vd-homepage-concept .tool-post-sheet>i{display:block;width:100%;height:5px;margin-top:5px;border-radius:5px;background:#dfe6dd}
.vd-homepage-concept .tool-post-sheet>i:nth-of-type(2){width:78%}
.vd-homepage-concept .tool-post-sheet>i:nth-of-type(3){width:56%;background:#e8ddbf}
.vd-homepage-concept .tool-social-note{align-self:flex-start;margin-top:16px;color:#718077;font-size:11px}
.vd-homepage-concept .contact-cta{ padding: 96px 0; background: var(--cream); text-align: center; }
.vd-homepage-concept .contact-cta .eyebrow{ margin-bottom: 15px; }
.vd-homepage-concept .contact-cta h2{ max-width: 730px; margin: 0 auto 15px; }
.vd-homepage-concept .contact-cta p{ max-width: 600px; margin: 0 auto 24px; color: var(--muted); }
.vd-homepage-concept .contact-links{ display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 18px; margin-top: 18px; color: #56645b; font-size: 13px; }
.vd-homepage-concept .contact-links a{ color: var(--evergreen); font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }
.vd-homepage-concept .footer{ padding: 27px 0; background: var(--evergreen-deep); color: #dce5dd; }
.vd-homepage-concept .footer-inner{ display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 12px; }
.vd-homepage-concept .footer-brand{ color: #fff; font-weight: 700; }
.vd-homepage-concept .footer-links{ display: flex; gap: 18px; }
.vd-homepage-concept .footer-links a:hover{ text-decoration: underline; }
.vd-homepage-concept .mobile-sticky{ display: none; }
@media (max-width: 980px){
.vd-homepage-concept .nav{ gap: 15px; font-size: 13px; }
.vd-homepage-concept .phone-link{ display: none; }
.vd-homepage-concept .hero-inner{ gap: 26px; }
.vd-homepage-concept .video-stage{ padding-inline: 0; }
.vd-homepage-concept .tool-checker{ gap: 30px; }
}
@media (max-width: 760px){
.vd-homepage-concept .wrap{ width: min(100% - 40px, 560px); }
.vd-homepage-concept .topbar-inner{ min-height: 42px; padding: 7px 10px; font-size: 11px; line-height: 1.35; }
.vd-homepage-concept .header-inner{ height: 68px; gap: 10px; }
.vd-homepage-concept .brand{ font-size: 18px; }
.vd-homepage-concept .brand-mark{ width: 31px; height: 31px; }
.vd-homepage-concept .nav{ display: none; position: absolute; top: 68px; left: 0; right: 0; padding: 16px 20px 21px; flex-direction: column; align-items: stretch; gap: 0; background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 16px 20px rgba(23,40,31,.07); }
.vd-homepage-concept .nav.is-open{ display: flex; }
.vd-homepage-concept .nav a{ padding: 12px 0; border-bottom: 1px solid var(--line); }
.vd-homepage-concept .nav a:last-child{ border-bottom: 0; }
.vd-homepage-concept .header-actions{ margin-left: auto; gap: 8px; }
.vd-homepage-concept .header-project{ display: none; }
.vd-homepage-concept .phone-link{ display: inline-flex; width: 40px; height: 40px; justify-content: center; border: 1px solid var(--line); border-radius: 50%; font-size: 0; }
.vd-homepage-concept .phone-link svg{ width: 18px; height: 18px; }
.vd-homepage-concept .menu-toggle{ display: grid; place-items: center; }
.vd-homepage-concept .menu-toggle svg{ width: 19px; height: 19px; }
.vd-homepage-concept .hero{ background: var(--paper); }
.vd-homepage-concept .hero-inner{ min-height: 0; display: flex; flex-direction: column; align-items: stretch; gap: 27px; padding-top: 41px; padding-bottom: 41px; }
.vd-homepage-concept .hero-copy-wrap{ width: 100%; }
.vd-homepage-concept .eyebrow{ margin-bottom: 15px; font-size: 10px; }
.vd-homepage-concept h1{ max-width: 520px; margin-bottom: 16px; font-size: clamp(43px, 11vw, 58px); letter-spacing: -1.9px; line-height: 1.01; }
.vd-homepage-concept .hero-copy{ margin-bottom: 18px; font-size: 15px; line-height: 1.65; }
.vd-homepage-concept .hero-actions{ align-items: stretch; flex-direction: column; gap: 9px; margin-bottom: 14px; }
.vd-homepage-concept .hero-actions .button{ width: 100%; }
.vd-homepage-concept .hero-note{ font-size: 12px; }
.vd-homepage-concept .video-stage{ width: 100%; min-height: 0; aspect-ratio: 1.34; padding: 35px 12px 54px; border-radius: 7px; background: var(--cream); }
.vd-homepage-concept .stage-label{ top: 12px; left: 16px; font-size: 8px; }
.vd-homepage-concept .laptop{ width: 100%; }
.vd-homepage-concept .laptop-screen{ border-width: 6px; border-bottom-width: 10px; border-radius: 10px 10px 5px 5px; }
.vd-homepage-concept .screen-bar{ height: 18px; padding-inline: 7px; gap: 4px; font-size: 7px; }
.vd-homepage-concept .screen-dot{ width: 4px; height: 4px; }
.vd-homepage-concept .screen-content{ height: calc(100% - 18px); gap: 7px; padding: 11px; }
.vd-homepage-concept .screen-copy small{ margin-bottom: 5px; font-size: 5px; }
.vd-homepage-concept .screen-copy strong{ max-width: 160px; font-size: clamp(14px,4.5vw,19px); }
.vd-homepage-concept .screen-copy span{ margin-top: 5px; font-size: 6px; }
.vd-homepage-concept .screen-lines{ margin-top: 8px; gap: 4px; }
.vd-homepage-concept .screen-lines i{ width: 28px; height: 3px; }
.vd-homepage-concept .screen-lines i:first-child{ width: 39px; }
.vd-homepage-concept .screen-art{ border-radius: 45% 45% 7px 7px; }
.vd-homepage-concept .screen-art:before{ width: 75px; height: 75px; }
.vd-homepage-concept .screen-art:after{ width: 70px; height: 110px; bottom: -50px; }
.vd-homepage-concept .screen-art span{ height: 25px; left: 9px; right: 9px; bottom: 9px; }
.vd-homepage-concept .laptop-base{ height: 9px; }
.vd-homepage-concept .laptop-base:after{ height: 2px; }
.vd-homepage-concept .play-button{ width: 43px; height: 43px; }
.vd-homepage-concept .play-button svg{ width: 14px; height: 14px; }
.vd-homepage-concept .video-caption{ bottom: 12px; left: 15px; right: 15px; font-size: 10px; }
.vd-homepage-concept .proof-inner{ grid-template-columns: 1fr; padding: 7px 0; }
.vd-homepage-concept .proof-item{ min-height: 43px; justify-content: flex-start; padding-left: 4px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); font-size: 12px; }
.vd-homepage-concept .proof-item:last-child{ border-bottom: 0; }
.vd-homepage-concept .proof-number{ width: 23px; height: 23px; font-size: 12px; }
.vd-homepage-concept .section{ padding: 72px 0; }
.vd-homepage-concept .section-heading{ margin-bottom: 28px; }
.vd-homepage-concept .section-heading .eyebrow{ margin-bottom: 12px; }
.vd-homepage-concept h2{ margin-bottom: 11px; font-size: 40px; letter-spacing: -1.2px; }
.vd-homepage-concept .section-heading > p:last-child{ font-size: 14px; }
.vd-homepage-concept .route-grid{ grid-template-columns: 1fr; border-bottom: 0; }
.vd-homepage-concept .route-card,
.vd-homepage-concept .route-card:first-child,
.vd-homepage-concept .route-card:last-child{ min-height: 0; padding: 21px 0 23px; border-right: 0; border-bottom: 1px solid var(--line); }
.vd-homepage-concept .route-card:hover{ background: transparent; }
.vd-homepage-concept .route-index{ margin-bottom: 13px; }
.vd-homepage-concept .route-card h3{ margin-bottom: 7px; font-size: 19px; }
.vd-homepage-concept .route-card p{ margin-bottom: 13px; font-size: 13px; }
.vd-homepage-concept .projects{ padding-bottom: 70px; }
.vd-homepage-concept .project-grid{ grid-template-columns: 1fr; gap: 15px; }
.vd-homepage-concept .project-visual,
.vd-homepage-concept .project-visual.secondary{ min-height: 205px; padding: 20px; }
.vd-homepage-concept .sheet-body{ padding: 14px 16px 16px; }
.vd-homepage-concept .sheet-body h4{ font-size: 21px; }
.vd-homepage-concept .project-body{ padding: 19px 19px 22px; }
.vd-homepage-concept .project-body h3{ font-size: 26px; }
.vd-homepage-concept .project-body p{ font-size: 13px; }
.vd-homepage-concept .abstract-layout div{ min-height: 100px; }
.vd-homepage-concept .process-grid{ grid-template-columns: 1fr 1fr; gap: 24px 17px; }
.vd-homepage-concept .process-step{ padding-top: 12px; }
.vd-homepage-concept .step-num{ margin-bottom: 14px; font-size: 15px; }
.vd-homepage-concept .process-step h3{ margin-bottom: 6px; font-size: 16px; }
.vd-homepage-concept .process-step p{ font-size: 12px; }
.vd-homepage-concept .tools-showcase{ padding: 68px 0 58px; }
.vd-homepage-concept .tools-showcase .section-heading{ margin-bottom: 26px; }
.vd-homepage-concept .tools-grid{ grid-template-columns: 1fr; gap: 13px; }
.vd-homepage-concept .tool-checker{ grid-template-columns: minmax(0,1fr) minmax(220px,.8fr); min-height: 0; gap: 25px; padding: 27px; }
.vd-homepage-concept .tool-checker h3{ font-size: 37px; }
.vd-homepage-concept .tool-checker-copy>p:not(.tool-status){ font-size: 13px; }
.vd-homepage-concept .tool-social{ min-height: 300px; }
.vd-homepage-concept .tool-social-preview{ min-height: 105px; margin-top: 22px; }
.vd-homepage-concept .contact-cta{ padding: 75px 0; }
.vd-homepage-concept .contact-cta p{ font-size: 14px; }
.vd-homepage-concept .contact-links{ align-items: flex-start; flex-direction: column; gap: 8px; font-size: 12px; }
.vd-homepage-concept .footer{ padding: 22px 0 88px; }
.vd-homepage-concept .footer-inner{ align-items: flex-start; flex-direction: column; gap: 13px; }
.vd-homepage-concept .footer-links{ flex-wrap: wrap; gap: 14px; }
.vd-homepage-concept .mobile-sticky{ position: fixed; z-index: 8; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: .78fr 1.22fr; gap: 8px; padding: 10px 14px max(10px, env(safe-area-inset-bottom)); border-top: 1px solid rgba(18,57,47,.13); background: rgba(251,251,247,.96); backdrop-filter: blur(12px); }
.vd-homepage-concept .mobile-sticky .button{ min-height: 44px; padding: 10px; font-size: 12px; }
}
@media (max-width: 560px){
.vd-homepage-concept .tools-showcase{ padding: 60px 0 48px; background:radial-gradient(ellipse at 2% 0%,rgba(222,207,159,.2),transparent 37%),linear-gradient(145deg,#f8f7f0 0%,#edf2ec 100%); }
.vd-homepage-concept .tools-showcase:before{ left:20px; right:20px; }
.vd-homepage-concept .tools-showcase .section-heading{ margin-bottom:22px; }
.vd-homepage-concept .tools-showcase .section-heading>p:last-child{ font-size:14px; line-height:1.65; }
.vd-homepage-concept .tool-checker{ grid-template-columns:1fr; gap:25px; padding:24px 20px 21px; border-radius:17px; }
.vd-homepage-concept .tool-checker h3{ font-size:35px; }
.vd-homepage-concept .tool-checker-copy>p:not(.tool-status){ font-size:14px; line-height:1.68; }
.vd-homepage-concept .tool-checker-button{ width:100%; min-height:53px; margin-top:21px; }
.vd-homepage-concept .tool-trust{ gap:8px 12px; font-size:10px; }
.vd-homepage-concept .tool-report-frame{ width:calc(100% - 8px); justify-self:center; transform:rotate(.5deg); padding:7px; }
.vd-homepage-concept .tool-report-content{ padding:13px; }
.vd-homepage-concept .tool-signal{ grid-template-columns:25px 1fr auto; min-height:40px; }
.vd-homepage-concept .tool-social{ min-height:0; padding:22px; border-radius:17px; }
.vd-homepage-concept .tool-social h3{ margin-top:16px; font-size:28px; }
.vd-homepage-concept .tool-social>p{ font-size:13px; }
.vd-homepage-concept .tool-social-preview{ min-height:110px; margin-top:21px; }
}
@media (prefers-reduced-motion: reduce){
.vd-homepage-concept{ scroll-behavior: auto; }
.vd-homepage-concept, .vd-homepage-concept *,
.vd-homepage-concept *::before,
.vd-homepage-concept *::after{ transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Real video plays inside the laptop when assets/videos/vanilladev-intro.mp4 exists. */
.vd-homepage-concept .vd-home-video{position:absolute;z-index:3;inset:28px 0 0;width:100%;height:calc(100% - 28px);object-fit:cover;background:#0b2821}
.vd-homepage-concept .checker-start{margin:8px 0 2px}
.vd-homepage-concept .checker-form .checker-form-note{margin:0 0 14px;color:#e3ece4;font-size:14px}

/* Homepage shell overrides applied after the parent's older hero art direction. */
body.static-home .vd-shell-header{position:sticky!important;top:0!important;z-index:1000!important;display:block!important;height:auto!important;min-height:0!important;padding:0!important;border:0!important;background:rgba(251,251,247,.97)!important;box-shadow:0 8px 24px rgba(20,39,31,.08)!important;backdrop-filter:blur(12px)!important}
body.admin-bar.static-home .vd-shell-header{top:32px!important}@media(max-width:782px){body.admin-bar.static-home .vd-shell-header{top:46px!important}}
body.static-home .vd-shell-header:before{display:none!important}
body.static-home .vd-shell-header>*{position:relative;inset:auto;z-index:1}
body.static-home .vd-shell-footer{margin-top:0;background:#0b2821;color:#dce5dd}
body.static-home .vd-homepage-concept{position:relative;z-index:1}
body.static-home .vd-homepage-concept .hero{min-height:0!important;padding-top:0!important}
body.static-home{background:#fbfbf7!important;color:#1e2b26!important}
body.static-home:before,body.static-home:after{display:none!important}