/* Form spacing: close relationships 8px; fields 24px; sections/actions 32px. */
.hero-capture,#brief-dialog{--form-label-gap:8px;--form-field-gap:24px;--form-section-gap:32px;--form-inset:16px}
.hero-sequence{position:relative;isolation:isolate;--url-row-end-scale:.7307692308;--url-row-collapse:-28px}
.hero-form-anchor{width:min(650px,100%);min-height:104px}
.hero-capture{position:relative;width:100%;margin:0;color:var(--navy)}
.hero-url-row{display:flex;align-items:center;gap:18px;height:104px;background:#fff;border:1px solid #d3def5;border-radius:18px;padding:10px 10px 10px 20px;box-shadow:0 10px 30px #1950ed0d}
.hero-url-icon{display:grid;place-items:center;color:var(--blue);flex:none}
.hero-url-icon .icon{width:30px;height:30px}
.hero-url-field{flex:1;min-width:0}
.hero-url-field label{display:block;font-size:17px;line-height:1.3;font-weight:600;color:#657086;margin-bottom:4px}
.hero-url-field input{display:block;width:100%;min-height:38px;height:38px;padding:0;background:none;border:0;border-radius:3px;outline-offset:3px;font-size:26px;color:var(--navy)}
.hero-url-field input::placeholder{color:#8a93a3}
.hero-next{display:flex;align-items:center;justify-content:center;gap:12px;flex:none;background:var(--gold);height:68px;padding:0 22px;border-radius:12px;color:var(--navy);font-size:20px;font-weight:700;transition:transform .18s ease-out}
.hero-next:hover{transform:translateX(2px)}
.hero-next .icon{width:20px;height:20px}
.hero-expanded-heading,.hero-expanded-extra,.hero-morph-backdrop,.hero-morph-art,.hero-morph-back,.hero-morph-zone{display:none}
.hero-sequence .hero-reassurance{margin:15px 0 0;padding:0;list-style:none;flex-wrap:wrap;gap:8px 18px}
.hero-reassurance>li{display:flex;align-items:center;gap:6px}
.hero-reassurance>li .icon{flex:none}
.hero-sequence .hero-copy{animation:none}
/* One input survives the whole transition; movement uses transform and opacity. */
.hero-sequence.has-morph{height:260svh;margin-top:calc(-1 * var(--hero-header-space,0px));view-timeline:--hero-morph block;view-timeline-inset:0;overflow:clip}
.has-morph .hero-stage{position:sticky;top:0;height:100svh;padding-top:var(--hero-header-space,0px);isolation:isolate}
.has-morph .hero{min-height:0;height:calc(100svh - 92px);max-height:900px;padding-block:35px 55px}
.has-morph .hero-form-anchor{height:104px}
.has-morph .hero-capture{position:absolute;top:0;left:0;width:min(780px,calc(100vw - 36px));z-index:20;transform-origin:top left;animation:hero-field-morph linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.has-morph .hero-morph-backdrop{display:block;position:absolute;inset:0;z-index:10;background:var(--blue);border-radius:28px;transform-origin:top left;pointer-events:none;animation:hero-panel-morph linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.has-morph .hero{animation:hero-intro-away linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.has-morph .hero-expanded-heading{display:block;position:absolute;bottom:calc(100% + var(--form-section-gap));left:0;width:100%;color:#fff;opacity:0;animation:hero-form-arrive linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.hero-heading-copy>p{display:flex;align-items:center;gap:16px;font-size:12px;font-weight:600;margin-bottom:16px}
.hero-heading-copy>p>span{color:var(--gold);font-size:21px}
.hero-expanded-heading h2{font-size:clamp(38px,4.8vw,64px);line-height:1.04;font-weight:700}
.hero-expanded-heading h2>span{color:var(--gold)}
.has-morph .hero-expanded-extra{display:flex;flex-direction:column;gap:var(--form-field-gap);position:absolute;top:calc(100% + var(--form-field-gap));left:0;width:100%;color:#fff;opacity:0;animation:hero-extra-arrive linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.form-field>label{display:block;font-size:14px;line-height:20px;font-weight:600;margin:0 0 var(--form-label-gap)}
.hero-expanded-extra>*{flex-shrink:0}
.form-field textarea,.form-field input{display:block;margin:0}
.form-field .error{margin:8px 0 0}
.hero-expanded-extra textarea{height:112px;min-height:96px;max-height:192px;resize:vertical;background:#fff;border:0;border-radius:12px;font-size:16px;line-height:24px;padding:12px var(--form-inset)}
.hero-expanded-extra fieldset{border:0;padding:0;margin:17px 0}
.hero-finish.button{background:var(--gold);color:var(--navy);width:100%;min-height:56px;font-size:16px}
.hero-finish.button>.icon{background:var(--navy);color:#fff;width:36px;height:36px;padding:10px}
.hero-local-note{display:flex;justify-content:center;align-items:flex-start;gap:7px;font-size:11px;line-height:1.4;color:#e1e9ff;margin-top:14px}
.hero-local-note .icon{width:13px;height:13px;flex:none}
.hero-request-status{font-size:14px;padding-top:12px;color:#fff}
.hero-capture.is-expanded{color:#fff}
.hero-capture.is-expanded .error{color:#fff;background:#a12525;border-radius:6px;padding:6px 10px}
.hero-capture.is-expanded :focus-visible{outline-color:var(--gold)}
.hero-capture.is-expanded .hero-url-field input:focus-visible,.hero-capture.is-expanded textarea:focus-visible{outline-color:var(--navy)}
.has-morph .hero-morph-art{display:block;position:absolute;inset:0;z-index:10;overflow:hidden;pointer-events:none;opacity:0;animation:hero-art-arrive linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.hero-morph-art>span{position:absolute;right:4%;top:17%;font-size:110px;color:var(--gold);transform:rotate(15deg)}
.hero-morph-art i{position:absolute;width:360px;height:440px;right:-200px;bottom:-110px;border:2px solid #ffffff26;border-radius:36px;transform:rotate(-18deg)}
.hero-morph-art i:last-child{right:-115px;bottom:-150px;transform:rotate(-8deg)}
.has-morph .hero-morph-back{display:grid;place-items:center;position:absolute;right:32px;top:112px;z-index:30;width:38px;height:38px;border-radius:50%;border:1px solid #ffffff66;background:none;color:#fff;opacity:0;animation:hero-form-arrive linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.has-morph .hero-morph-zone{display:block;position:absolute;top:calc((100% - 100svh)*.76);bottom:0;left:0;width:1px;pointer-events:none}
@keyframes hero-panel-morph{0%{opacity:0;transform:translate(var(--source-x),var(--source-y)) scale(var(--panel-scale-x),var(--panel-scale-y))}22%{opacity:1}55%,100%{opacity:1;transform:translate(0,0) scale(1)}}
@keyframes hero-field-morph{0%{transform:translate(var(--source-x),var(--source-y)) scale(var(--field-scale))}55%,100%{transform:translate(var(--target-x),var(--target-y)) scale(1)}}
@keyframes hero-intro-away{0%{opacity:1}35%,100%{opacity:0}}
@keyframes hero-form-arrive{0%,43%{opacity:0;transform:translateY(15px)}65%,100%{opacity:1;transform:translateY(0)}}
@keyframes hero-extra-arrive{0%,50%{opacity:0;transform:translateY(25px)}70%,100%{opacity:1;transform:translateY(var(--url-row-collapse))}}
@keyframes hero-art-arrive{0%,50%{opacity:0;transform:translateY(40px) rotate(8deg)}75%,100%{opacity:1;transform:translateY(0) rotate(0)}}
@media(max-width:1100px){.hero-morph-art>span{right:2%;font-size:65px}.has-morph .hero-morph-back{right:20px}.hero-next{padding-inline:13px;gap:8px}.hero-url-row{gap:10px;padding-left:14px}}
@media(max-width:800px){
 .hero-next span{display:none}.hero-next{width:56px;height:56px;padding:0}
 .hero-sequence{--url-row-end-scale:.8260869565;--url-row-collapse:-16px}
 .hero-url-row{height:92px}.hero-url-field label{font-size:13px}.hero-url-field input{font-size:20px}.hero-url-icon .icon{width:24px;height:24px}
 .has-morph .hero{height:auto;max-height:none;padding-top:30px;gap:0}
 .has-morph .hero-visual{width:48%;max-width:240px;margin:20px auto 0}
 .has-morph .floating-label{display:none}.has-morph .hero h1{font-size:clamp(52px,12vw,82px)}
 .has-morph .hero-description{margin-bottom:20px}.has-morph .hero-reassurance{margin-top:8px}
 .hero-expanded-heading h2{font-size:39px}.hero-heading-copy>p{font-size:10px;margin-bottom:8px}
 .hero-expanded-extra fieldset{margin:12px 0}
 .hero-expanded-extra textarea{height:96px}.hero-finish.button{min-height:51px;font-size:14px}
 .hero-local-note{font-size:10px;margin-top:10px}.hero-morph-art>span{display:none}
 .has-morph .hero-morph-back{top:91px;right:18px;width:32px;height:32px}
 .hero-capture,#brief-dialog{--form-section-gap:24px}
}
#brief-dialog.hero-expanded-brief{width:100vw;height:100dvh;max-height:100dvh;max-width:none;margin:0;border:0;border-radius:0;padding:40px max(24px,calc((100vw - 780px)/2));background:var(--paper)}
@media(prefers-reduced-motion:reduce){.hero-sequence.has-morph{height:auto}.has-morph .hero-stage{height:auto;position:relative}.has-morph .hero{animation:none;opacity:1;transform:none;height:auto}.has-morph .hero-morph-backdrop,.has-morph .hero-morph-art{display:none}}



@media (min-height:700px) and (max-height:820px){
 .has-morph .hero-expanded-heading h2{font-size:38px}
 .has-morph .hero-heading-copy>p{font-size:10px;margin-bottom:8px}
 .hero-capture,#brief-dialog{--form-field-gap:16px;--form-section-gap:24px}
 .has-morph .hero-expanded-extra textarea{height:80px;min-height:80px}
 .has-morph .hero-expanded-extra fieldset{margin:12px 0}
 .has-morph .hero-finish.button{min-height:48px}
 .has-morph .hero-local-note{margin-top:10px}
}

/* Brand marks stay at the foot of the pinned opening scene. */
.hero-technology{display:flex;align-items:center;justify-content:space-between;gap:24px;list-style:none;padding:24px 0 28px;border-top:1px solid #10204414;color:#606b80}
.hero-technology li{display:flex;align-items:center;justify-content:center;gap:7px;flex:none;white-space:nowrap;font-size:22px;font-weight:600;line-height:1}
.hero-technology img{display:block;object-fit:contain;height:auto;filter:grayscale(1);opacity:.62}
.technology-anthropic img{width:143px}.technology-openai img{width:98px}.technology-google img{width:83px}
.technology-canva img{width:28px}.technology-higgsfield img{width:24px}.technology-analytics img{width:136px}
.hero-technology .technology-clarity{gap:6px;flex-direction:column;font-size:19px}.technology-clarity img{width:87px}
.has-morph .hero{height:calc(100svh - var(--hero-header-space,92px) - 100px)}
.has-morph .hero-technology{position:absolute;bottom:0;left:0;right:0;animation:hero-intro-away linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
@media(max-width:1100px){.hero-technology{gap:18px}.hero-technology li{font-size:18px}.technology-anthropic img{width:115px}.technology-openai img{width:83px}.technology-google img{width:70px}.technology-analytics img{width:116px}.technology-canva img{width:24px}.technology-higgsfield img{width:21px}}
@media(max-width:800px){
 .hero-technology{justify-content:center;flex-wrap:wrap;column-gap:28px;row-gap:18px;padding:18px 0 22px}
 .hero-technology li{font-size:16px}.technology-anthropic img{width:100px}.technology-openai img{width:72px}.technology-google img{width:61px}.technology-analytics img{width:100px}.technology-clarity img{width:65px}.hero-technology .technology-clarity{font-size:15px;gap:4px}
 .has-morph .hero{height:calc(100svh - var(--hero-header-space,72px) - 116px);grid-template-rows:auto minmax(0,1fr);padding-bottom:16px}
 .has-morph .hero-visual{height:100%;max-height:210px;width:auto;max-width:48%;margin:8px auto 0;align-self:center}
}
@media(max-width:540px){.hero-technology{column-gap:12px;row-gap:16px}.hero-technology li{font-size:14px}.technology-anthropic img{width:90px}.technology-openai img{width:66px}.technology-google img{width:56px}.technology-canva img{width:21px}.technology-higgsfield img{width:20px}.technology-analytics img{width:99px}}

@media(min-width:801px) and (max-height:850px){
 .has-morph .hero{padding-block:20px 24px}
 .has-morph .hero h1{font-size:clamp(64px,7vw,90px);margin-bottom:18px}
 .has-morph .hero-description{font-size:16px;line-height:1.5;margin-bottom:20px}
 .has-morph .hero-visual{width:min(100%,420px);height:auto;justify-self:center}
}

.phone-verification{margin:0}
.phone-verification-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.phone-verification label{display:block;font-size:14px;line-height:20px;font-weight:600;margin-bottom:var(--form-label-gap)}
.phone-input-row{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #d4dbe7;border-radius:12px;padding:4px 4px 4px var(--form-inset);height:56px}
.phone-input-row input{min-width:0;width:100%;height:42px;padding:0;border:0;border-radius:3px;background:none;color:var(--navy);font-size:16px;outline-offset:3px}
.phone-input-row button{display:flex;align-items:center;gap:8px;flex:none;height:46px;border-radius:8px;padding:0 12px;background:var(--light);color:var(--navy);font-size:13px;font-weight:600}
.phone-input-row button .icon{height:15px;width:15px}
.phone-verification .otp-field input{height:56px;min-height:56px;padding:12px 16px;text-align:center;font-size:16px;font-variant-numeric:tabular-nums;background:#f5f7fc;border:1px solid #c9d3e8;color:#637087;opacity:1;cursor:not-allowed}
.phone-input-row:has([aria-invalid=true]){border-color:#ab2424}
.phone-help{display:flex;align-items:flex-start;gap:8px;font-size:12px;line-height:18px;margin-top:8px}
.phone-help .icon{width:14px;height:14px;margin-top:2px;flex:none}
.otp-status{font-size:14px;line-height:1.4;margin:8px 0 0;color:var(--muted)}
.hero-expanded-extra .phone-help{color:#edf2ff}
.hero-expanded-extra .otp-status{color:#edf2ff}
.hero-capture.is-expanded .phone-input-row input:focus-visible{outline-color:var(--navy)}
@media(max-width:800px){
 .phone-verification-fields{grid-template-columns:minmax(0,1fr);gap:16px}
 .phone-input-row button{font-size:12px;padding:0 9px}
 .phone-input-row button .icon{display:none}
 .phone-verification .otp-field input{font-size:15px;padding-inline:6px}
}
@media (min-height:700px) and (max-height:820px){
 .has-morph .hero-expanded-heading h2{font-size:32px}
 .has-morph .hero-heading-copy>p{margin-bottom:8px}
 .has-morph .phone-help{margin-top:8px}
 .has-morph .hero-local-note{margin-top:8px}
}


.has-morph .hero-expanded-extra{left:-6px;width:calc(100% + 12px);padding:0 6px 8px;max-height:var(--hero-extra-max-height);overflow-y:auto;overscroll-behavior-y:auto;scrollbar-width:thin}
.hero-expanded-extra :focus-visible{outline-offset:3px}

.hero-finish.button>span,#brief-form>button[type=submit]>span{min-width:0;text-align:left;line-height:1.25;text-wrap:balance}
#brief-form>button[type=submit]{width:100%;gap:16px}
@media(max-width:540px){.hero-finish.button{gap:12px;padding-block:10px;min-height:62px;font-size:14px}}

.phone-verification .otp-field{width:min(220px,100%)}
@media(max-width:540px){
 .phone-input-row{display:grid;grid-template-columns:minmax(0,1fr);height:auto;gap:8px;padding:0;border:0;background:none}
 .phone-input-row input{height:56px;border:1px solid #d4dbe7;border-radius:12px;background:#fff;padding:0 var(--form-inset)}
 .phone-input-row button{width:100%;justify-content:center;height:48px;font-size:13px}
 .phone-input-row input[aria-invalid=true]{border-color:#ab2424}
}

html:not(.keyboard-navigation) :is(input,textarea):focus{outline:none;box-shadow:none}
html.keyboard-navigation :is(input,textarea):focus-visible{outline-width:2px;outline-offset:3px}

.form-assurances{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px;padding-top:16px;border-top:1px solid #ffffff40}
.form-assurances li{display:flex;align-items:flex-start;gap:9px;font-size:13px;font-weight:600;line-height:1.4;text-wrap:pretty}
.form-assurances .icon{width:21px;height:21px;padding:4px;flex:none;border-radius:50%;background:var(--gold);color:var(--navy)}
#brief-dialog .form-assurances{border-color:var(--line)}
@media(max-width:540px){.form-assurances{grid-template-columns:1fr;gap:10px;margin-top:16px;padding-top:14px}.form-assurances li{align-items:center;font-size:13px}.form-assurances .icon{width:19px;height:19px;padding:3px}}

/* Heading, assurances and fields share one aligned form width. */
.has-morph .hero-expanded-heading,.brief-heading{display:grid;grid-template-columns:minmax(0,1fr) 260px;column-gap:36px;row-gap:0;align-items:start}
.hero-expanded-heading .form-assurances,.brief-heading .form-assurances{grid-template-columns:1fr;margin:0;padding:0;border:0;gap:12px}
.hero-expanded-heading .form-assurances li,.brief-heading .form-assurances li{align-items:center;font-size:14px}
@media(min-width:801px){
 .hero-expanded-heading .form-assurances,.brief-heading .form-assurances{grid-column:2;grid-row:1;align-self:end}
}
@media(max-width:800px){
 .has-morph .hero-expanded-heading,.brief-heading{grid-template-columns:1fr;gap:16px}
 .hero-expanded-heading .form-assurances,.brief-heading .form-assurances{gap:8px}
 .hero-expanded-heading .form-assurances li,.brief-heading .form-assurances li{font-size:12px}
}

/* Text follows the same scroll timeline; the field never switches layouts. */
.has-morph .hero-url-field input,.has-morph .hero-url-field label,.has-morph .hero-next span{transform-origin:left center;animation:hero-field-text linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.has-morph .hero-url-field input{--text-end-scale:.6153846154;--text-end-y:-4px}
.has-morph .hero-url-field label{--text-end-scale:.8235294118;--text-end-y:2px}
.has-morph .hero-next span{--text-end-scale:.7;transform-origin:center}
@keyframes hero-field-text{0%{transform:translateY(0) scale(1)}55%,100%{transform:translateY(var(--text-end-y,0px)) scale(var(--text-end-scale),calc(var(--text-end-scale) / var(--url-row-end-scale)))}}
.has-morph .hero-url-row{transform-origin:top center;animation:hero-field-height linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.has-morph .hero-url-icon .icon,.has-morph .hero-next>.icon{--text-end-scale:.8;transform-origin:center;animation:hero-field-text linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
.has-morph #hero-url-error{animation:hero-field-spacing linear both;animation-timeline:--hero-morph;animation-range:contain 0% contain 100%}
@keyframes hero-field-height{0%{transform:scaleY(1)}55%,100%{transform:scaleY(var(--url-row-end-scale))}}
@keyframes hero-field-spacing{0%{transform:translateY(0)}55%,100%{transform:translateY(var(--url-row-collapse))}}
@media(max-width:800px){
 .has-morph .hero-url-field input{--text-end-scale:.8}
 .has-morph .hero-url-field label{--text-end-scale:1}
}

.hero-finish.button,#brief-form>button[type=submit]{display:flex;justify-content:center;width:60%;min-width:min(100%,320px);margin-inline:auto}

.hero-finish.button,#brief-form>button[type=submit]{margin-top:calc(var(--form-section-gap) - var(--form-field-gap))}
#brief-form{display:flex;flex-direction:column;gap:var(--form-field-gap)}
#brief-form .form-field input{height:56px;min-height:56px;padding-inline:var(--form-inset)}
#brief-form .form-field textarea{height:112px;min-height:96px;padding:12px var(--form-inset);line-height:24px}
#brief-dialog .dialog-note{margin:16px 0 var(--form-section-gap)}
.hero-request-status,#request-status{margin:0;padding:0}

/* Compact rhythm keeps the main action visible on ordinary phone screens. */
@media(max-width:800px) and (max-height:900px){
 .hero-capture,#brief-dialog{--form-field-gap:16px;--form-section-gap:24px}
 .has-morph .hero-expanded-heading h2{font-size:32px}
 .has-morph .hero-expanded-extra textarea{height:80px;min-height:80px}
}

@media(max-width:600px){
 .hero-sequence .hero-reassurance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));font-size:11px;gap:8px 12px}
 html[lang=pl] .hero-sequence .hero h1{font-size:11.8vw}
}