/*
Theme Name: Icaro Project Theme
Theme URI: https://example.com/icaro-theme
Author: AI Assistant
Author URI: https://example.com
Description: A minimal WordPress block theme that recreates the original Icaro Project landing page design.  
This theme uses the full site editor (FSE) architecture available since WordPress 6.8+ and provides separate header and footer template parts so you can create additional pages that inherit the same structure.  
Version: 1.0
Requires at least: 6.8
Tested up to: 6.8.3
Requires PHP: 7.4
*/

/*
 * Global CSS copied from the provided index.html.  
 * The root custom properties, layout rules and dark colour palette are preserved verbatim to maintain the
 * exact look and feel of the original page. Adjustments were made only to remove references to
 * missing images.  
 */

:root{
  /* Palette */
  --bg: #0b0f14;
  --text: #e8eef6;
  --muted: #9aa7b3;
  --accent: #c9a24a;
  --surface: rgba(255,255,255,0.04);
  --ring: rgba(201,162,74,0.25);
  --maxw: 1140px;
  --radius: 16px;

  /* Orbital ellipse params */
  --orb1-w: 96%;
  --orb1-h: 70%;
  --orb1-tilt: 18deg;

  --orb2-w: 78%;
  --orb2-h: 54%;
  --orb2-tilt: -12deg;

  /* Motion toggle (set to 0 for reduced motion) */
  --motion: 1;
}

/* Reset */
*{ box-sizing:border-box }
html,body{ height:100% }
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: var(--bg); color: var(--text); line-height:1.5;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img{ max-width:100%; display:block }
a{ color:inherit; text-decoration:none }

/* Visible keyboard focus */
:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Background */
.bg{
  position: fixed; inset: 0; z-index: -2; pointer-events:none;
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(201,162,74,0.12), transparent 60%),
    radial-gradient(900px 520px at 15% 80%, rgba(81,94,115,0.25), transparent 60%),
    radial-gradient(900px 520px at 85% 40%, rgba(201,162,74,0.10), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,0.00), rgba(0,0,0,0.6)),
    var(--bg);
}
.noise{
  position:fixed; inset:0; opacity:0.06; mix-blend-mode:soft-light; pointer-events:none; z-index:-1;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160" viewBox="0 0 160 160"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="2" stitchTiles="stitch"/></filter><rect width="160" height="160" filter="url(%23n)" opacity="0.5"/></svg>');
  background-size:300px 300px;
}

/* Header */
header{
  position:sticky; top:0; z-index:50; backdrop-filter:blur(8px);
  background:linear-gradient(to bottom,rgba(0,0,0,0.45),rgba(0,0,0,0));
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.bar{ max-width:var(--maxw); margin:0 auto; padding:16px 20px; display:flex; align-items:center; gap:16px }
.brand{ display:flex; align-items:center; gap:12px; margin-right:auto }
.brand img{ width:40px; height:auto; filter:drop-shadow(0 0 16px rgba(201,162,74,0.18)) }
.brand span{ font-weight:700; letter-spacing:0.09em; text-transform:uppercase; font-size:13px; opacity:0.95 }
nav{ display:flex; gap:18px; align-items:center }
nav a{ color:var(--muted); font-size:14px }
nav a:hover{ color:var(--text) }
.cta-top{
  border:none; cursor:pointer; font-weight:600;
  padding:10px 14px; border-radius:10px; color:#0b0f14;
  background:linear-gradient(180deg,#e9c974,#c9a24a);
  box-shadow:0 8px 25px rgba(201,162,74,0.35),0 1px 0 rgba(255,255,255,0.15) inset;
}

/* Main */
main{ min-height:100svh; display:grid; place-items:center; padding:40px 20px 80px }
.hero{ max-width:var(--maxw); width:100%; display:grid; grid-template-columns:1fr; gap:48px; align-items:center }

/* Card */
.card{
  position:relative;
  padding:clamp(24px,4vw,44px);
  border-radius:calc(var(--radius) + 4px);
  background:linear-gradient(180deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));
  border:1px solid rgba(255,255,255,0.07);
  box-shadow:0 10px 30px rgba(0,0,0,0.45);
  overflow:hidden;
  display:grid;
  grid-template-columns: 1.5fr 1fr;
  gap:clamp(20px,4vw,40px);
  align-items:center;
}
.card:before{
  content:""; position:absolute; inset:-2px; border-radius:inherit;
  box-shadow:0 0 0 1px var(--ring) inset; pointer-events:none;
}

/* Text */
.card-text{ display:grid; gap:14px; align-content:start; max-width:62ch }
.chip{
  border:1px solid rgba(255,255,255,0.08); background:var(--surface); color:var(--muted);
  padding:8px 12px; border-radius:999px; font-size:12px; width:max-content;
}
h1{ font-size:clamp(34px,4.6vw,62px); line-height:1.05; margin:0 0 14px; letter-spacing:-0.01em; word-break:break-word; hyphens:auto }
.lead{ font-size:clamp(16px,1.2vw,18px); color:var(--muted); margin:0 0 22px }
.cta{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; justify-content:flex-start }
.cta input[type="email"]{
  background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12);
  color:var(--text); padding:14px 14px; border-radius:12px; min-width:280px; outline:none;
}
.cta input::placeholder{ color:#adb9c6 }
.btn{
  border:none; cursor:pointer; font-weight:600;
  padding:14px 18px; border-radius:12px; color:#0b0f14;
  background:linear-gradient(180deg,#e9c974,#c9a24a);
  box-shadow:0 8px 25px rgba(201,162,74,0.35),0 1px 0 rgba(255,255,255,0.15) inset;
  transition:transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.btn:hover{ transform:translateY(-2px); filter:saturate(1.06); box-shadow:0 12px 30px rgba(201,162,74,0.45) }
.btn:active{ transform:translateY(0) scale(0.99) }
.disclaimer{ font-size:12px; color:#8794a3; margin-top:10px }

/* Accessibility */
.sr-only{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Logo + orbits */
.seal{ display:grid; place-items:center; }
.card .seal.in-card{ grid-column:2; justify-self:center; align-self:center; }
.seal.in-card .seal-wrap{
  position:relative; width:min(460px,42vw); aspect-ratio:1/1;
  display:grid; place-items:center; overflow:visible;
}
.seal.in-card img{
  position:relative; z-index:1; width:66%; max-width:380px; height:auto;
  filter:drop-shadow(0 0 24px rgba(201,162,74,0.18));
}
.orb{
  position:absolute; border-radius:50%;
  box-shadow:0 0 0 2px rgba(201,162,74,0.25) inset; opacity:0.7; z-index:0;
}

/* Elliptical orbits (paused when reduced motion) */
.seal.in-card .orb.one{
  width:var(--orb1-w);
  height:var(--orb1-h);
  transform:rotate(var(--orb1-tilt));
  animation: orbit-ellipse-1 28s linear infinite;
  animation-play-state: calc(var(--motion)) == 1 ? running : paused;
}
.seal.in-card .orb.two{
  width:var(--orb2-w);
  height:var(--orb2-h);
  transform:rotate(var(--orb2-tilt));
  animation: orbit-ellipse-2 36s linear infinite;
  animation-play-state: calc(var(--motion)) == 1 ? running : paused;
}
@keyframes orbit-ellipse-1{
  0%{ transform:rotate(var(--orb1-tilt)); }
  100%{ transform:rotate(calc(var(--orb1-tilt) + 360deg)); }
}
@keyframes orbit-ellipse-2{
  0%{ transform:rotate(var(--orb2-tilt)); }
  100%{ transform:rotate(calc(var(--orb2-tilt) + 360deg)); }
}

/* Footer */
footer{ border-top:1px solid rgba(255,255,255,0.08); color:var(--muted); }
.foot{ max-width:var(--maxw); margin:0 auto; padding:24px 20px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap }
footer a{ color:var(--muted); border-bottom:1px dashed rgba(255,255,255,0.15) }
footer a:hover{ color:var(--text) }

/* Mobile */
@media (max-width:980px){
  .card{ grid-template-columns:1fr; gap:20px; text-align:center }
  .card .seal.in-card{ grid-column:1; order:1 }
  .card-text{ order:2; justify-self:center }
  .card-text .cta{ justify-content:center }
  .seal.in-card .seal-wrap{ width:min(380px,80vw) }
}

/* Desktop: single-viewport layout with persistent footer; merged duplicate blocks */
@media (min-width: 981px){
  html, body{
    height: 100dvh;
    overflow: hidden;
  }
  body{
    display: grid;
    grid-template-rows: auto 1fr auto;  /* header | main | footer */
  }
  main{
    min-height: 0;
    overflow: hidden;
    display: grid;
    place-items: center;
    padding: clamp(16px, 3vh, 32px) 20px;
  }
  .hero{
    min-height: 0;
    display: grid;
    place-items: center;
    gap: clamp(16px, 3vh, 40px);
  }
}

/* Reduced motion: disable orbit animations and entrance effects */
@media (prefers-reduced-motion: reduce){
  :root{ --motion: 0 }
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}


/* --- WPForms nella hero Icaro --- */

/* --- WPForms nella hero Icaro --- */

/* reset wrapper per evitare spostamenti strani */
.cta .wpforms-container,
.cta .wpforms-container-full,
.cta .wpforms-container form,
.cta .wpforms-container-full .wpforms-form,
.cta .wpforms-field-container,
.cta .wpforms-submit-container,
.cta .wpforms-field {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}


/* il form segue il layout .cta (fila su desktop, wrap su mobile) */
.cta .wpforms-container form {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
}

/* i due blocchi (campo e bottone) non devono essere full width */
.cta .wpforms-field-container,
.cta .wpforms-submit-container {
  width: auto !important;
}

/* input email – stesso stile dell’originale */
.cta .wpforms-field input[type="email"] {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: var(--text) !important;
  padding: 14px 14px !important;
  border-radius: 12px !important;
  width: 280px !important;
  max-width: 280px !important;
  min-width: 280px !important;
  outline: none !important;
  box-shadow: none !important;
}

/* bottone dorato – override totale su WPForms */
.cta button,
.cta input[type="submit"],
.cta .wpforms-submit-container .wpforms-submit {
  border: none !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  padding: 14px 18px !important;
  border-radius: 12px !important;
  color: #0b0f14 !important;
  background: linear-gradient(180deg,#e9c974,#c9a24a) !important;
  box-shadow:
    0 8px 25px rgba(201,162,74,0.35),
    0 1px 0 rgba(255,255,255,0.15) inset !important;
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease !important;
  height: auto !important;
  margin: 0 !important;
}

.cta button:hover,
.cta input[type="submit"]:hover,
.cta .wpforms-submit-container .wpforms-submit:hover {
  transform: translateY(-2px) !important;
  filter: saturate(1.06) !important;
  box-shadow: 0 12px 30px rgba(201,162,74,0.45) !important;
}

/* niente label sopra */
.cta .wpforms-field-label {
  display: none !important;
}