/* ══════════════════════════════════════════════════════════════
   travels.css — stili specifici della landing Travels - Drops of Memories
   Caricato DOPO /dropsofmemories/css/dom-core.css, solo dalla landing
   dropsofmemories/travels/. Nav, footer, card feature (.service-item)
   e tipografia di base arrivano da dom-core.css.
   ══════════════════════════════════════════════════════════════ */

/* ─── LINK IN CONTENUTO E FOCUS ─── */
.t-link { color: var(--accent); font-weight: 600; }
.t-link:hover { color: var(--accent2); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ─── BOTTONI STORE ─── */
.t-store-row { display: flex; gap: 1rem; flex-wrap: wrap; }
.t-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.95rem 1.9rem;
  border-radius: 8px;
  font: 500 1rem var(--font-body);
}
.t-btn svg { flex-shrink: 0; }
.t-btn-dark {
  background: var(--ink);
  border: 1px solid var(--ink);
  color: var(--cream);
  transition: transform 0.15s, box-shadow 0.2s;
}
.t-btn-dark:hover {
  color: var(--cream);
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(42, 38, 32, 0.25);
}
.t-btn-light {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  transition: border-color 0.2s, transform 0.15s, box-shadow 0.2s;
}
.t-btn-light:hover {
  color: var(--text);
  border-color: var(--accent);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(42, 38, 32, 0.12);
}

/* ─── TESTI RICORRENTI ─── */
.t-eyebrow {
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent);
  font-weight: 600;
  margin: 0 0 1.1rem;
}
.t-kicker {
  font-family: var(--font-head);
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 1rem;
}
.t-kicker-warm { color: var(--accent2); }
.t-microcopy { font-size: 0.9rem; color: var(--muted); margin: 0; }
.t-strong { color: var(--text); font-weight: 600; }
.t-figcap { text-align: center; font-size: 0.85rem; color: var(--muted); margin-top: 0.9rem; }

/* ─── HERO ─── */
.t-hero { padding: 150px 2rem 90px; }
.t-hero-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3.5rem 4.5rem;
}
.t-hero-copy { flex: 1 1 460px; min-width: 0; }
.t-hero h1 {
  font-size: clamp(38px, 5.2vw, 58px);
  line-height: 1.08;
  margin: 0 0 1.4rem;
  text-wrap: pretty;
}
.t-hero-sub {
  font-size: 1.15rem;
  color: var(--muted);
  margin: 0 0 2.2rem;
  max-width: 34em;
  text-wrap: pretty;
}
.t-hero .t-store-row { margin-bottom: 1.1rem; }
.t-hero-figure { flex: 0 1 320px; margin: 0 auto; min-width: 250px; }
.t-phone {
  border-radius: 42px;
  border: 10px solid var(--ink);
  background: var(--ink);
  box-shadow: 0 24px 60px rgba(42, 38, 32, 0.28);
  overflow: hidden;
}
.t-phone img { display: block; width: 100%; height: auto; border-radius: 32px; }

/* ─── IL PROBLEMA ─── */
.t-problem { padding: 90px 2rem; }
.t-problem-inner { max-width: 780px; margin: 0 auto; }
.t-problem h2 {
  font-size: clamp(1.9rem, 3.6vw, 2.8rem);
  line-height: 1.15;
  margin: 0 0 1.5rem;
  text-wrap: pretty;
}
.t-problem p { margin: 0 0 1.2rem; text-wrap: pretty; }
.t-problem p:last-child { margin-bottom: 0; }

/* ─── DIMOSTRAZIONE ─── */
.t-demo { padding: 30px 2rem 40px; }
.t-demo-inner {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 5.5rem;
}
.t-demo-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3rem 4rem;
}
.t-demo-row.reverse { flex-direction: row-reverse; }
.t-demo-copy { flex: 1 1 380px; min-width: 0; }
.t-demo-copy h3 {
  font-size: 1.7rem;
  line-height: 1.2;
  margin: 0 0 1rem;
  text-wrap: pretty;
}
.t-demo-copy p { font-size: 1rem; margin: 0; text-wrap: pretty; }
.t-demo-phone { flex: 0 1 290px; margin: 0 auto; min-width: 230px; }
.t-phone-sm {
  border-radius: 38px;
  border: 9px solid var(--ink);
  background: var(--ink);
  box-shadow: 0 18px 44px rgba(42, 38, 32, 0.22);
  overflow: hidden;
}
.t-phone-sm img { display: block; width: 100%; height: auto; border-radius: 29px; }
.t-demo-desktop { flex: 1 1 440px; margin: 0 auto; min-width: 260px; max-width: 560px; }
.t-browser {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.9rem;
  box-shadow: 0 14px 36px rgba(42, 38, 32, 0.14);
}
.t-browser-dots { display: flex; gap: 6px; margin: 0 0 0.7rem 0.2rem; }
.t-browser-dots span { width: 9px; height: 9px; border-radius: 50%; background: var(--border); display: block; }
.t-browser img { display: block; width: 100%; height: auto; border-radius: 8px; }

/* ─── LE TUE NOTE ─── */
.t-notes { padding: 90px 2rem 70px; }
.t-notes-inner {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3rem 4.5rem;
}
.t-notes-copy { flex: 1 1 400px; min-width: 0; }
.t-notes-copy h2 {
  font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  line-height: 1.15;
  margin: 0 0 1.2rem;
  text-wrap: pretty;
}
.t-notes-copy p { margin: 0 0 1.2rem; text-wrap: pretty; }
.t-notes-copy p:last-child { margin-bottom: 0; }
.t-note-side { flex: 1 1 340px; min-width: 260px; max-width: 460px; margin: 0 auto; }
.t-note-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2.2rem 2.4rem;
  box-shadow: 0 14px 36px rgba(42, 38, 32, 0.14);
  transform: rotate(-1deg);
}
.t-note-day {
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent);
  font-weight: 600;
  margin: 0 0 0.4rem;
}
.t-note-place {
  font-family: var(--font-head);
  font-weight: 500;
  font-size: 1.1rem;
  color: var(--heading);
  margin: 0 0 1rem;
}
.t-note-quote {
  font-family: var(--font-head);
  font-style: italic;
  font-weight: 300;
  font-size: 1.3rem;
  line-height: 1.5;
  color: var(--text);
  margin: 0;
  text-wrap: pretty;
}
.t-note-caption { text-align: center; font-size: 0.85rem; color: var(--muted); margin: 1.1rem 0 0; }

/* ─── CTA INTERMEDIA ─── */
.t-midcta { padding: 50px 2rem 80px; }
.t-midcta-inner { max-width: 780px; margin: 0 auto; text-align: center; }
.t-midcta-lead {
  font-family: var(--font-head);
  font-size: 1.35rem;
  font-weight: 400;
  color: var(--heading);
  margin: 0 0 1.6rem;
  text-wrap: pretty;
}
.t-midcta .t-store-row { justify-content: center; }
.t-midcta .t-microcopy { margin-top: 1.1rem; }

/* ─── I PRIMI CINQUE MINUTI ─── */
.t-steps {
  padding: 80px 2rem;
  background: rgba(251, 249, 243, 0.75);
  background: color-mix(in srgb, var(--surface) 75%, transparent);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.t-steps-inner { max-width: 980px; margin: 0 auto; }
.t-steps h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); margin: 0 0 0.8rem; text-wrap: pretty; }
.t-steps-sub { margin: 0 0 2.8rem; max-width: 38em; text-wrap: pretty; }
.t-steps-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.5rem;
}
.t-steps-note { font-size: 0.95rem; margin: 2.4rem 0 0; max-width: 44em; text-wrap: pretty; }

/* ─── PRIVACY ─── */
.t-privacy { padding: 90px 2rem; }
.t-privacy-inner { max-width: 780px; margin: 0 auto; }
.t-privacy h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); margin: 0 0 1.4rem; text-wrap: pretty; }
.t-privacy-sub { margin: 0 0 2.2rem; text-wrap: pretty; }
.t-privacy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 2rem 2.5rem;
}
.t-privacy-grid h3 { font-size: 1.1rem; margin: 0 0 0.5rem; }
.t-privacy-grid p { font-size: 0.93rem; line-height: 1.65; margin: 0; }

/* ─── CHIUSURA ─── */
.t-close { padding: 40px 2rem 110px; }
.t-close-inner { max-width: 980px; margin: 0 auto; text-align: center; }
.t-close .t-browser { max-width: 760px; margin: 0 auto 3rem; }
.t-close-drop { display: block; margin: 0 auto 1.3rem; }
.t-close h2 {
  font-weight: 300;
  font-size: clamp(1.9rem, 4vw, 3rem);
  margin: 0 0 1rem;
  text-wrap: pretty;
}
.t-close-sub { margin: 0 auto 2.2rem; max-width: 36em; text-wrap: pretty; }
.t-close .t-store-row { justify-content: center; margin-bottom: 1.1rem; }
.t-close .t-microcopy { margin: 0 0 2rem; }
.t-close-links {
  display: flex;
  gap: 1.75rem;
  flex-wrap: wrap;
  justify-content: center;
  font-size: 0.95rem;
}

/* ─── CTA STICKY (solo mobile) ─── */
#tsticky {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 90;
  gap: 0.7rem;
  padding: 0.7rem 1rem calc(0.7rem + env(safe-area-inset-bottom));
  background: rgba(246, 242, 234, 0.95);
  background: color-mix(in srgb, var(--cream) 95%, transparent);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--border);
  justify-content: center;
}
.t-btn-sticky {
  flex: 1 1 0;
  max-width: 220px;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.8rem 1rem;
  font: 500 0.92rem var(--font-body);
}

/* ─── MOBILE: nav a scomparsa + sticky ─── */
@media (max-width: 760px) {
  .nav-hamburger { display: flex; }
  .nav-links { display: none; }
  .nav-links.open {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    position: fixed;
    top: 82px;
    left: 0;
    right: 0;
    z-index: 200;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    padding: 1.6rem 2rem 2rem;
    box-shadow: 0 18px 40px rgba(42, 38, 32, 0.14);
  }
  .nav-overlay.open { display: block; }
  #tsticky { display: flex; }
  #tclose-pad { padding-bottom: 96px; }
}