/* Photographic panels: the focusable link reveals the same content as hover. */
.service-panel{position:relative;isolation:isolate;flex:1 1 0;min-width:0;overflow:hidden;border-right:1px solid #d6f8f12b;transition:flex-grow .65s cubic-bezier(.2,.65,.2,1)}.service-panel:first-child{flex-grow:1.1}.service-panel>img{position:absolute;inset:0;height:100%;z-index:-3;filter:saturate(.55);transition:transform 1s,filter .6s}.service-panel:before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(0deg,#041e2afa 3%,#041e2a96 49%,#072a3925)}.service-panel:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#007c873d,transparent 70%);opacity:0;transition:opacity .5s}.panel-label{position:absolute;top:28px;left:28px;right:28px;display:flex;justify-content:space-between;align-items:center;font:11px var(--body);color:#cff8f4}.panel-label svg{width:32px;height:32px}.panel-content{position:absolute;left:28px;right:28px;bottom:35px}.panel-content h3{font:500 clamp(26px,2.1vw,34px)/1.15 var(--body);letter-spacing:-.025em}.panel-information{opacity:0;max-height:0;transform:translateY(14px);overflow:hidden;transition:max-height .65s,opacity .5s,transform .5s}.panel-information p{font-size:17px;line-height:1.55;margin-top:20px;max-width:420px}.panel-information a{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:47px;margin-top:18px;border-bottom:1px solid #a0ddd578;color:var(--aqua);font-size:13px;font-weight:600}.service-panel:hover,.service-panel:focus-within{flex-grow:1.85}.service-panel:hover>img,.service-panel:focus-within>img{transform:scale(1.065);filter:saturate(1)}.service-panel:hover:after,.service-panel:focus-within:after{opacity:1}.service-panel:hover .panel-information,.service-panel:focus-within .panel-information{opacity:1;max-height:330px;transform:none;overflow:visible}.service-panel:hover h3,.service-panel:focus-within h3{color:var(--aqua)}.service-panel:focus-within{box-shadow:inset 0 -4px var(--coral)}#web-design>img{object-position:65% center}#seo>img{object-position:50% center}
/* Replaceable client captures; no illustrative fake websites. */
.web-frame{width:100%;background:#e9eff1;border:1px solid #9ab3bc;border-radius:7px 7px 1px 1px;overflow:hidden}.browser-chrome{height:29px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-bottom:1px solid #bdcdd3;background:#f0f5f6;color:#5d7780;font-size:7px;gap:10px}.browser-chrome>span:first-child{font-size:5px;letter-spacing:2px}.screenshot-slot{min-height:350px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;position:relative;color:#375967;background:#dfe8eb;border:18px solid #eaf1f3;text-align:center;padding:35px}.slot-type{position:absolute;top:13px;left:13px;font:7px var(--body);letter-spacing:.12em}.slot-mark{font-size:28px;color:#698a98;line-height:1;margin-bottom:18px}.screenshot-slot strong{font-size:18px;font-weight:500;line-height:1.3;letter-spacing:-.02em}.screenshot-slot>span:not(.slot-type):not(.slot-mark){font-size:11px}.screenshot-slot small{font-size:9px;color:#5c7985}.phone-frame{position:relative;border:5px solid #284956;border-radius:24px;background:#eaf1f3;overflow:hidden}.speaker{position:absolute;top:7px;left:36%;height:5px;width:28%;border-radius:5px;background:#284956;z-index:1}.phone-frame .screenshot-slot{border:0;height:100%;min-height:100%;padding:28px 9px}.phone-frame .slot-type{position:static;font-size:6px;margin-bottom:20px}.phone-frame .slot-mark{font-size:18px;margin-bottom:10px}.phone-frame strong{font-size:11px}.phone-frame .screenshot-slot>span:not(.slot-type):not(.slot-mark){font-size:8px}.phone-frame small{font-size:7px}.laptop .screenshot-slot{min-height:200px;border-width:12px;padding:25px}.measurement-stage .screenshot-slot{min-height:230px;border-width:12px;padding:20px}.measurement-stage .phone-frame .screenshot-slot{border:0;min-height:100%;padding:25px 7px}.project-pair .screenshot-slot strong{font-size:13px}.project-pair .phone-frame strong{font-size:9px}.project-pair .screenshot-slot>span:not(.slot-type):not(.slot-mark){font-size:8px}.project-pair .screenshot-slot small{font-size:7px}
/* Rounded question surfaces: no scripting is required to read answers. */
.faq-item{background:#fff;border:1px solid #bfd2da;border-radius:13px;overflow:hidden;transition:background .3s,color .3s,border-color .3s}.faq-button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:88px;padding:23px 25px;background:none;border:0;color:inherit;text-align:left;font:600 17px/1.5 var(--body)}.faq-button:disabled{opacity:1}.faq-button:focus-visible{outline-offset:-6px;border-radius:12px}.faq-symbol{position:relative;flex:0 0 32px;height:32px;border:1px solid #789eac;border-radius:50%}.faq-symbol:before,.faq-symbol:after{content:'';position:absolute;left:10px;top:14px;width:10px;height:2px;background:currentColor}.faq-symbol:after{transform:rotate(90deg);transition:transform .25s}.faq-button[aria-expanded=true] .faq-symbol:after{transform:rotate(0)}.faq-answer{display:grid;grid-template-rows:1fr;opacity:1;transition:grid-template-rows .35s,opacity .3s}.faq-answer>div{min-height:0;overflow:hidden}.faq-answer p{font-size:17px;line-height:1.65;padding:0 25px 28px}.faq-ready .faq-answer[aria-hidden=true]{grid-template-rows:0fr;opacity:0}.faq-item.open{background:#0b485a;color:white;border-color:#0b485a}.faq-item.open .faq-symbol{background:var(--coral);border-color:var(--coral);color:var(--night)}
#page-notice{width:calc(100% - 48px);max-width:480px;border:1px solid #6598a8;background:var(--navy);color:white;padding:32px;border-radius:12px}#page-notice::backdrop{background:#021824d9}#page-notice h2{font-size:27px}#page-notice p{font-size:17px;margin:22px 0;color:var(--soft)}#page-notice:target{display:block;position:fixed;left:50%;top:20%;transform:translateX(-50%);z-index:50}.no-js-close{display:block;font-size:13px;margin-top:20px;text-decoration:underline}.js .no-js-close{display:none}
/* Progressive FAQ: collapsed before deferred JS; readable without scripting. */
.faq-static{display:block;padding:23px 25px;font:600 17px/1.5 var(--body)}.faq-button{display:none}.js .faq-button{display:flex}.js .faq-static{display:none}.js .faq-item:not(.open) .faq-answer{grid-template-rows:0fr;opacity:0}
/* Native modal proposal drawer; this prototype never transmits form data. */
.proposal-tab{display:none}.js .proposal-tab{display:block;position:fixed;right:0;top:43%;z-index:30;writing-mode:vertical-rl;transform:rotate(180deg);padding:23px 13px;background:var(--coral);color:#072531;border:1px solid #ffc1b1;border-radius:0 8px 8px 0;font:700 11px var(--body);letter-spacing:.12em;box-shadow:0 8px 30px #00121b40;transition:padding .25s,background .25s}.proposal-tab:hover{background:var(--aqua);padding-inline:17px}.modal-open{overflow:hidden}.modal-open .proposal-tab{visibility:hidden}.proposal-drawer{position:fixed;inset:0 0 0 auto;margin:0;width:min(620px,100%);max-width:100%;height:100dvh;max-height:100%;padding:38px 40px;background:#082632;color:#fff;border:0;border-left:1px solid #71c8ca80;overflow-y:auto;overscroll-behavior:contain}.proposal-drawer::backdrop{background:#01151de3;backdrop-filter:blur(5px)}.proposal-drawer[open]{animation:drawer-enter .3s ease-out}.drawer-heading{position:relative;padding-top:15px}.drawer-heading .eyebrow{padding-right:45px}.drawer-heading h2{font-size:clamp(30px,3.5vw,42px);line-height:1.12;margin-bottom:20px;max-width:430px}.drawer-heading>p:last-child{font-size:14px;line-height:1.6;color:#c3dbe3;border-left:2px solid var(--coral);padding-left:15px}.drawer-close{position:absolute;right:-12px;top:-16px;width:44px;height:44px;display:grid;place-items:center;border:1px solid #69a2b5;border-radius:50%;color:var(--aqua);background:#0c3444;font-size:27px}.drawer-close:hover{background:var(--coral);color:var(--night)}.proposal-fields{display:grid;grid-template-columns:1fr 1fr;gap:21px 18px;margin-top:30px}.proposal-fields label{display:flex;flex-direction:column;gap:9px;font-size:13px;font-weight:500;color:#e3eff2}.proposal-fields input,.proposal-fields select,.proposal-fields textarea{width:100%;min-width:0;min-height:46px;border:1px solid #548594;border-radius:4px;background:#061e29;color:#fff;font:400 16px/1.5 var(--body);padding:11px 12px}.proposal-fields input::placeholder,.proposal-fields textarea::placeholder{color:#92b6c3}.proposal-fields textarea{resize:vertical;min-height:115px}.proposal-fields label:last-child{grid-column:1/-1}.proposal-fields input:focus-visible,.proposal-fields select:focus-visible,.proposal-fields textarea:focus-visible{outline:2px solid var(--aqua);outline-offset:3px;border-color:var(--aqua)}.proposal-required{font-size:12px;color:#adcbd6;margin:20px 0}.proposal-drawer form>.button{width:100%;justify-content:space-between;font-size:12px}.proposal-status:not(:empty){border:1px solid var(--aqua);padding:18px;font-size:15px;color:#ddf6f4;margin-top:20px}.proposal-drawer form>a{display:block;font-size:13px;color:var(--aqua);margin-top:22px;text-decoration:underline;overflow-wrap:anywhere}.no-script-contact{padding:24px;font-size:16px;color:var(--aqua)}html:not(.js) [data-proposal]{display:none}@keyframes drawer-enter{from{transform:translateX(100%)}to{transform:none}}
@supports(animation-timeline:view()){.finale-background{animation:coast-pan linear both;animation-timeline:view()}@keyframes coast-pan{from{transform:translateY(-25px)}to{transform:translateY(25px)}}}
.proposal-fields .field-wide{grid-column:1/-1}.proposal-fields label{display:block}.proposal-fields label>input,.proposal-fields label>select,.proposal-fields label>textarea{display:block;margin-top:9px}.required-note{font-size:12px;color:#adcbd6;margin:20px 0}.proposal-tab{text-transform:uppercase}.proposal-tab>span+span{margin-top:12px}
