﻿/* Homepage styles */
body.page-home{--ink: #153c31;
  --ink-2: #234b40;
  --gold: #d99a08;
  --gold-dark: #b97800;
  --cream: #f8f2e8;
  --cream-2: #fffaf3;
  --paper: #ffffff;
  --muted: #64746f;
  --border: #e9e3d9;
  --shadow: 0 18px 45px rgba(32, 46, 39, .09);
  --radius: 22px;}

body.page-home{box-sizing:border-box}

html:has(body.page-home){scroll-behavior: smooth;}

body.page-home{margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "DM Sans", sans-serif;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;}

body.page-home h1,
body.page-home h2,
body.page-home h3,
body.page-home .brand strong{font-family: "Manrope", sans-serif; letter-spacing: -.035em;}

body.page-home h1,
body.page-home h2,
body.page-home h3,
body.page-home p{margin-top: 0;}

body.page-home h2{font-size: clamp(2rem, 4vw, 3.35rem); line-height: 1.08; margin-bottom: 18px;}

body.page-home h3{line-height: 1.25;}

body.page-home .eyebrow{margin-bottom: 12px; color: var(--gold-dark); font-size: .75rem; letter-spacing: .14em; text-transform: uppercase;}

body.page-home .section{padding: 110px 0;}

body.page-home .section-heading{max-width: 760px; margin-bottom: 48px;}

body.page-home .section-heading.centered{text-align: center; margin-inline: auto;}

body.page-home .site-header{height: 76px;
  background: #fff;
  /*border-top: 4px solid #333;*/
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 100;}

body.page-home .nav-wrap{height: 72px; display: flex; align-items: center; gap: 34px;}

body.page-home .brand{display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto;}

body.page-home .brand-mark{width: 43px; height: 43px; color: #b97800; display: grid; place-items: center;}

body.page-home .brand span:last-child{display: flex; flex-direction: column; line-height: 1;}

body.page-home .brand strong{font-size: 1.25rem; color: var(--ink);}

body.page-home .brand small{margin-top: 5px; font-size: .68rem; font-weight: 600; letter-spacing: .15em;}

body.page-home .primary-nav{display: flex; align-items: center; justify-content: center; gap: 28px; margin-left: auto;}

.primary-nav > a,
body.page-home .nav-item > button{padding: 24px 0;}

body.page-home .nav-item > button{border: 0; background: transparent; color: inherit; cursor: pointer; font-weight: 600;}

body.page-home .button{display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 24px;
  border: 1px solid #b97800;
  border-radius: 10px;
  background: #b97800;
  color: white;
  box-shadow: 0 9px 24px rgba(211, 148, 0, .2);
  transition: transform .2s ease, box-shadow .2s ease;}

body.page-home .button:hover{transform: translateY(-2px); box-shadow: 0 14px 28px rgba(211, 148, 0, .28);}


body.page-home .button-outline{background: transparent; color: var(--gold-dark); box-shadow: none;}

body.page-home .button-dark-outline{background: transparent; border-color: rgba(255,255,255,.55); color: white; box-shadow: none;}

body.page-home .menu-button{display: none; margin-left: auto; border: 0; background: none; padding: 6px;}

body.page-home .hero{position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 85% 20%, rgba(218,157,24,.12), transparent 28%),
    linear-gradient(105deg, #fbf5ec 0%, #fff 48%, #faf5ed 100%);}

body.page-home .hero-grid{min-height: 650px; display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 40px; padding-block: 58px;}

body.page-home .hero h1{max-width: 610px; margin-bottom: 24px; font-size: clamp(3.1rem, 6.1vw, 5.65rem); line-height: .98;}

body.page-home .hero h1 span{color: var(--gold-dark);}

body.page-home .hero-visual{position: relative;}

body.page-home .hero-visual img{position: relative; z-index: 1; width: 100%; border-radius: 28px; mix-blend-mode: multiply;}

body.page-home .proof-grid strong{color:var(--ink);}

body.page-home .product-card:hover,
body.page-home .product-card:focus-visible{transform: translateY(-6px);
  border-color: #e1bd62;
  box-shadow: var(--shadow);}

body.page-home .text-link{position: absolute; left: 26px; bottom: 25px; color: var(--gold-dark); font-weight: 600; font-size: .88rem;}

body.page-home .solution-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;}

body.page-home .solution-grid article{padding: 27px; border: 1px solid rgba(255,255,255,.12); border-radius: 18px; background: rgba(255,255,255,.035);}

body.page-home .solution-grid h3{margin: 16px 0 8px;}

body.page-home .solution-grid p{margin: 0; color: #c4d4cf; font-size: .92rem;}

body.page-home .developer-grid{display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; align-items: center;}

body.page-home .resource-grid{display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px;}

body.page-home .closing-cta{padding: 0 0 50px; background: white;}

body.page-home .closing-card{min-height: 260px; display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 48px 58px; border-radius: 28px; color: white; background:
  radial-gradient(circle at 85% 50%, rgba(215,157,17,.17), transparent 20%),
  linear-gradient(120deg, #0d352b, #08261f);}

body.page-home .closing-card h2{max-width: 680px; font-size: clamp(2rem, 4vw, 3rem);}

body.page-home .closing-card p:not(.eyebrow){max-width: 690px; color: #bfd0ca; margin-bottom: 0;}

body.page-home .closing-actions{display: flex; flex-wrap: wrap; gap: 12px; flex: 0 0 auto;}

body.page-home .hero-grid > .hero-visual,
body.page-server .hero-grid > .hero-visual,
body.page-phone .hero-grid > .hero-visual,
body.page-webphone .hero-grid > .hero-visual,
body.page-recording .hero-grid > .hero-visual,
body.page-agentai .hero-grid > .hero-visual{align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:center;}

@media (max-width:1000px){
body.page-home{overflow-x:hidden}

body.page-home .hero-grid{grid-template-columns:1fr;padding-top:70px}

body.page-home .solution-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

body.page-home .solution-grid article{min-width:0}

body.page-home .solution-grid h3,
body.page-home .solution-grid p{overflow-wrap:anywhere}

body.page-home .developer-grid{grid-template-columns:1fr;gap:40px}

body.page-home .resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

body.page-home .closing-card{align-items:flex-start;flex-direction:column}
}

@media (max-width:560px){
body.page-home .hero-grid{min-height:auto}

body.page-home .hero h1{font-size:clamp(2.55rem,12vw,3.2rem)}

body.page-home .solution-grid,
body.page-home .resource-grid{grid-template-columns:minmax(0,1fr)}

body.page-home .solution-grid article{padding:24px}

body.page-home .closing-card{padding:38px 26px}

body.page-home .closing-actions{width:100%}

body.page-home .closing-actions .button{width:100%}
}

/* Agent AI feature panel */
body.page-home .ai-card{min-height:420px;grid-template-columns:1.1fr .9fr;gap:50px;padding:58px;border-radius:30px;background:linear-gradient(135deg,#fff 0 58%,#f5ead9 58%);overflow:hidden}

body.page-home .ai-card>div:first-child{padding:0}

body.page-home .ai-card h2{max-width:680px}

body.page-home .ai-card p:not(.eyebrow){max-width:700px}

body.page-home .ai-visual-panel{display:grid;min-height:0;place-items:center;border:0;border-radius:0;background:transparent}

body.page-home .ai-orbit{margin:0}

@media (max-width:900px){
body.page-home .ai-card{min-height:auto;grid-template-columns:1fr;gap:30px;padding:38px;border-radius:24px;background:#fff}

body.page-home .ai-card>div:first-child{padding:0}

body.page-home .ai-visual-panel{min-height:390px;border:1px solid rgba(185,120,0,.14);border-radius:18px;background:linear-gradient(145deg,#fbf5ec,#f2e3cf)}
}

@media (max-width:560px){
body.page-home .ai-card{gap:28px;padding:22px 14px;border-radius:20px}

body.page-home .ai-card h2{font-size:clamp(2rem,9vw,2.55rem);line-height:1.08}

body.page-home .ai-card .tag-list{margin:22px 0 26px}

body.page-home .ai-card .button{width:100%;padding-inline:16px;text-align:center}

body.page-home .ai-visual-panel{min-height:380px;padding:18px 8px;border-radius:16px}

body.page-home .ai-orbit{width:320px;height:320px;transform:scale(1)}
}

@media (max-width:390px){
body.page-home .ai-card{padding-inline:10px}

body.page-home .ai-visual-panel{min-height:310px;padding-inline:0}

body.page-home .ai-orbit{width:320px;height:320px;transform:scale(.78)}
}

/* Homepage SDK selector */
body.page-home .sdk-selector-modal[hidden]{display:none}

body.page-home .sdk-selector-modal{position:fixed;inset:0;z-index:2100;display:grid;padding:22px;place-items:center}

body.page-home .sdk-selector-backdrop{position:absolute;inset:0;background:rgba(8,32,26,.68);backdrop-filter:blur(5px)}

body.page-home .sdk-selector-dialog{position:relative;width:min(100%,1080px);max-height:calc(100vh - 44px);overflow:auto;padding:34px;border:1px solid var(--border);border-radius:24px;background:#fff;box-shadow:0 30px 80px rgba(8,32,26,.28)}

body.page-home .sdk-selector-close{position:absolute;top:16px;right:16px;width:40px;height:40px;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--ink);font:500 1.65rem/1 "DM Sans",sans-serif;cursor:pointer}

body.page-home .sdk-selector-close:hover,body.page-home .sdk-selector-close:focus-visible{background:var(--cream-2);outline:2px solid #b97800;outline-offset:2px}

body.page-home .sdk-selector-heading{padding-right:48px;margin-bottom:24px}

body.page-home .sdk-selector-heading h2{margin:0 0 8px;font-size:clamp(1.8rem,4vw,2.5rem)}

body.page-home .sdk-selector-heading p:last-child{margin:0;color:var(--muted)}

body.page-home .sdk-choice-list{display:grid;gap:10px}

body.page-home .sdk-choice{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;column-gap:22px;padding:18px;border:1px solid var(--border);border-radius:12px;background:#fff;transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease}

body.page-home .sdk-choice:hover,
body.page-home .sdk-choice:focus-visible{border-color:rgba(185,120,0,.45);background:#fffaf3;box-shadow:0 10px 24px rgba(21,60,49,.07);outline:none;transform:translateY(-1px)}

body.page-home .sdk-choice strong{grid-column:1;grid-row:1;font:600 1.05rem/1.3 "Manrope",sans-serif;color:var(--ink)}

body.page-home .sdk-choice p{grid-column:1;grid-row:2;margin:4px 0 0;color:var(--muted);font-size:.9rem}

body.page-home .sdk-choice>span{grid-column:2;grid-row:1/3;color:#b97800;font-size:1.7rem;line-height:1;transition:transform .18s ease}

body.page-home .sdk-choice:hover>span{transform:translateX(3px)}

body.sdk-selector-open{overflow:hidden}

@media (max-width:680px){
body.page-home .sdk-selector-modal{padding:12px}

body.page-home .sdk-selector-dialog{max-height:calc(100vh - 24px);padding:28px 18px 20px;border-radius:18px}

}
