/* Website project brief shown as a popup (html7 v2 form design). */
.gwBriefModal{place-items:start center;padding:24px 16px;overflow-y:auto;}
.gwBriefBox{width:min(1160px,100%);max-height:none;overflow:visible;padding:clamp(26px,3.4vw,46px);background:var(--bg);}
.gwBriefModal .gwModalX{position:sticky;float:right;top:0;margin:-10px -10px 0 0;z-index:3;}
.gwBriefHead{max-width:760px;margin:0 0 clamp(22px,3vw,34px);}
.gwBriefHead .gwKick{margin-bottom:12px;}
.gwBriefHead .lvTitle{margin:0 0 14px;font-size:clamp(30px,3.6vw,52px);font-weight:500;line-height:1.05;letter-spacing:-.035em;color:var(--head);}
.gwBriefHead .lvLead{margin:0;}
.gwBriefBox .gwPanelTop h2{margin:0 0 6px;font-size:clamp(26px,2.6vw,36px);font-weight:500;letter-spacing:-.03em;line-height:1.1;}
.gwBriefBox .gwSuccess h2{margin:0 0 10px;font-size:34px;font-weight:500;letter-spacing:-.03em;}
.gwBriefBox .gwSide{position:sticky;top:0;align-self:start;}
@media (max-width:767px){.gwBriefModal{padding:10px;}.gwBriefBox{padding:22px 16px;border-radius:22px;}}
/* --- design rules scoped to the page body, repeated for the popups (they sit outside <main>) --- */
:where([data-css~=j]) :is(.gwBriefBox,.gwModalBox) .lvBandIn > *{width:auto;}
:where([data-css~=j]) :is(.gwBriefBox,.gwModalBox) .lvBandIn > div{flex:1 1 520px;min-width:0;}
@media (max-width:1240px){:where([data-css~=j]) :is(.gwBriefBox,.gwModalBox) .lvBandIn{padding-left:20px;padding-right:20px;}}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwHeroArt{width:100%;max-width:520px;justify-self:end;}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwPlatTiles .lvTile{flex:1;color:inherit;text-decoration:none;font-weight:400;}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .lvBandIn > *{width:auto;}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwStripIn > *{width:auto;}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwPcMore{align-self:center;margin:-4px 0 16px;font-size:14px;font-weight:600;color:var(--brass);}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwStepLink{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:14px;color:var(--muted);text-decoration:none;font-weight:600;font-size:15px;transition:background .25s,color .25s;}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwStepLink:hover{color:var(--head);}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwStepLink.active{background:color-mix(in srgb,var(--brass) 12%,transparent);color:var(--head);}
@media (max-width:991px){
:where([data-css~=x]) .gwBrief{grid-template-columns:minmax(0,1fr);gap:16px;}
:where([data-css~=x]) .gwSide{position:static;}
:where([data-css~=x]) .gwSideCard{padding:10px;}
:where([data-css~=x]) .gwSideT,:where([data-css~=x]) .gwSideHelp{display:none;}
:where([data-css~=x]) .gwStepNav{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;}
:where([data-css~=x]) :is(.gwBriefBox,.gwModalBox) .gwStepLink{justify-content:center;padding:9px 6px;font-size:13px;gap:8px;}
:where([data-css~=x]) .gwStepLink .num{width:26px;height:26px;font-size:11px;}
:where([data-css~=x]) .gwFeat{grid-template-columns:repeat(2,minmax(0,1fr));}
}
/* --- Web design consultation & quote popup (Nov 2026) --- */
.gwQuoteBox{width:min(1160px,100%);padding:clamp(22px,3vw,46px);border-color:color-mix(in srgb,var(--brass) 30%,transparent);}
.gwQuoteBox .gwModalX{position:absolute;float:none;top:20px;right:20px;margin:0;}
.gwQuote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.94fr);gap:clamp(20px,2.6vw,30px);align-items:start;}
.gwQuoteSide,.gwQuoteCard{border-radius:28px;background:var(--bg-2);border:1px solid var(--line-2);}
.gwQuoteSide{padding:clamp(22px,2.6vw,34px) clamp(22px,2.4vw,30px);}
.gwQuoteKick{display:flex;align-items:center;gap:12px;margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);}
.gwQuoteKick::before{content:"";width:26px;height:2px;border-radius:2px;background:var(--brass);}
.gwQuoteBox .gwQuoteTitle{margin:0 0 clamp(26px,3vw,40px);font-size:clamp(32px,3.9vw,54px);font-weight:500;line-height:1.24;letter-spacing:-.035em;color:var(--head);}
.gwQuoteTitle .gwHi{color:var(--brass);}
.gwQuoteSub{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.gwQuotePts{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px;}
.gwQuotePts li{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--brass) 12%,var(--bg-2));font-size:15.5px;font-weight:600;line-height:1.4;color:var(--head);}
.gwQuoteNo{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--brass);color:var(--on-accent);font-size:12px;font-weight:700;}
.gwQuoteHelp{padding:18px;border-radius:18px;background:var(--bg);border:1px solid var(--line-2);}
.gwQuoteHelp b{display:block;margin-bottom:6px;font-size:15px;color:var(--head);}
.gwQuoteHelp p{margin:0 0 12px;font-size:13.5px;line-height:1.65;color:var(--muted);}
.gwQuoteHelp .inkLink{font-size:14px;color:var(--brass);}
.gwQuoteCard{padding:clamp(24px,3vw,38px) clamp(22px,3vw,36px) clamp(24px,3vw,34px);}
.gwQuoteBox .gwQuoteFormT{margin:0 0 6px;padding:0 40px 22px 0;border-bottom:1px solid var(--line-2);font-size:clamp(20px,1.8vw,25px);font-weight:500;line-height:1.3;letter-spacing:-.025em;color:var(--head);}
.gwQuoteGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 30px;align-items:end;}
.gwQuoteGrid > .full{grid-column:1/-1;}
.gwQuoteGrid .field label{padding-left:0;left:0;}
.gwQuoteGrid .field input{padding-left:0;padding-right:0;}
.gwQuoteGrid .field .gwHint{padding-left:0;}
.gwQuoteGrid .gwSel{padding-top:28px;}
.gwQuoteGrid .gwQ{font-size:15px;line-height:1.45;}
.gwQuoteMsg{padding-top:30px;}
.gwQuoteMsg textarea{display:block;width:100%;min-height:130px;padding:10px 0;border:0;border-bottom:1.5px solid var(--line-2);border-radius:0;background:transparent;color:var(--text);font:inherit;font-size:16px;resize:vertical;transition:border-color .3s;}
.gwQuoteMsg textarea:focus{outline:none;border-bottom-color:var(--brass);}
.gwQuoteBtn{margin-top:24px;padding-left:30px;padding-right:30px;}
.gwQuoteFields[hidden]{display:none;}
.gwQuoteBox .gwSuccess{padding:30px 10px;}
.gwQuoteForm .field.err input,.gwQuoteForm .field.err select,.gwQuoteForm .field.err .csBtn{border-bottom-color:#e5534b;}
@media (max-width:991px){.gwQuote{grid-template-columns:minmax(0,1fr);}.gwQuoteBox .gwQuoteTitle{margin-bottom:24px;}}
@media (max-width:600px){.gwQuoteGrid{grid-template-columns:minmax(0,1fr);}.gwQuoteBox .gwModalX{top:12px;right:12px;}.gwQuoteBox .gwQuoteFormT{padding-right:0;}.gwQuotePts li{font-size:14.5px;}}

/* Picture next to long text (intro split, "why choose us"): stays in view while the text scrolls */
@media (min-width:992px){
:where([data-css~=z]) .amSplit > .amArt,:where([data-css~=z]) .amWhy > .amArt{position:sticky;top:120px;align-self:start;}
}
