/* Inquiry form shared by the service pages, /web-design and /islandbook.
   It takes its colours from the section around it through the --band-* variables;
   .inquiry-form--light switches the lines and hints for a light section. */
.inquiry-form{--f-text:var(--band-text,#e6dfcf);--f-muted:var(--band-muted,#a9ada6);--f-accent:var(--band-accent,#cfb783);--f-ground:var(--band,#17212a);--f-line:#ffffff38;--f-frame:#ffffff2b;--f-inner:#ffffff12;--f-hint:#ffffff4d;--f-ink:#17110a;--f-error:#f0c7a8;text-align:left;position:relative;border:1px solid var(--f-frame);padding:clamp(26px,3.4vw,48px)}
.inquiry-form:after{content:'';position:absolute;inset:6px;border:1px solid var(--f-inner);pointer-events:none}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 34px}
.field{display:flex;flex-direction:column;gap:10px;min-width:0}
.field.wide{grid-column:1/-1}
.field>span{font:600 8.5px/1.4 var(--data);letter-spacing:.18em;text-transform:uppercase;color:var(--f-muted)}
.field>span i{font-style:normal;letter-spacing:.1em;opacity:.7;margin-left:6px}
.field input,.field select,.field textarea{width:100%;min-width:0;border:0;border-bottom:1px solid var(--f-line);border-radius:0;background:transparent;color:var(--f-text);padding:8px 0 11px;font:400 20px/1.35 var(--label);transition:border-color .2s}
.field textarea{border:1px solid var(--f-line);padding:13px 14px;min-height:132px;resize:vertical;font-size:18px;line-height:1.55}
.field select{appearance:none;cursor:pointer;background:linear-gradient(45deg,transparent 50%,currentColor 50%) right 6px center/6px 6px no-repeat,linear-gradient(-45deg,transparent 50%,currentColor 50%) right 0 center/6px 6px no-repeat;padding-right:24px}
.field select option{color:#1d160d;background:#f4f0e8}
.field input::placeholder,.field textarea::placeholder{color:var(--f-hint)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--f-accent)}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{box-shadow:0 1px 0 var(--f-accent)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:36px}
.form-status{flex:1 1 220px;font:400 14px/1.6 var(--body);color:var(--f-muted)}
.inquiry-form[data-state="error"] .form-status{color:var(--f-error)}
.form-sent{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:20px;padding:clamp(26px,4vw,56px);background:var(--f-ground);outline:0}
.form-sent h3{font:400 clamp(44px,4.4vw,64px)/1 var(--label);letter-spacing:-.04em;color:var(--f-text)}
.form-sent p{font:400 16px/1.8 var(--body);color:var(--f-muted);max-width:400px}
.form-sent button{margin-top:10px;background:none;border:0;border-bottom:1px solid currentColor;padding:6px 0;font:500 9px/1.5 var(--data);letter-spacing:.14em;text-transform:uppercase;color:var(--f-accent);cursor:pointer}
.form-send{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:space-between;gap:34px;min-height:52px;padding:0 20px 0 24px;border:1px solid;background:var(--f-accent);border-color:var(--f-accent);color:var(--f-ink);--f-fill:#faf8f3;font:600 9px/1 var(--data);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;cursor:pointer;overflow:hidden;transition:color .35s,border-color .35s}
.form-send:before{content:'';position:absolute;inset:0;z-index:-1;background:var(--f-fill);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.76,0,.24,1)}
.form-send:after{content:'';position:absolute;inset:3px;border:1px solid currentColor;opacity:.2;pointer-events:none}
.form-send:hover:before{transform:scaleX(1)}
.form-send b{font:400 18px/0 var(--label)}
.form-send[disabled]{opacity:.6;cursor:progress}
.inquiry-form--light{--f-line:#24362c4d;--f-frame:#24362c40;--f-inner:#24362c14;--f-hint:#24362c73;--f-ink:#f6f2e7;--f-error:#9b3d22}
.inquiry-form--light .form-send{--f-fill:#1c2a22}
@media(max-width:700px){
  .field-grid{grid-template-columns:1fr;gap:26px}
  .inquiry-form{padding:24px 20px 28px}
}
@media(prefers-reduced-motion:reduce){.form-send,.form-send:before{transition:none}}