/* ========================================================================
   Granite State Remodeling — demo site styles
   Aesthetic: warm New England / architectural. Evergreen + brass + bone.
   Display: Fraunces (soft craftsman serif). Body: Hanken Grotesk.
   ===================================================================== */

:root{
  --ink:#1b211d;          /* near-black, green-tinged */
  --ink-soft:#3d453f;
  --bone:#f3eee3;         /* warm paper */
  --paper:#faf6ee;        /* lighter paper */
  --pine:#20423a;         /* deep evergreen (primary) */
  --pine-700:#183029;
  --pine-300:#4c6f64;
  --brass:#a9733c;        /* warm accent */
  --brass-600:#8f5f2e;
  --granite:#6d716c;      /* stone grey */
  --line:rgba(27,33,29,.14);
  --line-soft:rgba(27,33,29,.08);
  --card:#fffdf8;
  --shadow:0 1px 2px rgba(27,33,29,.05), 0 18px 40px -24px rgba(27,33,29,.35);
  --shadow-lg:0 30px 70px -40px rgba(24,48,41,.6);
  --r:14px;
  --r-sm:10px;
  --maxw:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  font-family:"Hanken Grotesk",system-ui,sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(20px,5vw,48px)}

h1,h2,h3,h4{font-family:"Fraunces",Georgia,serif;font-weight:500;line-height:1.05;letter-spacing:-.01em;color:var(--ink);margin:0}
em{font-style:italic;color:var(--pine)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.skip-link{position:absolute;left:-999px;top:0;background:var(--pine);color:#fff;padding:10px 16px;border-radius:0 0 8px 0;z-index:200}
.skip-link:focus{left:0}

.muted{color:var(--granite)}
.req{color:var(--brass)}
.opt{color:var(--granite);font-weight:400;font-size:.85em}

/* ---------- buttons ---------- */
.btn{
  --bg:var(--pine);--fg:#fff;--bd:var(--pine);
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  font-family:inherit;font-weight:600;font-size:1rem;letter-spacing:.005em;
  padding:.85em 1.45em;border-radius:100px;border:1.5px solid var(--bd);
  background:var(--bg);color:var(--fg);cursor:pointer;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .25s, color .25s;
  will-change:transform;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 26px -14px rgba(24,48,41,.6)}
.btn:active{transform:translateY(0)}
.btn svg{flex:0 0 auto}
.btn-primary{--bg:var(--pine);--fg:#fff;--bd:var(--pine)}
.btn-primary:hover{--bg:var(--pine-700)}
.btn-ghost{--bg:transparent;--fg:var(--pine);--bd:rgba(32,66,58,.3)}
.btn-ghost:hover{--bg:rgba(32,66,58,.06)}
.btn-invert{--bg:var(--brass);--fg:#1c130a;--bd:var(--brass)}
.btn-invert:hover{--bg:#c08a4d;--bd:#c08a4d}
.btn-outline{--bg:transparent;--fg:#f3eee3;--bd:rgba(243,238,227,.4)}
.btn-outline:hover{--bg:rgba(243,238,227,.1)}
.btn-sm{padding:.62em 1.1em;font-size:.92rem}
.btn-block{width:100%;margin-top:6px}

/* ---------- header ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:color-mix(in srgb,var(--paper) 88%,transparent);
  backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .3s, background .3s, box-shadow .3s;
}
.site-header.scrolled{border-bottom-color:var(--line-soft);box-shadow:0 10px 30px -24px rgba(27,33,29,.5)}
.header-inner{display:flex;align-items:center;gap:24px;height:74px;transition:height .3s}
.site-header.scrolled .header-inner{height:64px}

.brand{display:flex;align-items:center;gap:11px;color:var(--pine);flex:0 0 auto}
.brand-mark{display:grid;place-items:center;color:var(--pine)}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-name{font-family:"Fraunces",serif;font-weight:600;font-size:1.16rem;letter-spacing:-.01em;color:var(--ink)}
.brand-sub{font-size:.66rem;font-weight:600;text-transform:uppercase;letter-spacing:.22em;color:var(--brass);margin-top:3px}

.main-nav{display:flex;gap:28px;margin-left:auto}
.main-nav a{font-weight:500;font-size:.96rem;color:var(--ink-soft);position:relative;padding:4px 0}
.main-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--brass);transition:right .3s var(--ease)}
.main-nav a:hover{color:var(--ink)}
.main-nav a:hover::after{right:0}

.header-cta{display:flex;align-items:center;gap:14px;margin-left:22px}
.phone-link{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:.95rem;color:var(--pine);white-space:nowrap}
.phone-link:hover{color:var(--brass-600)}
.phone-link.big{font-family:"Fraunces",serif;font-size:1.4rem;margin-top:6px}

.nav-toggle{display:none;flex-direction:column;gap:5px;width:44px;height:44px;border:0;background:transparent;cursor:pointer;padding:10px}
.nav-toggle span{height:2px;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease), opacity .2s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{position:relative;padding:clamp(46px,7vw,88px) 0 clamp(48px,6vw,80px);overflow:hidden}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(120% 90% at 82% -10%, rgba(32,66,58,.10), transparent 55%),
    radial-gradient(90% 80% at -10% 110%, rgba(169,115,60,.10), transparent 55%),
    var(--bone);
}
.hero-bg::before{ /* topographic contour lines, granite/mountain nod */
  content:"";position:absolute;inset:0;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' viewBox='0 0 900 600'%3E%3Cg fill='none' stroke='%2320423a' stroke-opacity='0.10' stroke-width='1.2'%3E%3Cpath d='M-50 480 C 200 400 350 520 600 440 S 950 420 1050 470'/%3E%3Cpath d='M-50 520 C 220 450 360 560 620 480 S 960 470 1050 510'/%3E%3Cpath d='M-50 560 C 240 500 380 600 640 520 S 970 520 1050 550'/%3E%3Cpath d='M-50 430 C 190 350 340 470 590 390 S 940 370 1050 420'/%3E%3Cpath d='M-50 380 C 180 300 330 420 580 340 S 930 320 1050 370'/%3E%3C/g%3E%3C/svg%3E");
  background-size:cover;background-position:center bottom;
}
.hero-bg::after{ /* fine grain */
  content:"";position:absolute;inset:0;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,60px);align-items:center}

.eyebrow{font-size:.82rem;font-weight:600;text-transform:uppercase;letter-spacing:.2em;color:var(--brass-600);margin:0 0 18px}
.hero-title{font-size:clamp(2.6rem,6vw,4.6rem);font-weight:500;letter-spacing:-.02em}
.hero-title em{font-style:italic;font-weight:400}
.hero-lede{font-size:clamp(1.05rem,1.6vw,1.22rem);color:var(--ink-soft);max-width:34ch;margin:22px 0 30px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:26px}
.hero-trust{display:flex;align-items:center;gap:10px;font-size:.94rem;color:var(--granite);margin:0}
.hero-trust .dot{width:8px;height:8px;border-radius:50%;background:var(--pine-300);box-shadow:0 0 0 4px rgba(76,111,100,.18)}

/* ---------- estimate form ---------- */
.hero-form{position:relative;background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-lg);padding:clamp(22px,2.6vw,32px)}
.hero-form::before{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.form-head h2{font-size:1.62rem;margin-bottom:6px}
.form-head p{margin:0 0 18px;color:var(--granite);font-size:.96rem}
.field{display:flex;flex-direction:column;margin-bottom:14px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label{font-size:.86rem;font-weight:600;color:var(--ink-soft);margin-bottom:6px}
input,select,textarea{
  font-family:inherit;font-size:1rem;color:var(--ink);
  background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r-sm);
  padding:.72em .85em;width:100%;transition:border-color .2s, box-shadow .2s, background .2s;
}
textarea{resize:vertical;min-height:52px}
input::placeholder,textarea::placeholder{color:#a7a49b}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--pine-300);background:#fff;box-shadow:0 0 0 3px rgba(32,66,58,.13)}
.field.invalid input,.field.invalid select{border-color:#b1442f;box-shadow:0 0 0 3px rgba(177,68,47,.12)}
.err{color:#b1442f;font-size:.8rem;margin-top:5px;min-height:0;display:none}
.field.invalid .err{display:block}
.more-fields{margin:2px 0 14px;border-top:1px solid var(--line-soft);padding-top:12px}
.more-fields summary{cursor:pointer;font-size:.9rem;font-weight:600;color:var(--pine);list-style:none;display:flex;align-items:center;gap:6px}
.more-fields summary::-webkit-details-marker{display:none}
.more-fields summary::before{content:"+";font-size:1.1em;color:var(--brass);width:1em;display:inline-block}
.more-fields[open] summary::before{content:"–"}
.form-foot{font-size:.82rem;color:var(--granite);text-align:center;margin:14px 0 0;line-height:1.45}

.form-success{text-align:center;padding:14px 6px}
.form-success .success-mark{color:var(--pine);margin:6px auto 12px}
.form-success h2{font-size:1.7rem;margin-bottom:10px}
.form-success p{color:var(--ink-soft);margin:0 auto 12px;max-width:36ch}
.form-success .demo-note{font-size:.85rem;color:var(--granite);background:var(--bone);border-radius:var(--r-sm);padding:10px 12px}

.form-error{text-align:center;padding:14px 6px}
.form-error .error-mark{color:#b23b2e;margin:6px auto 12px}
.form-error h2{font-size:1.6rem;margin-bottom:10px}
.form-error p{color:var(--ink-soft);margin:0 auto 14px;max-width:36ch}
.form-error a{color:var(--pine);font-weight:600}

/* ---------- trust strip ---------- */
.trust-strip{background:var(--pine);color:#eaf0ec}
.trust-inner{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:22px 0}
.trust-item{display:flex;flex-direction:column;gap:2px;border-left:2px solid rgba(169,115,60,.55);padding-left:16px}
.trust-item strong{font-family:"Fraunces",serif;font-weight:600;font-size:1.15rem}
.trust-item span{font-size:.9rem;color:rgba(234,240,236,.72)}

/* ---------- generic section ---------- */
.section{padding:clamp(56px,8vw,104px) 0}
.section-head{max-width:640px;margin-bottom:clamp(30px,4vw,52px)}
.kicker{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--brass-600);margin:0 0 14px}
.section-title{font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:500}
.section-lede{font-size:1.1rem;color:var(--ink-soft);margin:16px 0 0}
.sample-flag{font-size:.9rem;color:var(--granite);font-style:italic}

/* ---------- services ---------- */
.services{background:var(--paper)}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.service-card{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r);padding:30px 28px 32px;transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .3s}
.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--line)}
.svc-ico{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:12px;background:rgba(32,66,58,.08);color:var(--pine);margin-bottom:18px}
.service-card h3{font-size:1.34rem;margin-bottom:8px}
.service-card p{margin:0;color:var(--ink-soft);font-size:.98rem}

/* ---------- process ---------- */
.process{background:var(--bone)}
.process-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,68px);align-items:start}
.ava-card{display:flex;gap:14px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--brass);border-radius:var(--r);padding:20px 22px;margin-top:30px;box-shadow:var(--shadow)}
.ava-ico{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:rgba(169,115,60,.14);color:var(--brass-600)}
.ava-card h3{font-size:1.12rem;margin-bottom:6px}
.ava-card p{margin:0;font-size:.95rem;color:var(--ink-soft)}
.steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:2px}
.steps li{position:relative;padding:24px 0 24px 66px;border-top:1px solid var(--line)}
.steps li:last-child{border-bottom:1px solid var(--line)}
.step-num{position:absolute;left:0;top:24px;font-family:"Fraunces",serif;font-size:1.35rem;font-weight:500;color:var(--brass);font-variant-numeric:tabular-nums}
.steps h3{font-size:1.24rem;margin-bottom:5px}
.steps p{margin:0;color:var(--ink-soft);font-size:.98rem}

/* ---------- projects ---------- */
.projects{background:var(--paper)}
.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.project{margin:0;border-radius:var(--r);overflow:hidden;background:var(--card);border:1px solid var(--line-soft);box-shadow:var(--shadow);transition:transform .4s var(--ease)}
.project:hover{transform:translateY(-4px)}
.project:hover .tile-art{transform:scale(1.05)}
.tile-art{aspect-ratio:4/5;transition:transform .6s var(--ease);position:relative}
.tile-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(20,32,27,.5))}
.tile-a{--fallback:linear-gradient(155deg,#2f5749 0%,#173229 100%)}
.tile-b{--fallback:linear-gradient(155deg,#8a6234 0%,#3c2c1a 100%)}
.tile-c{--fallback:linear-gradient(155deg,#456055 0%,#1e3d34 100%)}
.tile-d{--fallback:linear-gradient(155deg,#5f6f5d 0%,#2c3a30 100%)}
.project .tile-art{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='250' viewBox='0 0 200 250'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.16' stroke-width='1.4'%3E%3Cpath d='M30 150 L100 96 L170 150 M45 138 V200 H155 V138 M85 200 V165 H115 V200'/%3E%3C/g%3E%3C/svg%3E"), var(--fallback,linear-gradient(150deg,#2c5247,#16342b));
  background-size:66% auto, cover;background-position:center 60%, center;background-repeat:no-repeat;
}
figcaption{position:relative;z-index:1;display:flex;flex-direction:column;padding:14px 16px}
figcaption span{font-family:"Fraunces",serif;font-size:1.05rem;color:var(--ink)}
figcaption em{font-size:.82rem;color:var(--granite);font-style:normal;letter-spacing:.02em}

/* ---------- reviews ---------- */
.reviews{background:var(--bone)}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.review{margin:0;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r);padding:26px 26px 24px;box-shadow:var(--shadow)}
.stars{color:var(--brass);letter-spacing:2px;font-size:1rem;margin-bottom:12px}
.review p{font-family:"Fraunces",serif;font-size:1.14rem;line-height:1.4;color:var(--ink);margin:0 0 16px}
.review cite{font-style:normal;font-size:.88rem;color:var(--granite)}

/* ---------- service area ---------- */
.area{background:var(--paper)}
.area-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
.area-copy .btn{margin-top:26px}
.town-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.town-list li{background:var(--card);padding:16px 14px;font-size:.96rem;font-weight:500;color:var(--ink-soft);transition:background .25s, color .25s}
.town-list li:hover{background:var(--pine);color:#fff}

/* ---------- cta band ---------- */
.cta-band{background:linear-gradient(135deg,var(--pine-700),var(--pine));color:#f3eee3;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='400' viewBox='0 0 800 400'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.06' stroke-width='1.2'%3E%3Cpath d='M-50 300 C 150 240 300 340 500 270 S 800 260 900 300'/%3E%3Cpath d='M-50 340 C 170 280 320 380 520 310 S 820 300 900 340'/%3E%3Cpath d='M-50 260 C 140 200 290 300 490 230 S 790 220 900 260'/%3E%3C/g%3E%3C/svg%3E");background-size:cover}
.cta-inner{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:32px;padding:clamp(44px,6vw,72px) 0;flex-wrap:wrap}
.cta-inner h2{font-size:clamp(1.7rem,3vw,2.5rem);color:#fff}
.cta-inner p{margin:12px 0 0;color:rgba(243,238,227,.8);font-size:1.08rem}
.cta-actions{display:flex;gap:14px;flex-wrap:wrap}

/* ---------- footer ---------- */
.site-footer{background:var(--ink);color:#cdd2cd}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px;padding:clamp(46px,6vw,72px) 0 34px}
.footer-brand .brand-name{color:#fff;font-size:1.3rem}
.footer-brand p{color:#9aa29a;font-size:.95rem;margin:10px 0 16px;max-width:34ch}
.footer-brand .phone-link{color:#fff}
.footer-brand .phone-link:hover{color:var(--brass)}
.footer-col h4{font-family:"Hanken Grotesk",sans-serif;font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;color:#8a917f;font-weight:700;margin-bottom:14px}
.footer-col a{display:block;color:#cdd2cd;font-size:.95rem;padding:5px 0;transition:color .2s}
.footer-col a:hover{color:var(--brass)}
.footer-col p{margin:0;font-size:.95rem}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:22px 0 40px;display:flex;flex-direction:column;gap:12px}
.disclosure{font-size:.82rem;color:#8a917f;max-width:88ch;margin:0;line-height:1.55}
.disclosure strong{color:#b9c0b6}
.copyright{font-size:.82rem;color:#6f766c;margin:0}

/* ---------- mobile sticky bar ---------- */
.mobile-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;gap:10px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--paper) 94%,transparent);
  backdrop-filter:blur(10px);border-top:1px solid var(--line);
  transform:translateY(120%);transition:transform .4s var(--ease);
}
.mobile-bar.show{transform:translateY(0)}
.mobile-bar a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:100px;font-weight:600;font-size:1rem;min-height:52px}
.mb-call{background:transparent;border:1.5px solid rgba(32,66,58,.3);color:var(--pine)}
.mb-estimate{background:var(--pine);color:#fff}

/* ---------- reveal animation ----------
   Only hide when JS is present (html.js); no-JS always shows content. */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease), transform .7s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

/* staggered hero load */
.hero .reveal{transition-delay:calc(var(--i,0)*80ms)}

/* ========================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .hero-copy{max-width:600px}
  .hero-lede{max-width:46ch}
  .process-grid,.area-grid{grid-template-columns:1fr;gap:36px}
  .service-grid{grid-template-columns:repeat(2,1fr)}
  .review-grid{grid-template-columns:1fr}
  .project-grid{grid-template-columns:repeat(2,1fr)}
  .trust-inner{grid-template-columns:repeat(2,1fr);gap:18px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
}

@media (max-width:760px){
  body{font-size:16px}
  .main-nav{
    position:fixed;inset:64px 0 auto 0;flex-direction:column;gap:0;
    background:var(--paper);border-bottom:1px solid var(--line);
    padding:8px 24px 20px;box-shadow:0 24px 40px -24px rgba(0,0,0,.4);
    transform:translateY(-140%);transition:transform .4s var(--ease);
  }
  .main-nav.open{transform:translateY(0)}
  .main-nav a{padding:14px 0;border-bottom:1px solid var(--line-soft);font-size:1.05rem}
  .main-nav a::after{display:none}
  .header-cta .phone-link,.header-cta .btn-primary{display:none}
  .nav-toggle{display:flex}
  .header-cta{margin-left:auto}
  .town-list{grid-template-columns:repeat(2,1fr)}
  .cta-inner{flex-direction:column;align-items:flex-start}
  .cta-actions{width:100%}
  .cta-actions .btn{flex:1}
  .mobile-bar{display:flex}
  main{scroll-margin-top:0}
  /* keep content clear of sticky bar */
  .site-footer{padding-bottom:70px}
}

@media (max-width:460px){
  .field-row{grid-template-columns:1fr}
  .service-grid,.project-grid{grid-template-columns:1fr}
  .trust-inner{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero-actions .btn{flex:1}
}

/* section anchor offset under sticky header */
section[id],span[id]{scroll-margin-top:86px}

/* BEGIN P1_AVA_PROMINENCE_STYLES */
.ava-demo-banner {
  background: #14231d;
  color: #f7f1e7;
  border-bottom: 1px solid rgba(247, 241, 231, 0.16);
  font-size: 0.94rem;
  letter-spacing: 0.01em;
}

.ava-demo-banner__inner {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0.7rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  flex-wrap: wrap;
  text-align: center;
}

.ava-demo-banner__eyebrow {
  font-weight: 800;
  text-transform: uppercase;
  font-size: 0.74rem;
  letter-spacing: 0.12em;
  color: #d9a65d;
}

.ava-demo-banner__copy {
  color: rgba(247, 241, 231, 0.88);
}

.ava-demo-banner__link {
  color: #14231d;
  background: #f2c879;
  text-decoration: none;
  font-weight: 800;
  border-radius: 999px;
  padding: 0.42rem 0.82rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.ava-hero-demo,
.ava-lead-engine,
.ava-remodeler-section,
.ava-proof-preview,
.ava-chat-preview {
  width: min(1180px, calc(100% - 32px));
  margin: 4.5rem auto;
}

.ava-hero-demo {
  margin-top: 2.25rem;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: 1.5rem;
  align-items: stretch;
  padding: clamp(1.4rem, 3vw, 2.4rem);
  border-radius: 32px;
  background:
    radial-gradient(circle at top left, rgba(217, 166, 93, 0.28), transparent 34%),
    linear-gradient(135deg, #173328 0%, #0f211c 58%, #1f1712 100%);
  color: #fff8ed;
  border: 1px solid rgba(242, 200, 121, 0.22);
  box-shadow: 0 28px 80px rgba(10, 22, 18, 0.22);
  position: relative;
  overflow: hidden;
}

.ava-hero-demo::after {
  content: "";
  position: absolute;
  inset: auto -12% -45% 38%;
  height: 320px;
  background: rgba(242, 200, 121, 0.11);
  filter: blur(42px);
  transform: rotate(-8deg);
  pointer-events: none;
}

.ava-hero-demo__content,
.ava-live-card {
  position: relative;
  z-index: 1;
}

.ava-kicker {
  margin: 0 0 0.7rem;
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-weight: 900;
  color: #c9852f;
}

.ava-hero-demo .ava-kicker,
.ava-modal .ava-kicker {
  color: #f2c879;
}

.ava-hero-demo h2,
.ava-section-heading h2,
.ava-remodeler-section h2,
.ava-chat-preview h2,
.ava-modal h2 {
  margin: 0;
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.ava-hero-demo h2 {
  max-width: 760px;
  font-size: clamp(2.35rem, 5vw, 5rem);
}

.ava-hero-demo p {
  max-width: 680px;
  color: rgba(255, 248, 237, 0.82);
  font-size: 1.08rem;
  line-height: 1.7;
}

.ava-hero-demo__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 1.25rem;
}

.ava-primary-action,
.ava-secondary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0.78rem 1.05rem;
  border-radius: 999px;
  font-weight: 900;
  text-decoration: none;
}

.ava-primary-action {
  color: #14231d;
  background: #f2c879;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

.ava-secondary-action {
  color: #fff8ed;
  border: 1px solid rgba(255, 248, 237, 0.3);
  background: rgba(255, 255, 255, 0.07);
}

.ava-live-card {
  align-self: center;
  background: rgba(255, 248, 237, 0.96);
  color: #18241f;
  border-radius: 26px;
  padding: 1.35rem;
  border: 1px solid rgba(242, 200, 121, 0.48);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
}

.ava-live-card__header {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-weight: 900;
  margin-bottom: 0.9rem;
}

.ava-status-dot {
  width: 0.72rem;
  height: 0.72rem;
  border-radius: 999px;
  background: #2ea66f;
  box-shadow: 0 0 0 6px rgba(46, 166, 111, 0.14);
}

.ava-live-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.55rem;
}

.ava-live-card li {
  display: flex;
  gap: 0.55rem;
  color: #263a31;
}

.ava-live-card li::before {
  content: "✓";
  color: #2b7a52;
  font-weight: 1000;
}

.ava-live-card__note {
  margin: 1rem 0 0;
  padding-top: 0.9rem;
  border-top: 1px solid rgba(20, 35, 29, 0.12);
  font-size: 0.94rem;
  line-height: 1.6;
  color: #526157;
}

.ava-section-heading {
  max-width: 760px;
  margin-bottom: 1.35rem;
}

.ava-section-heading h2,
.ava-remodeler-section h2,
.ava-chat-preview h2 {
  font-size: clamp(2rem, 4vw, 3.8rem);
  color: #14231d;
}

.ava-section-heading p,
.ava-remodeler-section p,
.ava-chat-preview p {
  color: #5f6a63;
  line-height: 1.75;
  font-size: 1.05rem;
}

.ava-flow-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.ava-flow-step {
  background: #fffaf1;
  border: 1px solid rgba(20, 35, 29, 0.1);
  border-radius: 24px;
  padding: 1.1rem;
  box-shadow: 0 18px 44px rgba(20, 35, 29, 0.08);
}

.ava-flow-number {
  display: inline-flex;
  color: #c9852f;
  font-weight: 1000;
  letter-spacing: 0.12em;
  margin-bottom: 0.7rem;
}

.ava-flow-step h3 {
  margin: 0 0 0.45rem;
  color: #14231d;
}

.ava-flow-step p {
  margin: 0;
  color: #647068;
  line-height: 1.65;
}

.ava-remodeler-section {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 1.3rem;
  align-items: center;
  background: #f5efe3;
  border: 1px solid rgba(20, 35, 29, 0.1);
  border-radius: 30px;
  padding: clamp(1.3rem, 3vw, 2.2rem);
}

.ava-buyer-points {
  display: grid;
  gap: 0.85rem;
}

.ava-buyer-points div {
  background: #ffffff;
  border: 1px solid rgba(20, 35, 29, 0.08);
  border-radius: 20px;
  padding: 1rem;
  box-shadow: 0 14px 30px rgba(20, 35, 29, 0.07);
}

.ava-buyer-points strong,
.ava-buyer-points span {
  display: block;
}

.ava-buyer-points strong {
  color: #14231d;
  margin-bottom: 0.25rem;
}

.ava-buyer-points span {
  color: #647068;
  line-height: 1.55;
}

.ava-alert-card {
  max-width: 760px;
  background: #13251f;
  color: #fff8ed;
  border-radius: 28px;
  padding: clamp(1.15rem, 3vw, 1.8rem);
  box-shadow: 0 24px 60px rgba(20, 35, 29, 0.2);
  border: 1px solid rgba(242, 200, 121, 0.24);
}

.ava-alert-card__top {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-bottom: 1rem;
}

.ava-alert-card__top span {
  color: #f2c879;
  font-size: 0.78rem;
  text-transform: uppercase;
  font-weight: 1000;
  letter-spacing: 0.14em;
}

.ava-alert-card__top strong {
  font-size: clamp(1.45rem, 3vw, 2.15rem);
  letter-spacing: -0.03em;
}

.ava-alert-card dl {
  display: grid;
  gap: 0.7rem;
  margin: 0;
}

.ava-alert-card dl div {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 1rem;
  padding-top: 0.7rem;
  border-top: 1px solid rgba(255, 248, 237, 0.14);
}

.ava-alert-card dt {
  color: rgba(255, 248, 237, 0.58);
  font-weight: 800;
}

.ava-alert-card dd {
  margin: 0;
  color: rgba(255, 248, 237, 0.9);
}

.ava-chat-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.4rem;
  background:
    linear-gradient(135deg, rgba(20, 35, 29, 0.95), rgba(45, 34, 24, 0.93)),
    #14231d;
  color: #fff8ed;
  border-radius: 30px;
  padding: clamp(1.3rem, 3vw, 2rem);
}

.ava-chat-preview h2,
.ava-chat-preview p {
  color: inherit;
}

.ava-chat-preview p {
  color: rgba(255, 248, 237, 0.78);
  max-width: 720px;
}

.ava-chat-button {
  appearance: none;
  border: 0;
  white-space: nowrap;
  border-radius: 999px;
  padding: 0.9rem 1.15rem;
  background: #f2c879;
  color: #14231d;
  font-weight: 1000;
  cursor: pointer;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
}

.ava-modal[hidden] {
  display: none;
}

.ava-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 1rem;
}

.ava-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 12, 10, 0.7);
  backdrop-filter: blur(4px);
}

.ava-modal__panel {
  position: relative;
  width: min(520px, 100%);
  background: #14231d;
  color: #fff8ed;
  border: 1px solid rgba(242, 200, 121, 0.3);
  border-radius: 28px;
  padding: 1.4rem;
  box-shadow: 0 34px 90px rgba(0, 0, 0, 0.42);
}

.ava-modal__panel p {
  color: rgba(255, 248, 237, 0.8);
  line-height: 1.7;
}

.ava-modal__close {
  position: absolute;
  top: 0.8rem;
  right: 0.9rem;
  width: 2.2rem;
  height: 2.2rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 248, 237, 0.1);
  color: #fff8ed;
  font-size: 1.4rem;
  cursor: pointer;
}

@media (max-width: 860px) {
  .ava-hero-demo,
  .ava-remodeler-section,
  .ava-chat-preview {
    grid-template-columns: 1fr;
  }

  .ava-flow-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ava-chat-preview {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 560px) {
  .ava-hero-demo,
  .ava-lead-engine,
  .ava-remodeler-section,
  .ava-proof-preview,
  .ava-chat-preview {
    width: min(100% - 24px, 1180px);
    margin: 3rem auto;
  }

  .ava-hero-demo {
    border-radius: 24px;
  }

  .ava-flow-grid {
    grid-template-columns: 1fr;
  }

  .ava-alert-card dl div {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }

  .ava-demo-banner__inner {
    width: min(100% - 24px, 1180px);
  }

  .ava-demo-banner__link,
  .ava-primary-action,
  .ava-secondary-action,
  .ava-chat-button {
    width: 100%;
  }
}
/* END P1_AVA_PROMINENCE_STYLES */

/* BEGIN P1_AVA_READABILITY_POLISH */
.ava-hero-demo h2 {
  color: #fff8ed !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.22);
}

.ava-hero-demo p {
  color: rgba(255, 248, 237, 0.9) !important;
}

.ava-live-card__note {
  color: #526157 !important;
}

.ava-live-card {
  background: rgba(255, 250, 241, 0.98) !important;
}

.ava-hero-demo {
  margin-top: 1.25rem !important;
  margin-bottom: 3.25rem !important;
}
/* END P1_AVA_READABILITY_POLISH */

/* BEGIN P1_AVA_HEADER_AND_NOTE_POLISH */
.ava-hero-demo .ava-live-card__note {
  color: #526157 !important;
  background: rgba(20, 35, 29, 0.04);
  border-radius: 14px;
  padding: 0.85rem;
}

@media (max-width: 980px) {
  header nav,
  .site-nav,
  .nav-links {
    display: none !important;
  }

  header,
  .site-header,
  .header-inner,
  .nav-shell {
    overflow: hidden;
  }

  .ava-demo-banner__inner {
    gap: 0.45rem;
  }

  .ava-demo-banner__copy {
    flex-basis: 100%;
  }
}

@media (max-width: 760px) {
  .ava-hero-demo h2 {
    font-size: clamp(2.25rem, 10vw, 3.35rem);
  }

  .ava-live-card {
    padding: 1.05rem;
  }
}
/* END P1_AVA_HEADER_AND_NOTE_POLISH */

/* BEGIN P3_LIVE_AVA_CHAT_STYLES */
.ava-chat-live {
  align-items: stretch;
}

.ava-chat-copy {
  max-width: 620px;
}

.ava-chat-widget {
  width: min(100%, 520px);
  background: #fffaf1;
  color: #14231d;
  border: 1px solid rgba(242, 200, 121, 0.36);
  border-radius: 28px;
  padding: 1rem;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
}

.ava-chat-widget__header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(20, 35, 29, 0.1);
}

.ava-chat-widget__header strong,
.ava-chat-widget__eyebrow {
  display: block;
}

.ava-chat-widget__eyebrow {
  color: #c9852f;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 1000;
  margin-bottom: 0.2rem;
}

.ava-chat-widget__status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.35rem 0.65rem;
  background: rgba(46, 166, 111, 0.12);
  color: #24734e;
  font-weight: 1000;
  font-size: 0.82rem;
}

.ava-chat-messages {
  min-height: 190px;
  max-height: 320px;
  overflow-y: auto;
  display: grid;
  gap: 0.7rem;
  padding: 1rem 0;
}

.ava-chat-message {
  max-width: 88%;
  border-radius: 18px;
  padding: 0.78rem 0.9rem;
  line-height: 1.55;
  font-size: 0.95rem;
}

.ava-chat-message--assistant {
  background: #efe4d2;
  color: #263a31;
  border-bottom-left-radius: 6px;
}

.ava-chat-message--user {
  justify-self: end;
  background: #14231d;
  color: #fff8ed;
  border-bottom-right-radius: 6px;
}

.ava-chat-message--system {
  max-width: 100%;
  background: rgba(46, 166, 111, 0.12);
  color: #24734e;
  border: 1px solid rgba(46, 166, 111, 0.18);
  font-weight: 800;
}

.ava-chat-form {
  display: grid;
  gap: 0.65rem;
}

.ava-chat-form textarea {
  width: 100%;
  resize: vertical;
  border: 1px solid rgba(20, 35, 29, 0.18);
  border-radius: 18px;
  padding: 0.85rem;
  font: inherit;
  color: #14231d;
  background: #fff;
  min-height: 88px;
}

.ava-chat-form textarea:focus {
  outline: 3px solid rgba(242, 200, 121, 0.42);
  border-color: rgba(201, 133, 47, 0.72);
}

.ava-chat-form button {
  border: 0;
  border-radius: 999px;
  padding: 0.88rem 1rem;
  background: #f2c879;
  color: #14231d;
  font-weight: 1000;
  cursor: pointer;
}

.ava-chat-form button:disabled,
.ava-chat-form textarea:disabled {
  opacity: 0.62;
  cursor: not-allowed;
}

.ava-chat-footnote {
  margin: 0.8rem 0 0;
  color: #627167 !important;
  font-size: 0.84rem !important;
  line-height: 1.45 !important;
}

@media (max-width: 860px) {
  .ava-chat-widget {
    width: 100%;
  }

  .ava-chat-messages {
    max-height: 360px;
  }
}
/* END P3_LIVE_AVA_CHAT_STYLES */

/* BEGIN P3_FLOATING_AVA_CHAT_STYLES */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.ava-floating-chat {
  position: fixed;
  right: 1.35rem;
  bottom: 1.35rem;
  z-index: 9998;
  font-family: inherit;
}

.ava-floating-chat__launcher {
  appearance: none;
  border: 1px solid rgba(242, 200, 121, 0.32);
  border-radius: 999px;
  background:
    radial-gradient(circle at 18% 18%, rgba(242, 200, 121, 0.24), transparent 28%),
    linear-gradient(135deg, #14231d 0%, #0f211c 58%, #2d2218 100%);
  color: #fff8ed;
  display: flex;
  align-items: center;
  gap: 0.78rem;
  padding: 0.76rem 0.92rem;
  box-shadow: 0 22px 60px rgba(7, 12, 10, 0.34);
  cursor: pointer;
  max-width: min(360px, calc(100vw - 32px));
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.ava-floating-chat__launcher:hover {
  transform: translateY(-2px);
  border-color: rgba(242, 200, 121, 0.58);
  box-shadow: 0 28px 72px rgba(7, 12, 10, 0.42);
}

.ava-floating-chat__pulse {
  width: 0.78rem;
  height: 0.78rem;
  border-radius: 999px;
  background: #38b878;
  box-shadow: 0 0 0 0 rgba(56, 184, 120, 0.58);
  animation: avaPulse 1.9s infinite;
  flex: 0 0 auto;
}

@keyframes avaPulse {
  0% { box-shadow: 0 0 0 0 rgba(56, 184, 120, 0.58); }
  70% { box-shadow: 0 0 0 10px rgba(56, 184, 120, 0); }
  100% { box-shadow: 0 0 0 0 rgba(56, 184, 120, 0); }
}

.ava-floating-chat__launcher-copy {
  display: grid;
  gap: 0.08rem;
  text-align: left;
  line-height: 1.1;
}

.ava-floating-chat__launcher-copy strong {
  font-size: 0.82rem;
  color: #f2c879;
}

.ava-floating-chat__launcher-copy span {
  font-size: 1.02rem;
  font-weight: 1000;
  letter-spacing: -0.02em;
}

.ava-floating-chat__badge {
  border-radius: 999px;
  background: rgba(255, 248, 237, 0.1);
  border: 1px solid rgba(255, 248, 237, 0.16);
  color: rgba(255, 248, 237, 0.78);
  padding: 0.34rem 0.5rem;
  font-size: 0.72rem;
  font-weight: 900;
  white-space: nowrap;
}

.ava-floating-chat__panel {
  position: absolute;
  right: 0;
  bottom: calc(100% + 0.9rem);
  width: min(420px, calc(100vw - 32px));
  max-height: min(680px, calc(100vh - 120px));
  background: #fffaf1;
  color: #14231d;
  border: 1px solid rgba(242, 200, 121, 0.44);
  border-radius: 28px;
  box-shadow: 0 32px 90px rgba(7, 12, 10, 0.38);
  overflow: hidden;
}

.ava-floating-chat__panel[hidden] {
  display: none;
}

.ava-floating-chat__header {
  background:
    radial-gradient(circle at top left, rgba(242, 200, 121, 0.18), transparent 34%),
    linear-gradient(135deg, #14231d 0%, #0f211c 100%);
  color: #fff8ed;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1rem 0.95rem;
}

.ava-floating-chat__eyebrow {
  display: inline-flex;
  color: #f2c879;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 1000;
  margin-bottom: 0.22rem;
}

.ava-floating-chat__header h2 {
  margin: 0;
  color: #fff8ed;
  font-size: 1.35rem;
  letter-spacing: -0.03em;
}

.ava-floating-chat__header p {
  margin: 0.2rem 0 0;
  color: rgba(255, 248, 237, 0.76);
  font-size: 0.88rem;
}

.ava-floating-chat__close {
  appearance: none;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 248, 237, 0.14);
  background: rgba(255, 248, 237, 0.1);
  color: #fff8ed;
  font-size: 1.45rem;
  line-height: 1;
  cursor: pointer;
}

.ava-floating-chat__messages {
  min-height: 210px;
  max-height: 320px;
  overflow-y: auto;
  display: grid;
  gap: 0.72rem;
  padding: 1rem;
  background:
    linear-gradient(180deg, rgba(245, 239, 227, 0.72), rgba(255, 250, 241, 1));
}

.ava-floating-chat__message {
  max-width: 88%;
  border-radius: 18px;
  padding: 0.78rem 0.9rem;
  line-height: 1.52;
  font-size: 0.94rem;
  word-wrap: break-word;
}

.ava-floating-chat__message--assistant {
  background: #efe4d2;
  color: #263a31;
  border-bottom-left-radius: 6px;
}

.ava-floating-chat__message--user {
  justify-self: end;
  background: #14231d;
  color: #fff8ed;
  border-bottom-right-radius: 6px;
}

.ava-floating-chat__message--system {
  max-width: 100%;
  background: rgba(46, 166, 111, 0.12);
  color: #24734e;
  border: 1px solid rgba(46, 166, 111, 0.2);
  font-weight: 850;
}

.ava-floating-chat__form {
  display: grid;
  gap: 0.65rem;
  padding: 0 1rem 1rem;
  background: #fffaf1;
}

.ava-floating-chat__form textarea {
  width: 100%;
  min-height: 86px;
  resize: vertical;
  border: 1px solid rgba(20, 35, 29, 0.18);
  border-radius: 18px;
  padding: 0.85rem;
  font: inherit;
  color: #14231d;
  background: #fff;
}

.ava-floating-chat__form textarea:focus {
  outline: 3px solid rgba(242, 200, 121, 0.42);
  border-color: rgba(201, 133, 47, 0.72);
}

.ava-floating-chat__form button {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 0.88rem 1rem;
  background: #f2c879;
  color: #14231d;
  font-weight: 1000;
  cursor: pointer;
}

.ava-floating-chat__form button:disabled,
.ava-floating-chat__form textarea:disabled {
  opacity: 0.62;
  cursor: not-allowed;
}

.ava-floating-chat__status {
  margin: -0.25rem 1rem 1rem;
  color: #627167;
  font-size: 0.82rem;
  line-height: 1.45;
}

@media (max-width: 640px) {
  .ava-floating-chat {
    right: 0.75rem;
    bottom: 0.75rem;
    left: 0.75rem;
  }

  .ava-floating-chat__launcher {
    width: 100%;
    justify-content: center;
  }

  .ava-floating-chat__badge {
    display: none;
  }

  .ava-floating-chat__panel {
    position: fixed;
    left: 0.75rem;
    right: 0.75rem;
    bottom: 0.75rem;
    width: auto;
    max-height: min(720px, calc(100vh - 24px));
    border-radius: 24px;
  }

  .ava-floating-chat__messages {
    max-height: min(360px, calc(100vh - 310px));
  }
}
/* END P3_FLOATING_AVA_CHAT_STYLES */

/* BEGIN FORCE_VISIBLE_AVA_BUBBLE_CSS */
.force-ava-bubble {
  position: fixed !important;
  right: 22px !important;
  bottom: 22px !important;
  z-index: 2147483000 !important;
  font-family: inherit !important;
}

.force-ava-bubble__button {
  border: 1px solid rgba(242, 200, 121, 0.45) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #14231d, #0f211c 58%, #2d2218) !important;
  color: #fff8ed !important;
  box-shadow: 0 24px 70px rgba(7, 12, 10, 0.45) !important;
  padding: 13px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  cursor: pointer !important;
  min-width: 230px !important;
}

.force-ava-bubble__button strong,
.force-ava-bubble__button small {
  display: block !important;
  text-align: left !important;
  line-height: 1.12 !important;
}

.force-ava-bubble__button strong {
  color: #f2c879 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.force-ava-bubble__button small {
  color: #fff8ed !important;
  font-size: 17px !important;
  font-weight: 1000 !important;
}

.force-ava-bubble__dot {
  width: 13px !important;
  height: 13px !important;
  border-radius: 999px !important;
  background: #38b878 !important;
  box-shadow: 0 0 0 7px rgba(56, 184, 120, 0.15) !important;
}

.force-ava-bubble__panel {
  position: absolute !important;
  right: 0 !important;
  bottom: 72px !important;
  width: min(420px, calc(100vw - 32px)) !important;
  max-height: min(680px, calc(100vh - 120px)) !important;
  background: #fffaf1 !important;
  color: #14231d !important;
  border: 1px solid rgba(242, 200, 121, 0.48) !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  box-shadow: 0 34px 95px rgba(7, 12, 10, 0.42) !important;
}

.force-ava-bubble__panel[hidden] {
  display: none !important;
}

.force-ava-bubble__header {
  background: linear-gradient(135deg, #14231d, #0f211c) !important;
  color: #fff8ed !important;
  padding: 16px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
}

.force-ava-bubble__header strong,
.force-ava-bubble__header span {
  display: block !important;
}

.force-ava-bubble__header strong {
  font-size: 22px !important;
}

.force-ava-bubble__header span {
  color: rgba(255, 248, 237, 0.75) !important;
  font-size: 13px !important;
}

.force-ava-bubble__header button {
  width: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  background: rgba(255,255,255,0.1) !important;
  color: #fff8ed !important;
  font-size: 24px !important;
  cursor: pointer !important;
}

.force-ava-bubble__messages {
  padding: 16px !important;
  display: grid !important;
  gap: 10px !important;
  min-height: 210px !important;
  max-height: 320px !important;
  overflow-y: auto !important;
  background: #fffaf1 !important;
}

.force-ava-bubble__msg {
  max-width: 88% !important;
  padding: 12px 14px !important;
  border-radius: 18px !important;
  line-height: 1.5 !important;
  font-size: 14px !important;
}

.force-ava-bubble__msg--ava {
  background: #efe4d2 !important;
  color: #263a31 !important;
  border-bottom-left-radius: 6px !important;
}

.force-ava-bubble__msg--user {
  justify-self: end !important;
  background: #14231d !important;
  color: #fff8ed !important;
  border-bottom-right-radius: 6px !important;
}

.force-ava-bubble__msg--system {
  max-width: 100% !important;
  background: rgba(46,166,111,0.12) !important;
  color: #24734e !important;
  border: 1px solid rgba(46,166,111,0.2) !important;
  font-weight: 850 !important;
}

.force-ava-bubble__form {
  padding: 0 16px 14px !important;
  display: grid !important;
  gap: 10px !important;
  background: #fffaf1 !important;
}

.force-ava-bubble__form textarea {
  width: 100% !important;
  min-height: 86px !important;
  border: 1px solid rgba(20,35,29,0.18) !important;
  border-radius: 16px !important;
  padding: 12px !important;
  font: inherit !important;
  resize: vertical !important;
}

.force-ava-bubble__form button {
  border: 0 !important;
  border-radius: 999px !important;
  padding: 13px 16px !important;
  background: #f2c879 !important;
  color: #14231d !important;
  font-weight: 1000 !important;
  cursor: pointer !important;
}

.force-ava-bubble__status {
  margin: -4px 16px 14px !important;
  color: #627167 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

@media (max-width: 640px) {
  .force-ava-bubble {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
  }

  .force-ava-bubble__button {
    width: 100% !important;
    justify-content: center !important;
  }

  .force-ava-bubble__panel {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    width: auto !important;
    max-height: calc(100vh - 24px) !important;
  }
}
/* END FORCE_VISIBLE_AVA_BUBBLE_CSS */

/* BEGIN FORCE_AVA_BUBBLE_CLICK_FIX_CSS */
.force-ava-bubble__panel.is-open {
  display: block !important;
}
/* END FORCE_AVA_BUBBLE_CLICK_FIX_CSS */

/* BEGIN DEMO CONVERSION STRIP */

.demo-top-product-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 14px;
  margin-left: 10px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: #f7f0df;
  font-size: 0.82rem;
  font-weight: 900;
  text-decoration: none;
}

.demo-top-product-link:hover {
  background: rgba(255, 255, 255, 0.1);
}

.demo-conversion-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: min(920px, calc(100% - 40px));
  margin: -24px auto 44px;
  padding: 16px 18px;
  border: 1px solid rgba(16, 41, 31, 0.12);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(16, 41, 31, 0.08);
}

.demo-conversion-strip strong,
.demo-conversion-strip span {
  display: block;
}

.demo-conversion-strip strong {
  color: #10291f;
  font-size: 1rem;
}

.demo-conversion-strip span {
  color: #5f6b5f;
  font-size: 0.92rem;
}

.demo-conversion-strip a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  color: #ffffff;
  background: #143d31;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

.demo-conversion-strip a:hover {
  background: #0d2e25;
}

@media (max-width: 760px) {
  .demo-top-product-link {
    width: 100%;
    margin: 8px 0 0;
  }

  .demo-conversion-strip {
    align-items: stretch;
    flex-direction: column;
    margin-top: -12px;
  }

  .demo-conversion-strip a {
    width: 100%;
  }
}

/* END DEMO CONVERSION STRIP */

/* BEGIN REAL PROJECT IMAGES */

.project .tile-art {
  min-height: 340px;
}

.project.tile-a .tile-art,
.project.tile-b .tile-art,
.project.tile-c .tile-art,
.project.tile-d .tile-art {
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.project.tile-a .tile-art {
  background-image: url("./assets/projects/kitchen-remodel.png") !important;
}

.project.tile-b .tile-art {
  background-image: url("./assets/projects/primary-bath.png") !important;
}

.project.tile-c .tile-art {
  background-image: url("./assets/projects/rear-addition.png") !important;
}

.project.tile-d .tile-art {
  background-image: url("./assets/projects/farmers-porch-deck.png") !important;
}

.project .tile-art::after {
  background: linear-gradient(180deg, rgba(20, 35, 29, 0.04), rgba(20, 35, 29, 0.18));
}

/* END REAL PROJECT IMAGES */

/* BEGIN REAL PROJECT IMG TAGS */

.project .tile-art.project-photo {
  position: relative;
  min-height: 340px;
  overflow: hidden;
  background-image: none !important;
  background: #14231d !important;
}

.project .tile-art.project-photo img {
  display: block;
  width: 100%;
  height: 340px;
  object-fit: cover;
  object-position: center;
  transform: scale(1.001);
  transition: transform 0.45s var(--ease);
}

.project:hover .tile-art.project-photo {
  transform: none;
}

.project:hover .tile-art.project-photo img {
  transform: scale(1.055);
}

.project .tile-art.project-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20, 35, 29, 0.02), rgba(20, 35, 29, 0.16));
  pointer-events: none;
}

@media (max-width: 760px) {
  .project .tile-art.project-photo,
  .project .tile-art.project-photo img {
    height: 300px;
    min-height: 300px;
  }
}

/* END REAL PROJECT IMG TAGS */

