/* =========================================================
   PHASE 1 — Landing (Chania)
   Converted from Adobe XD comp. Palette sampled from design.
   ========================================================= */

:root{
  --bg:           #080706;
  --gold:         #c9a763;   /* primary bronze/gold accent      */
  --gold-bright:  #dfd0af;   /* highlight glow                  */
  --send:         #b0976d;   /* SEND button bronze (from comp)  */
  --send-text:    #1c140b;   /* dark text on the gold button    */
  --field-bg:     #ffffff;
  --field-text:   #2a2018;
  --field-ph:     #9a8d7c;   /* placeholder warm grey           */
  --text:         #f3ede2;
  --text-muted:   #c9bdab;
  --maxw:         640px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:#080706;
  color:var(--text);
  font-family:"Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{ display:block; max-width:100%; }

a{ color:inherit; }

.visually-hidden{
  position:absolute !important;
  width:1px;height:1px;
  margin:-1px;padding:0;border:0;
  clip:rect(0 0 0 0);clip-path:inset(50%);
  overflow:hidden;white-space:nowrap;
}

/* ----------------------- HERO ----------------------- */
.hero{
  position:relative;
  background:#080706;
  line-height:0;            /* kill inline-image gap */
}

.hero__art{
  width:100%;
  height:auto;
  margin:0 auto;
}

/* transparent, keyboard-focusable scroll cue sitting over the
   baked-in chevron at the bottom-centre of the artwork */
.hero__scroll{
  position:absolute;
  left:50%;
  bottom:2.5%;
  transform:translateX(-50%);
  width:64px;height:48px;
  border-radius:8px;
  cursor:pointer;
}
.hero__scroll:focus-visible{
  outline:2px solid var(--gold-bright);
  outline-offset:4px;
}

/* --------------------- INTEREST --------------------- */
.interest{
  position:relative;
  padding:clamp(40px, 8vw, 90px) 20px clamp(56px, 9vw, 110px);
  background-color:#2a1d11;
  background-image:
      linear-gradient(180deg, rgba(18,12,6,.58) 0%, rgba(30,20,11,.26) 46%, rgba(16,10,5,.66) 100%),
      url("assets/wood-texture.jpg");
  background-size:cover;
  background-position:center;
}

.interest__inner{
  max-width:var(--maxw);
  margin:0 auto;
  text-align:center;
}

.interest__title{
  margin:0 0 .35em;
  font-weight:600;
  font-size:clamp(1.7rem, 4.5vw, 2.4rem);
  letter-spacing:.01em;
  color:#fff;
}

.interest__lead{
  margin:0 auto 2.2em;
  max-width:34ch;
  font-weight:300;
  font-size:clamp(.92rem, 2.4vw, 1rem);
  line-height:1.5;
  color:var(--text-muted);
}

/* ----------------------- FORM ----------------------- */
.form{ width:100%; }

.field{ margin-bottom:14px; }

.form input[type="text"],
.form input[type="email"],
.form textarea{
  width:100%;
  padding:14px 16px;
  border:1px solid transparent;
  border-radius:3px;
  background:var(--field-bg);
  color:var(--field-text);
  font:inherit;
  font-size:.95rem;
  transition:border-color .18s ease, box-shadow .18s ease;
}

.form textarea{ resize:vertical; min-height:120px; line-height:1.5; }

.form ::placeholder{ color:var(--field-ph); opacity:1; }

.form input:focus,
.form textarea:focus{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(201,167,99,.35);
}

.form input.is-invalid,
.form textarea.is-invalid{
  border-color:#d6694f;
  box-shadow:0 0 0 3px rgba(214,105,79,.30);
}

/* terms checkbox row */
.terms{
  display:flex;
  align-items:center;
  gap:9px;
  margin:14px 2px 22px;
  font-size:.82rem;
  font-weight:300;
  color:var(--text-muted);
  text-align:left;
  cursor:pointer;
}
.terms input{
  width:16px;height:16px;
  accent-color:var(--gold);
  flex:0 0 auto;
}
.terms__link{
  color:var(--gold);
  text-decoration:underline;
  text-underline-offset:2px;
}
.terms__link:hover{ color:var(--gold-bright); }

/* SEND button */
.btn-send{
  display:block;
  width:100%;
  padding:14px 16px;
  border:0;
  border-radius:3px;
  background:linear-gradient(180deg, #c0a779 0%, var(--send) 55%, #9c8158 100%);
  color:var(--send-text);
  font:inherit;
  font-weight:700;
  font-size:.9rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  cursor:pointer;
  transition:filter .18s ease, transform .06s ease;
}
.btn-send:hover{ filter:brightness(1.07); }
.btn-send:active{ transform:translateY(1px); }
.btn-send:focus-visible{
  outline:2px solid var(--gold-bright);
  outline-offset:3px;
}

.form__status{
  min-height:1.2em;
  margin:16px 0 0;
  font-size:.85rem;
  font-weight:400;
}
.form__status.is-ok{    color:#9ed29a; }
.form__status.is-error{ color:#e2876e; }

/* ------------------- RESPONSIVE --------------------- */
@media (max-width:600px){
  .interest{ padding-top:clamp(34px,9vw,60px); }
}

/* ------------------- A11Y / MOTION ------------------ */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ transition:none !important; }
}