/* The three form pages. Geometry follows the approved grid (handoff §1.3): 1248px content,
   96/24 lateral padding, 104/56 vertical, long copy constrained to 820px.
   The gold CTA is not restyled here: the Gravity Forms submit button joins the approved primary
   button rule in buttons.css, so there is one button component, not a lookalike. */

.form-page .content-width { width: min(1248px, calc(100% - 192px)); margin-inline: auto; }

/* Hero: same crop as the service hero, on institutional green. */
.page-hero--form { background: #003D34; color: #FFFFFF; padding-block: 104px; }
.page-hero--form h1 { color: #FFFFFF; }
.page-hero--form .eyebrow { color: #D4C59C; }
.page-hero--form .lead { color: #F2F0E9; }

.form-intro, .form-section { padding-block: 104px 0; }
/* Feedback v4: the opening question is a section title (h2 scale, green), centred with its text. */
.form-intro__lead { margin: 0 auto 24px; color: #00594B; max-width: 820px; }
.form-intro p { margin-inline: auto; }
/* Feedback v4: less empty space between the opening and the form, and after the form. */
.form-intro + .form-block { padding-block: 56px 72px; }
.form-intro + .form-block .form-block__layout { margin-top: 0; }
.form-intro p, .form-section p { max-width: 820px; }
.form-section .eyebrow { color: #7C6C34; }
.form-section h2 { margin-block: 8px 24px; }

/* Form block: the form beside its information column on desktop, stacked on mobile. */
.form-block { padding-block: 104px; }
.form-block > h2 { margin-block: 0 12px; }
.form-block > p { max-width: 820px; }
.form-block__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, var(--form-side, 342px)); gap: 64px; align-items: start; margin-top: 48px; }
.form-block__form { min-width: 0; }

/* Information column (Contatti). Addresses are real client content, set verbatim. */
.info-column { display: grid; gap: 24px; align-content: start; }
.info-group { display: grid; gap: 8px; }
.info-group .eyebrow { color: #7C6C34; margin: 0 0 4px; }
.info-address, .info-item { margin: 0; font-size: 16px; line-height: 1.62; }
.info-address + .info-address { margin-top: 12px; }
/* Feedback v4 (Silvia, 07/10): phone and e-mail read by their icon, no underline (hover keeps one). */
.info-item a { color: #00594B; text-decoration: none; }
.info-item a:hover { text-decoration: underline; text-underline-offset: .2em; }
.info-item a:focus-visible { outline: 2px solid #00594B; outline-offset: 3px; }

/* «Quando richiederlo»: the bullet is a gold rule, matching the prototype's graphic marker. */
.checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; max-width: 820px; }
.checklist li { position: relative; padding-left: 20px; font-size: 16px; line-height: 1.62; color: #23282A; }
.checklist li::before { content: ""; position: absolute; left: 0; top: calc(.81em - 4px); width: 8px; height: 8px; border-radius: 50%; background: var(--artesicura-gold-rule); }

.callout { margin-top: 12px; background: #00594B; border-radius: 8px; padding: 22px 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.callout h3 { margin: 0; color: var(--artesicura-gold-on-green); }
.callout p { margin: 0 0 8px; font-size: 16px; line-height: 1.62; color: #F2F0E9; opacity: .92; }
.form-notice { margin: 0 0 24px; }
.form-notice p { margin: 0; }

/* Secondary button (handoff §1.4): outline, never the gold fill. */
.button-secondary { display: inline-block; padding: 16px 28px; border: 1px solid #00594B; border-radius: 4px; color: #00594B; background: transparent; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; font-synthesis: none; transition: background-color 150ms ease, color 150ms ease; }
.button-secondary:is(:hover, :active) { background: #00594B; color: #FFFFFF; }
.button-secondary:focus-visible { outline: 2px solid #00594B; outline-offset: 4px; }

.offer-label { font-family: "Inter", sans-serif; font-size: 18px; font-weight: 600; color: #00594B; margin-block: 32px 24px; }

/* Numbered cards reuse the approved component from content.css: green card, crema copy, the
   number decorative at 16%. Only the grid and the top padding that gives the number room
   (handoff §1.6: 72/30/30/30) are added here, and only inside a form page, so the component
   keeps rendering identically everywhere else it is already used. */
.numbered-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.form-page .numbered-card { padding: 110px 28px 28px; display: flex; flex-direction: column; gap: 12px; }
.form-page .numbered-card h3 { color: var(--artesicura-gold-on-green); margin: 0; }
.form-page .numbered-card p { margin: 0; font-size: 14px; line-height: 1.56; opacity: .85; }

/* Gravity Forms: brand typography and fields. Only the submit button is shared with buttons.css. */
.gform_wrapper .gform_fields { display: grid; gap: 24px; }
.gform_wrapper .gfield_label { font-family: "Inter", sans-serif; font-size: 14px; font-weight: 600; color: #23282A; margin-bottom: 8px; display: block; }
.gform_wrapper .gfield_required { color: #8A3A2E; }
.gform_wrapper :is(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], select, textarea) {
  /* Gravity Forms pins these to a 38px height, which clips a 16px value inside 14px padding.
     height:auto hands sizing back to the padding, so the field is as tall as its content. */
  width: 100%; height: auto; padding: 14px 16px; border: 1px solid #E3DCCB; border-radius: 4px; background: #FFFFFF;
  font-family: "Inter", sans-serif; font-size: 16px; line-height: 1.5; color: #23282A;
}
/* The select keeps a visible native arrow; only its box is ours. */
.gform_wrapper select { appearance: auto; -webkit-appearance: auto; padding-right: 40px; }
.gform_wrapper textarea { min-height: 148px; resize: vertical; }
.gform_wrapper :is(input, select, textarea):focus-visible { outline: 2px solid #00594B; outline-offset: 2px; border-color: #00594B; }
.gform_wrapper ::placeholder { color: #8C8F8A; opacity: 1; }
.gform_wrapper :is(.gfield_checkbox, .gfield_consent) label { font-size: 16px; font-weight: 400; line-height: 1.5; color: #5B6360; }
/* The consent sentence is the checkbox label; the duplicated field label above it is noise. */
.gform_wrapper .gfield--type-consent > .gfield_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.gform_wrapper .gform_footer { margin-top: 32px; }
.gform_wrapper .gform_validation_errors { border: 1px solid #8A3A2E; border-radius: 4px; padding: 16px; background: #FFFFFF; color: #8A3A2E; }
.gform_wrapper .gfield_validation_message { color: #8A3A2E; font-size: 14px; margin-top: 6px; }

.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

@media (max-width: 64rem) {
  .numbered-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-block__layout { grid-template-columns: minmax(0, 1fr); gap: 48px; }
}

@media (max-width: 48rem) {
  .form-page .content-width { width: min(342px, calc(100% - 48px)); }
  .page-hero--form { padding-block: 56px; }
  .form-intro, .form-section { padding-block: 56px 0; }
  .form-block { padding-block: 56px; }
  .numbered-cards { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .form-page .numbered-card { padding: 110px 24px 24px; }
  .checklist li { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .button-secondary { transition: none; }
}

/* Lavora con noi — Figma 146:2. «Il ruolo» 840px (147:2, 104/80); «Perché collaborare» on the
   full-width #003D34 band (148:2: padding 96, gap 48, cards 360px centred); candidatura 720px. */
.form-section--prose { padding-block: 104px 80px; }
.form-page .form-section--prose { width: min(840px, calc(100% - 48px)); }
/* Feedback v4: section text at the service-page size; the eyebrow keeps its own (it read 20px). */
.form-section--prose p:not(.eyebrow) { font-size: var(--artesicura-text); line-height: var(--artesicura-text-line); }
.form-band { background: #003D34; color: #F2F0E9; }
.form-band__inner { width: min(1248px, calc(100% - 48px)); margin-inline: auto; padding-block: 96px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.form-band__inner > * { margin: 0; }
.form-band__inner > .eyebrow { color: #D4C59C; }
.form-band__inner > h2 { color: #FFFFFF; }
.form-band__inner > .lead { max-width: 820px; color: #F2F0E9; opacity: .9; }
.form-band .offer-label { margin-top: 32px; color: #FFFFFF; font-size: 18px; }
.form-band .numbered-cards { display: flex; flex-wrap: wrap; justify-content: center; gap: 32px; width: 100%; margin-top: 32px; }
.form-band .numbered-card { flex: 0 1 360px; }
.form-block--centered { padding-block: 96px 104px; }
/* Feedback v6 (Jp, 21/10): a form page ending with its form (Contatti, Lavora con noi) meets the footer rule
   at the divider distance (tokens.css), as every page on cream. */
.form-page:not(.landing) > .form-block:last-child { padding-bottom: var(--artesicura-divider-gap); }
.form-block--centered > h2 { margin-bottom: 12px; }
.form-block--centered > p { max-width: 720px; font-size: 16px; line-height: 1.62; }

/* Form card (Figma FormCard 129:3, 137:3, 151:7): white, hairline border, radius 10,
   padding 40, soft shadow; fields on ivory. Shared by the three forms. */
.form-block__form { background: #FFFFFF; border: 1px solid #E3DCCB; border-radius: 10px; padding: 40px; box-shadow: 0 12px 32px rgba(22, 40, 30, .08); }
.form-block--centered .form-block__layout { margin-top: 36px; }
.gform_wrapper :is(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], select, textarea) { background: #F2F0E9; padding: 15px 16px; }
.gform_wrapper .gfield_label { font-weight: 400; }
@media (max-width: 48rem) {
  .form-section--prose { padding-block: 56px; }
  .form-section--prose p { font-size: 16px; line-height: 1.62; }
  .form-band__inner { padding-block: 56px; }
  .form-band .numbered-card { flex-basis: 100%; }
  .form-block__form { padding: 24px; }
}

/* Contatti / Preventivi — Figma 128:2 / 136:2. */
.form-card__title { margin: 0 0 24px; color: #00594B; font-size: 30px; font-weight: 600; line-height: 1.2; }
.form-side { display: flex; flex-direction: column; align-items: stretch; gap: var(--artesicura-eyebrow-gap); }
.form-side > * { margin: 0; }
.form-side .eyebrow { color: #7C6C34; }
.form-side h2 { color: #00594B; font-size: 30px; font-weight: 600; line-height: 1.2; }
.form-white-band { background: #FFFFFF; margin-top: 0; }
/* Feedback v6 (Silvia, 20/10): «Cosa valutiamo» closer to the form (54px, was 96); the page ends at the
   footer rule's own distance (tokens.css), without the last line's margin. Only Preventivi has this band. */
.form-white-band .shared-block { padding-block: 54px var(--artesicura-divider-gap); }
.form-white-band .shared-block > :last-child { margin-bottom: 0; }
.info-group .eyebrow { margin-bottom: 8px; }

/* Gravity Forms fields as drawn in the form cards (151:8…152:7). */
.gform_wrapper .gform_fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 20px; row-gap: 18px; }
.gform_wrapper .gform_fields > .gfield { grid-column: 1 / -1; }
/* Nome and Cognome share a row in every form (all three start with them). The honeypot field
   (01/10) is the first child, so it is left out of the count. */
.gform_wrapper .gform_fields > .gfield:nth-child(-n+2 of :not(.gfield--type-honeypot)) { grid-column: auto; }
/* Messaggio / Presentati: 120px tall as in the form cards (Figma 129:19, 152:2). */
.gform-theme--framework.gform-theme.gform_wrapper .gfield textarea { height: 120px; min-block-size: 120px; block-size: 120px; }
/* Required marker: an asterisk on every required field (Jp, 2026-09-24). */
.gform_wrapper .gfield_required { margin-left: 2px; color: #8A3A2E; }
/* «Tipologia di opere» (137:3): the checkboxes read as pills; the real input stays focusable. */
.gform_wrapper .gfield--type-checkbox .gfield_checkbox { display: flex !important; flex-direction: row !important; flex-wrap: wrap; gap: 10px; }
.gform_wrapper .gfield--type-checkbox .gchoice { position: relative; }
.gform_wrapper .gfield--type-checkbox .gchoice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.gform_wrapper .gfield--type-checkbox .gchoice label { display: inline-block; margin: 0; padding: 8px 16px; border: 1px solid #978741; border-radius: 999px; font-size: 14px; line-height: 1.2; color: #00594B; background: transparent; }
.gform_wrapper .gfield--type-checkbox .gchoice input:checked + label { background: #00594B; border-color: #00594B; color: #FFFFFF; }
.gform_wrapper .gfield--type-checkbox .gchoice input:focus-visible + label { outline: 2px solid #00594B; outline-offset: 2px; }
/* CV upload (Figma 152:2): a 66px dashed gold drop area on ivory, «＋ Allega il tuo CV (PDF o Word,
   max 5MB)» centred in it. The field label is that line; the native input stays live and focusable,
   transparent over the whole area; the accepted-types line remains for screen readers. */
.gform_wrapper .gfield--type-fileupload { position: relative; }
.gform_wrapper .gfield--type-fileupload > .gfield_label { position: absolute; inset: 0 0 auto 0; z-index: 1; display: flex; align-items: center; justify-content: center; height: 66px; margin: 0; padding: 0 16px; font-size: 14px; font-weight: 400; color: #5B6360; pointer-events: none; }
.gform_wrapper .gfield--type-fileupload > .gfield_label::before { content: "+"; margin-right: 10px; font-size: 18px; line-height: 1; color: #5B6360; }
.gform_wrapper .gfield--type-fileupload .ginput_container { position: relative; height: 66px; padding: 0; border: 1.4px dashed #978741; border-radius: 6px; background: #F2F0E9; text-align: center; }
.gform_wrapper .gfield--type-fileupload .ginput_container:focus-within { outline: 2px solid #00594B; outline-offset: 2px; }
.gform_wrapper .gfield--type-fileupload input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.gform_wrapper .gfield--type-fileupload .gform_fileupload_rules { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* The chosen CV (feedback Jp 08/10): under the drop area, inside the same dashed card, one row
   «nome · dimensione   Rimuovi». The same row for a file just chosen (assets/js/file-upload.mjs) and for
   the file kept after a validation error on another field (artesicura-core, gform_file_upload_markup).
   The transparent input covers the drop area only, so «Rimuovi» stays clickable; choosing again replaces. */
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_container { display: flex; flex-direction: column; height: auto; min-height: 66px; padding-top: 63px; }
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload input[type="file"] { inset: 0 0 auto 0; height: 63px; }
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview_list { order: 1; width: 100%; margin: 0; border-top: 1px solid #E3DCCB; text-align: left; }
/* Gravity Forms' own «supera i limiti» message for a file over 5 MB: under the file row, not on the label. */
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_container > .validation_message:not(:empty) { order: 2; margin: 0; padding: 8px 16px 12px; font-size: 14px; text-align: left; }
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview_list:empty { display: none; }
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview {
  display: flex; flex-direction: row; align-items: center; gap: 12px; min-width: 0; margin: 0; padding: 8px 8px 8px 16px; border-radius: 0 0 6px 6px; background: #FFFFFF; font-size: 14px; line-height: 1.4;
}
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview .gfield_fileupload_filename { flex: 0 1 auto; min-width: 0; padding: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #23282A; font-size: 14px; font-weight: 500; }
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview .gfield_fileupload_filesize { flex: none; padding: 0; color: #5B6360; white-space: nowrap; }
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview button:is(.gform_delete_file, .artesicura-file-remove) {
  position: static; flex: none; margin: 0 0 0 auto; padding: 10px 8px; border: 0; background: none; color: #00594B; font: inherit; font-weight: 600;
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer; box-shadow: none; min-height: 0; inline-size: auto; block-size: auto;
}
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview button:is(.gform_delete_file, .artesicura-file-remove):hover { color: #003E34; }
.gform-theme--framework.gform-theme.gform_wrapper .gfield--type-fileupload .ginput_preview button:is(.gform_delete_file, .artesicura-file-remove):focus-visible { outline: 2px solid #00594B; outline-offset: 2px; }
@media (max-width: 64rem) { .form-block__layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 48rem) {
  .gform-theme--framework.gform-theme.gform_wrapper .gfield textarea { min-block-size: 110px; block-size: 110px; }
  .form-card__title { font-size: 26px; }
  .form-white-band .shared-block { padding-top: 56px; }
}

/* Campaign landings (30/09): two-step forms and the landing sections, with the site's tokens.
   «Successivo» uses the approved D03 primary button values; «Precedente» the outline secondary.
   Gravity Forms 3.1 renders them as <button> (2.9: <input type="button">): both forms are covered. */
.gform-theme--framework.gform-theme.gform_wrapper :is(input[type="button"], button).gform_next_button {
  border: 0; border-radius: 4px; padding: 16px 28px; background: var(--artesicura-button-fill); color: var(--artesicura-button-text);
  font-family: "Inter", sans-serif; font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: .06em; text-transform: uppercase;
  font-synthesis: none; cursor: pointer; appearance: none; -webkit-appearance: none; width: auto; height: auto; transition: background-color 150ms ease;
}
.gform-theme--framework.gform-theme.gform_wrapper :is(input[type="button"], button).gform_next_button:is(:hover, :active) { background: #8F7A2E; }
.gform-theme--framework.gform-theme.gform_wrapper :is(input[type="button"], button).gform_previous_button {
  border: 1px solid #00594B; border-radius: 4px; padding: 15px 27px; background: transparent; color: #00594B;
  font-family: "Inter", sans-serif; font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: .06em; text-transform: uppercase;
  cursor: pointer; appearance: none; -webkit-appearance: none; width: auto; height: auto;
}
.gform-theme--framework.gform-theme.gform_wrapper :is(.gform_next_button, .gform_previous_button):focus-visible { outline: 2px solid #003D34; outline-offset: 3px; }
.gform_wrapper .gform_page_footer { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; }
.gform_wrapper .gf_progressbar_wrapper { margin-bottom: 28px; }
.gform_wrapper .gf_progressbar_title { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #7C6C34; }
.gform-theme--framework .gf_progressbar { background: #E3DCCB; border-radius: 999px; }
.gform-theme--framework .gf_progressbar .gf_progressbar_percentage { background: #00594B; color: #FFFFFF; border-radius: 999px; }

.landing-steps { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 24px 48px; margin: 0 auto; padding: 32px 0 0; }
.landing-steps li { display: flex; align-items: center; gap: 14px; font-size: 16px; line-height: 1.5; }
.landing-steps__number { display: inline-grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; background: #00594B; color: #FFFFFF; font-weight: 600; }
.landing-book { align-items: flex-start; }
.landing-book__cover { display: block; width: 100%; max-width: 320px; height: auto; border-radius: 4px; box-shadow: 0 8px 24px #003D3420; }
.landing-book__facts { list-style: none; margin: 0; padding: 0; font-size: 15px; line-height: 1.7; }
.landing-book__partner { display: block; box-sizing: border-box; width: 100%; max-width: 320px; height: auto; padding: 14px 18px; border-radius: 4px; background: #003D34; }
.landing-book__note { font-size: 14px; color: #5B6361; }
.landing-closing { padding-bottom: 104px; text-align: center; }
.landing-closing h2 { margin-bottom: 16px; }
.landing-closing p { margin: 8px auto 0; max-width: none; text-align: center; }
.landing-brand .landing-brand__logo { display: block; width: 200px; height: auto; margin: 0 auto 20px; }
.landing-brand .related-services__links { justify-content: center; }
.landing-brand .related-services__links span { display: block; border: 1px solid #E3DCCB; border-radius: 999px; padding: 12px 20px; }
.landing-cards { padding-bottom: 8px; }
.landing-cards h2 { margin-bottom: 0; }
.landing-cards .service-card > div { display: flex; flex-direction: column; height: 100%; }

@media (max-width: 48rem) { .landing-closing { padding-bottom: 64px; } .landing-steps { justify-content: flex-start; } }

/* Preventivi (V7 r.559/566): the checklist's opening line and its closing sentence. */
.form-side .checklist-intro { font-size: 16px; line-height: 1.62; color: #23282A; }
/* Feedback v5 (Silvia, 13/10), Preventivi: a little more air between the list and «Perché Artesicura»
   (16px column gap + 24px, was 18 + 12), and «Dall'antico al contemporaneo» on the page's cream like the
   same section on Servizi and Expertise, not on a white band. */
.form-side .callout { margin-top: 24px; }
.form-white-band { background: transparent; }

/* Campaign landings, redesign (Jp, 30/09 sera): the page around the form on institutional green
   #003D34, compact, no crema sections. The form keeps its white card and its styles unchanged (Jp).
   Contrast on #003D34 (WCAG 2.x): white 12.23:1 for all small text; gold #978741 3.41:1 is used ONLY
   for the large title words (AA large text >= 3:1); the closing box rule is decorative. */
.form-page.landing { position: relative; isolation: isolate; background: #003D34; color: #FFFFFF; }
.landing__inner { width: min(1248px, calc(100% - 96px)); margin-inline: auto; padding-block: 40px 56px; }
.landing .content-width { width: auto; margin-inline: 0; }
.landing__title { margin: 0 0 32px; color: #FFFFFF; font-size: clamp(44px, 6.4vw, 92px); font-weight: 500; line-height: 1.02; letter-spacing: -.01em; overflow-wrap: normal; }
.landing__accent { color: #978741; }
/* Jp 09/10: the form column a little wider than the text (770px at 1440, the «6 mesi» pills on one row);
   62% keeps the text column readable between 1025 and 1300px. */
.landing__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, min(770px, 62%)); gap: 56px; align-items: start; }
.landing__aside { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.landing__aside > * { margin: 0; padding: 0; }
.landing .form-intro { padding: 0; }
.landing .form-intro p, .landing .form-intro__lead { margin: 0; max-width: 60ch; color: #FFFFFF; font-family: "Inter", sans-serif; font-size: 20px; font-weight: 400; line-height: 1.6; }
.landing .form-intro p + p { margin-top: 16px; }
.landing .landing-steps { flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 12px; margin: 0; padding: 0; }
.landing .landing-steps li { color: #FFFFFF; font-size: 17px; }
.landing .landing-steps__number { background: #FFFFFF; color: #003D34; }
.landing .landing-book { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 8px 24px; align-items: start; }
.landing .landing-book__cover { grid-row: span 3; max-width: 200px; box-shadow: 0 8px 24px rgba(0, 0, 0, .28); }
.landing .landing-book__facts { color: #FFFFFF; font-size: 15px; }
.landing .landing-book__partner { max-width: 240px; padding: 0; background: transparent; }
.landing .landing-book__note { margin: 0; color: #FFFFFF; font-size: 14px; }
.landing__form { min-width: 0; }
.landing .form-block__form { box-shadow: 0 12px 32px rgba(0, 0, 0, .22); }
.landing .form-card__title { font-size: 26px; }
.landing .landing-closing { margin-top: 20px; padding: 14px 20px; border: 1px solid #978741; border-radius: 4px; text-align: center; }
.landing .landing-closing h2 { margin: 0; color: #FFFFFF; font-family: "Inter", sans-serif; font-size: 17px; font-weight: 600; line-height: 1.4; letter-spacing: 0; }
.landing .landing-closing p { margin: 4px 0 0; color: #FFFFFF; font-size: 16px; font-weight: 600; }
.landing .landing-cards { width: min(1248px, calc(100% - 96px)); padding-block: 0 64px; }
.landing--ebook .landing__inner { padding-block: 64px 72px; }
.landing--ebook .landing__title { margin-bottom: 44px; }
.landing--ebook .landing__grid { gap: 72px; }
.landing--ebook .landing__aside { gap: 36px; }
/* The two steps sit above the form card (Jp, 30/09 sera), side by side, left-aligned. */
.landing .landing__form > .landing-steps { flex-direction: row; flex-wrap: wrap; gap: 14px 32px; margin: 0 0 24px; }
/* Jp 08/10: no border at all on the green landing; a transparent 1px one left a white rim round the photo. */
.landing .landing-cards .service-card { border: 0; }
/* The cards keep their own colours: the white page text must not leak into them. */
.landing .landing-cards .service-card { color: #5B6360; }

/* «6 mesi» (Jp, 09/10): the eyebrow above the title, the live page's bold lead, the six cards' heading on the green. */
.landing__eyebrow { margin: 0 0 16px; color: #FFFFFF; }
.landing--6-mesi .form-intro p.form-intro__lead { font-weight: 600; }
.landing .landing-cards h2 { margin: 0 0 40px; color: #FFFFFF; }
/* Its form starts with checkboxes on step 1 and the compound name field on step 2, not with Nome and
   Cognome: the site rule pairing the first two fields (above) would set them side by side. One column. */
.landing--6-mesi .gform_wrapper .gform_fields > .gfield:nth-child(n) { grid-column: 1 / -1; }

/* Biennale: the live page's Venice silhouette (assets/images/landing-venice.svg, white at 3%) over the
   green; title and copy on the left, the form card on the right from the top of the page. */
.landing--biennale::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../images/landing-venice.svg") no-repeat center bottom / cover; pointer-events: none; }
.landing--biennale .landing__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 640px); grid-template-rows: auto 1fr; column-gap: 56px; align-items: start; }
.landing--biennale .landing__grid { display: contents; }
.landing--biennale .landing__title { grid-column: 1; grid-row: 1; font-size: clamp(38px, 4.2vw, 60px); line-height: 1.08; margin-bottom: 28px; }
.landing--biennale .landing__aside { grid-column: 1; grid-row: 2; }
.landing--biennale .landing__form { grid-column: 2; grid-row: 1 / span 2; }

@media (max-width: 64rem) {
  .landing__grid, .landing--biennale .landing__inner { grid-template-columns: minmax(0, 1fr); }
  .landing--biennale .landing__grid { display: grid; gap: 32px; }
  .landing--biennale :is(.landing__title, .landing__aside, .landing__form) { grid-column: auto; grid-row: auto; }
  .landing__grid { gap: 32px; }
}
@media (max-width: 48rem) {
  .landing__inner { width: calc(100% - 48px); padding-block: 28px 40px; }
  .landing__title { margin-bottom: 20px; }
  .landing--biennale .landing__title { font-size: 34px; line-height: 1.12; }
  .landing--ebook .landing__title { font-size: 56px; }
  .landing--ebook .landing__inner { padding-block: 40px 48px; }
  .landing--ebook .landing__title { margin-bottom: 28px; }
  .landing--ebook .landing__grid { gap: 40px; }
  .landing .landing__form > .landing-steps { flex-direction: column; gap: 12px; margin-bottom: 20px; }
  .landing .form-intro p, .landing .form-intro__lead { font-size: 17px; }
  .landing .landing-book { grid-template-columns: 132px minmax(0, 1fr); gap: 6px 16px; }
  .landing .landing-book__cover { max-width: 132px; }
  .landing .landing-book__partner { max-width: 180px; }
  .landing .form-card__title { font-size: 24px; }
  .landing .landing-cards { width: calc(100% - 48px); padding-bottom: 40px; }
}

/* Feedback v5 (Silvia, 13/10) — landings, shared rules. */
/* The confirmation after sending was invisible: the green landing sets white text and the form's white card
   had no colour of its own, so Gravity Forms' message came out white on white (e-book, Biennale, «6 mesi»).
   The card now carries the body colour; labels and the card title keep their own. */
.landing .form-block__form { color: #5B6360; }
/* Biennale: more air under the menu bar, title, text and form a little lower (the e-book already has 64px). */
.landing--biennale .landing__inner { padding-top: 72px; }
/* Biennale: one field per row, as on «6 mesi». The site rule pairing the first two fields put «Nome e
   Cognome» beside the first select, so each of its two inputs had a quarter of the card and a long name
   could not be read in full. Nome and Cognome now share a whole row, like every other field. */
.landing--biennale .gform_wrapper .gform_fields > .gfield:nth-child(n) { grid-column: 1 / -1; }
@media (max-width: 48rem) { .landing--biennale .landing__inner { padding-top: 48px; } }

/* E-book: the live page's gold line drawing (assets/images/landing-ebook-linee.png, «disegno grafico»),
   twice as on the live site: top right and bottom left, behind the content and purely decorative. */
.landing--ebook { overflow: hidden; }
.landing--ebook::before, .landing--ebook::after { content: ""; position: absolute; z-index: -1; width: 1800px; height: 1800px; background: url("../images/landing-ebook-linee.png") no-repeat center / contain; pointer-events: none; }
.landing--ebook::before { top: -60px; right: -520px; transform: rotate(-275deg); }
.landing--ebook::after { bottom: 0; left: -460px; transform: rotate(270deg); }
@media (max-width: 48rem) {
  .landing--ebook::before, .landing--ebook::after { width: 900px; height: 900px; }
  .landing--ebook::before { top: -30px; right: -420px; }
  .landing--ebook::after { left: -240px; }
}

/* Feedback v6 (Silvia, 20/10) — landings. */
/* The three landings: «Nome e Cognome» and «Indirizzo» above the fields confused; only the sub-labels show
   (Nome, Cognome, Città, CAP …), as on the live landings. The group label stays in the DOM, visually hidden,
   so the group and its required state are still announced. The site forms have no compound fields. */
.landing .gform_wrapper :is(.gfield--type-name, .gfield--type-address) > .gfield_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
/* «6 mesi»: no eyebrow any more, so the page starts like the e-book (64 / 40); the title on one line from
   1025px (it is 14.2 × its size wide: 6vw fits the column), balanced on two lines below; more air between
   the title, the text and the form. */
.landing--6-mesi .landing__inner { padding-top: 64px; }
.landing--6-mesi .landing__title { font-size: clamp(44px, 6vw, 84px); margin-bottom: 56px; }
/* The two opening sentences together, one empty line between the paragraphs after them, as on the live page. */
.landing--6-mesi .form-intro .form-intro__lead + p { margin-top: 0; }
.landing--6-mesi .form-intro p + p { margin-top: 1.6em; }
@media (max-width: 64rem) { .landing--6-mesi .landing__grid { gap: 48px; } }
@media (max-width: 48rem) {
  .landing--6-mesi .landing__inner { padding-top: 40px; }
  .landing--6-mesi .landing__title { margin-bottom: 32px; }
}
