/* ============================================================
   CMEasy — style.css   (Hero fiel ao design original + melhorias)
   ============================================================ */

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

:root {
  --bg:          #07080f;
  --bg2:         #0c0d1a;
  --panel:       #111326;
  --border:      #1e2240;
  --border2:     #2a2f5a;
  --green:       #00ff88;
  --green2:      #00cc6a;
  --cyan:        #00d4ff;
  --purple:      #8b5cf6;
  --purple2:     #6d28d9;
  --purple-dim:  rgba(109,40,217,.55);
  --text:        #c8cde8;
  --text2:       #7880a8;
  --white:       #eef0fa;
  --font-mono:   'Share Tech Mono', monospace;
  --font-head:   'Orbitron', monospace;
  --font-body:   'Rajdhani', sans-serif;
  --radius:      6px;
  --glow-green:  0 0 14px rgba(0,255,136,.5);
  --glow-cyan:   0 0 14px rgba(0,212,255,.4);
  --glow-purple: 0 0 20px rgba(139,92,246,.45);
}

html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 3px; }

/* ── OVERLAYS ── */
.scanlines {
  pointer-events: none;
  position: fixed; inset: 0; z-index: 9999;
  background: repeating-linear-gradient(to bottom, transparent 0, transparent 3px, rgba(0,0,0,.06) 3px, rgba(0,0,0,.06) 4px);
}
.grain {
  pointer-events: none;
  position: fixed; inset: 0; z-index: 9998;
  opacity: .028;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 200px 200px;
}

/* ── NAVBAR ── */
.navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; gap: 2rem;
  padding: .85rem 2.5rem;
  background: rgba(7,8,15,.82);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
}
/* Logo imagem — substitui o bloco verde anterior */
.logo-img {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: contain;
  border-radius: 6px;
  filter: drop-shadow(0 0 8px rgba(0,255,136,.45));
  transition: filter .3s, transform .3s;
  flex-shrink: 0;
}
.logo:hover .logo-img {
  filter: drop-shadow(0 0 18px rgba(0,255,136,.8));
  transform: scale(1.06);
}
.logo-img--footer {
  width: 32px;
  height: 32px;
  border-radius: 5px;
}
.nav-links { display: flex; gap: 1.8rem; margin-left: auto; }
.nav-links a {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: .78rem;
  letter-spacing: .13em;
  color: var(--text2);
  transition: color .25s;
}
.nav-links a:hover { color: var(--green); }
.nav-toggle { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; margin-left: auto; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--text); border-radius: 2px; transition: transform .3s, opacity .3s; }

/* ══════════════════════════════════════════════════════
   HERO
══════════════════════════════════════════════════════ */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 70px 0 0;
  overflow: hidden;
}

/* background SVG */
.hero-bg {
  position: absolute; inset: 0;
  pointer-events: none;
}
.topo-svg { width: 100%; height: 100%; object-fit: cover; }

/* ── FLOATING ICONS ── */
.floaters { position: absolute; inset: 0; pointer-events: none; z-index: 3; }
.floater {
  position: absolute;
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px;
  background: rgba(13,15,28,.72);
  border: 1px solid rgba(139,92,246,.35);
  border-radius: 10px;
  animation: float 6s ease-in-out infinite;
  opacity: .85;
  backdrop-filter: blur(6px);
  transition: opacity .3s, border-color .3s;
}
.floater:hover { opacity: 1; border-color: var(--green); }
.f1 { top: 18%; left:  6%; animation-delay: 0s;   animation-duration: 5.5s; }
.f2 { top: 22%; right: 5%; animation-delay: 1s;   animation-duration: 7s;   }
.f3 { top: 60%; left:  3%; animation-delay: 2s;   animation-duration: 6s;   }
.f4 { top: 72%; right: 7%; animation-delay: .5s;  animation-duration: 5s;   }
.f5 { top: 42%; right: 2%; animation-delay: 1.5s; animation-duration: 6.5s; }
.f6 { top: 80%; left: 12%; animation-delay: 2.5s; animation-duration: 7.5s; }
.f7 { top:  9%; right:16%; animation-delay: 3s;   animation-duration: 5.8s; }
.f8 { top: 50%; left:  1%; animation-delay: .8s;  animation-duration: 6.8s; }
@keyframes float {
  0%,100% { transform: translateY(0) rotate(0deg);    }
  33%      { transform: translateY(-14px) rotate(3deg); }
  66%      { transform: translateY(8px) rotate(-2deg);  }
}

/* scene corner icons */
.scene-ico { width: 18px; height: 18px; stroke: var(--cyan); fill: none; }
.si-left  { top: -32px; left: -48px; animation-delay: 0s;  }
.si-right { top: -26px; right: -48px; animation-delay: .8s; }
.scene-icon {
  position: absolute;
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  background: rgba(13,15,28,.82);
  border: 1px solid rgba(0,212,255,.35);
  border-radius: 9px;
  animation: float 5s ease-in-out infinite;
  backdrop-filter: blur(6px);
}

/* platform bar icons */
.pico { width: 15px; height: 15px; stroke: currentColor; fill: none; flex-shrink: 0; }
/* fill-only brand icons (Windows, Linux, Apple) */
.pico-fill { fill: currentColor; stroke: none; }

/* card icons */
.cico { width: 34px; height: 34px; stroke: currentColor; fill: none; }
.cico-fill { fill: currentColor; stroke: none; }

/* Windows/Linux/Apple override — always fill, never stroke */
svg.pico[data-brand],
svg.cico[data-brand],
svg.tico[data-brand],
svg.dico[data-brand] { fill: currentColor; stroke: none; }

/* tools grid icons */
.tico { width: 28px; height: 28px; stroke: currentColor; fill: none; transition: stroke .25s, fill .25s; }
.tool-item:hover .tico { stroke: var(--cyan); }
.tico.brand { fill: currentColor; stroke: none; }
.tool-item:hover .tico.brand { fill: var(--cyan); stroke: none; }

/* docs icons */
.dico { width: 28px; height: 28px; stroke: var(--cyan); fill: none; margin-bottom: .8rem; display: block; }
.dico.brand { fill: var(--cyan); stroke: none; }

/* mug SVG icon */
.mug-ico { width: 20px; height: 20px; stroke: var(--green); fill: none; }

/* floater SVG icon */
.fico { width: 20px; height: 20px; stroke: var(--green); fill: none; }

/* ══════════════════════════════════════════════════════
   SCENE — ilustração central
══════════════════════════════════════════════════════ */
.scene {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1200px;
  height: clamp(420px, 58vh, 600px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0;
  margin-top: 0;
  animation: sceneIn 1s .2s ease both;
}
@keyframes sceneIn {
  from { opacity:0; transform: translateY(30px); }
  to   { opacity:1; transform: translateY(0);    }
}

/* floor line */
.floor-line {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--purple-dim), var(--cyan), var(--purple-dim), transparent);
  box-shadow: 0 0 12px rgba(0,212,255,.3);
}

/* ── BOOKS ── */
.books {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  margin-right: clamp(14px, 2vw, 32px);
  padding-bottom: 0;
  flex-shrink: 0;
}
.book {
  position: relative;
  border-radius: 3px 0 0 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: default;
  transition: transform .3s;
}
.book:hover { transform: translateY(-8px); }
.book-1 { width: clamp(34px,3.2vw,52px); height: clamp(200px,28vh,310px); background: linear-gradient(160deg, #1a1f45 0%, #0f1230 100%); border: 1px solid #3d3f7a; }
.book-2 { width: clamp(30px,2.8vw,48px); height: clamp(170px,24vh,268px); background: linear-gradient(160deg, #1a2445 0%, #0f1a30 100%); border: 1px solid #2a3a5a; }
.book-3 { width: clamp(28px,2.6vw,46px); height: clamp(148px,21vh,236px); background: linear-gradient(160deg, #1f1a45 0%, #130f30 100%); border: 1px solid #3a2a5a; }
.book-spine {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--font-head);
  font-size: clamp(.38rem, .5vw, .5rem);
  letter-spacing: .16em;
  color: rgba(139,92,246,.75);
  text-transform: uppercase;
}
.book-bookmark {
  position: absolute;
  top: 0; right: 9px;
  width: 9px; height: 32px;
  background: var(--green);
  clip-path: polygon(0 0, 100% 0, 100% 85%, 50% 100%, 0 85%);
  box-shadow: var(--glow-green);
}

/* ── LAPTOP ── */
.laptop-scene {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 3;
  flex-shrink: 0;
}
.laptop-screen-outer {
  position: relative;
  width: clamp(360px, 44vw, 600px);
  background: #05060c;
  border: 2px solid #2a2f6a;
  border-bottom: none;
  border-radius: 12px 12px 0 0;
  padding: clamp(10px,1.2vw,16px);
  box-shadow:
    0 0 0 1px rgba(139,92,246,.2),
    0 -2px 60px rgba(139,92,246,.22),
    inset 0 0 30px rgba(0,0,0,.9);
  min-height: clamp(230px, 32vh, 340px);
}
.laptop-screen-inner {
  background: rgba(0,255,136,.025);
  border: 1px solid rgba(0,255,136,.1);
  border-radius: 5px;
  padding: clamp(10px,1.2vw,16px) 12px;
  min-height: clamp(200px, 28vh, 305px);
  overflow: hidden;
}
/* terminal inside laptop */
.laptop-terminal {
  font-family: var(--font-mono);
  font-size: clamp(.6rem, .8vw, .82rem);
  line-height: 1.8;
  color: var(--green);
}
.lt-line { display: flex; flex-wrap: wrap; gap: .25rem; }
.lt-prompt { color: var(--green); }
.lt-cmd    { color: #fff; }
.lt-cursor {
  display: inline-block;
  width: 7px; height: .85em;
  background: var(--green);
  vertical-align: text-bottom;
  animation: blink 1s step-end infinite;
}
.lt-out {
  padding-left: .5rem;
  color: rgba(0,255,136,.65);
  display: block;
  font-size: clamp(.55rem,.7vw,.72rem);
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }

/* scene corner FA icons near laptop top */
.scene-icon {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  background: rgba(13,15,28,.82);
  border: 1px solid rgba(0,212,255,.3);
  border-radius: 9px;
  animation: float 5s ease-in-out infinite;
  backdrop-filter: blur(6px);
}
.si-left  { top: -28px; left: -44px; animation-delay: 0s;  }
.si-right { top: -22px; right: -44px; animation-delay: .8s; }

.laptop-hinge {
  width: calc(clamp(360px, 44vw, 600px) + 24px);
  height: 6px;
  background: linear-gradient(90deg, #0d0f20, #1e2150, #0d0f20);
  border-left: 2px solid #2a2f6a;
  border-right: 2px solid #2a2f6a;
  border-bottom: 1px solid #3a3f7a;
}
.laptop-base-scene {
  width: calc(clamp(360px, 44vw, 600px) + 48px);
  height: 22px;
  background: linear-gradient(to bottom, #151730, #0a0c18);
  border: 2px solid #2a2f6a;
  border-top: none;
  border-radius: 0 0 10px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.laptop-base-logo {
  font-family: var(--font-head);
  font-size: .55rem;
  color: rgba(0,255,136,.3);
  letter-spacing: .2em;
}

/* Big C lettermark beside laptop */
.big-c {
  position: absolute;
  right: clamp(-60px, -6vw, -100px);
  bottom: 22px;
  font-family: var(--font-head);
  font-size: clamp(4rem, 6vw, 8rem);
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 2px rgba(0,255,136,.16);
  filter: drop-shadow(0 0 20px rgba(0,255,136,.1));
  animation: float 7s 1s ease-in-out infinite;
  pointer-events: none;
  user-select: none;
}

/* ── MUG ── */
.mug {
  margin-left: 28px;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mug-body {
  position: relative;
  width: 68px; height: 80px;
  background: linear-gradient(160deg, #181c3a, #0f1128);
  border: 2px solid #2a2f6a;
  border-radius: 6px 6px 10px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 20px rgba(0,0,0,.5);
}
.mug-label {
  font-family: var(--font-mono);
  font-size: .75rem;
  color: var(--green);
  text-shadow: var(--glow-green);
}
.mug-handle {
  position: absolute;
  right: -18px; top: 18px;
  width: 16px; height: 36px;
  border: 2px solid #2a2f6a;
  border-left: none;
  border-radius: 0 8px 8px 0;
}
.mug-steam {
  display: flex;
  gap: 6px;
  height: 30px;
  align-items: flex-end;
  margin-bottom: 3px;
}
.steam {
  display: block;
  width: 3px;
  border-radius: 3px;
  background: linear-gradient(to top, rgba(200,205,232,.4), transparent);
  animation: steam 2s ease-in-out infinite;
}
.s1 { height: 18px; animation-delay: 0s;   }
.s2 { height: 26px; animation-delay: .35s; }
.s3 { height: 16px; animation-delay: .7s;  }
@keyframes steam {
  0%   { transform: translateY(0)   scaleX(1);   opacity: .6; }
  50%  { transform: translateY(-8px) scaleX(1.4); opacity: .3; }
  100% { transform: translateY(-16px) scaleX(.8); opacity: 0; }
}

/* ══════════════════════════════════════════════════════
   PLATFORM BAR
══════════════════════════════════════════════════════ */
.platform-bar {
  position: relative;
  z-index: 4;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: .9rem;
  padding: .9rem 2rem;
  margin-top: 1px;
  width: 100%;
  background: rgba(7,8,15,.55);
  border-top: 1px solid var(--border);
  font-size: .8rem;
  color: var(--text2);
  animation: fadeUp .8s .7s ease both;
}
.plat { display: flex; align-items: center; gap: .4rem; }
.plat svg { flex-shrink: 0; }
.dot-sep  { color: var(--border2); }
.plat-divider { width: 1px; height: 22px; background: var(--border2); margin: 0 .3rem; }

/* Continuar */
.continuar-link {
  position: relative;
  z-index: 4;
  display: block;
  width: 100%;
  text-align: center;
  padding: .7rem 0;
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--cyan);
  letter-spacing: .14em;
  border-top: 1px solid var(--border);
  background: rgba(7,8,15,.4);
  transition: color .25s, background .25s;
  animation: fadeUp .8s .9s ease both;
}
.continuar-link:hover { color: var(--green); background: rgba(0,255,136,.03); }

@keyframes fadeUp {
  from { opacity:0; transform:translateY(12px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ══════════════════════════════════════════════════════
   SECTIONS (abaixo do hero — igual ao anterior)
══════════════════════════════════════════════════════ */
.section { padding: 6rem 2.5rem; border-top: 1px solid var(--border); }
.section--dark { background: var(--bg2); }
.section-inner { max-width: 1100px; margin: 0 auto; }
.section-label { font-family: var(--font-mono); font-size: .72rem; color: var(--cyan); letter-spacing: .18em; margin-bottom: .6rem; }
.section-title { font-family: var(--font-head); font-size: clamp(1.6rem,4vw,2.4rem); font-weight: 700; color: var(--white); margin-bottom: 2.5rem; }

/* cards */
.cards-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 1.4rem; }
.card { background: var(--panel); border: 1px solid var(--border); border-radius: 8px; padding: 1.8rem; position: relative; overflow: hidden; transition: border-color .3s, transform .3s, box-shadow .3s; }
.card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; }
.card--windows::before { background: linear-gradient(90deg,#00adef,#00d4ff); }
.card--linux::before   { background: linear-gradient(90deg,var(--green),var(--cyan)); }
.card--macos::before   { background: linear-gradient(90deg,var(--purple),#ec4899); }
.card:hover { transform: translateY(-5px); border-color: var(--border2); }
.card--windows:hover { box-shadow: 0 8px 30px rgba(0,173,239,.18); }
.card--linux:hover   { box-shadow: 0 8px 30px rgba(0,255,136,.14); }
.card--macos:hover   { box-shadow: 0 8px 30px rgba(139,92,246,.18); }
.card-icon { margin-bottom: .8rem; }
.card--windows .card-icon .cico { fill: #00adef; stroke: none; }
.card--linux   .card-icon .cico { fill: var(--green); stroke: none; }
.card--macos   .card-icon .cico { fill: var(--purple); stroke: none; }
/* platform bar brand colors */
.platform-bar .plat:nth-child(1) .pico { color: #00adef; }
.platform-bar .plat:nth-child(3) .pico { color: #e8e8e8; }
.platform-bar .plat:nth-child(5) .pico { color: #a8b0c8; }
.card h3   { font-family: var(--font-head); font-size: 1rem; color: var(--white); margin-bottom: .8rem; }
.card ul   { display:flex; flex-direction:column; gap:.4rem; }
.card li   { font-size: .87rem; color: var(--text2); padding-left:1rem; position:relative; }
.card li::before { content:'›'; position:absolute; left:0; color:var(--green); }
.card-tag { display:inline-block; margin-top:1.2rem; background:rgba(0,255,136,.06); border:1px solid rgba(0,255,136,.16); border-radius:4px; padding:.2rem .6rem; font-family:var(--font-mono); font-size:.7rem; color:var(--green); }

/* versions */
.versions-wrap { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.4rem; }
.version-card { background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:2rem; transition:border-color .3s, box-shadow .3s; }
.version--cli:hover  { border-color:var(--green);  box-shadow:var(--glow-green); }
.version--gui:hover  { border-color:var(--purple); box-shadow:var(--glow-purple); }
.version-tag { display:inline-block; background:rgba(0,255,136,.1); border:1px solid var(--green); color:var(--green); font-family:var(--font-mono); font-size:.72rem; padding:.2rem .7rem; border-radius:4px; margin-bottom:1rem; }
.version-tag--new { background:rgba(139,92,246,.15); border-color:var(--purple); color:var(--purple); }
.version-card h3 { font-family:var(--font-head); font-size:1.1rem; color:var(--white); margin-bottom:.8rem; }
.version-card p  { font-size:.9rem; color:var(--text2); margin-bottom:1rem; }
.feat-list { display:flex; flex-direction:column; gap:.45rem; margin-bottom:1.2rem; }
.feat-list li { font-size:.88rem; color:var(--text); display:flex; gap:.6rem; }
.check { color:var(--green); }
.version-cmd { background:var(--bg); border:1px solid var(--border); border-radius:4px; padding:.5rem .9rem; font-family:var(--font-mono); font-size:.82rem; color:var(--white); }
.prompt-s { color:var(--green); margin-right:.5rem; }
.version-badge { display:inline-block; background:rgba(139,92,246,.12); border:1px dashed var(--purple); color:var(--purple); font-family:var(--font-mono); font-size:.72rem; padding:.3rem .8rem; border-radius:4px; margin-top:.5rem; }

/* tools */
.tools-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1rem; }
.tool-item { background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:1.2rem 1rem; display:flex; flex-direction:column; align-items:center; gap:.6rem; font-size:.85rem; font-weight:600; color:var(--text2); transition:border-color .25s,color .25s,transform .25s,box-shadow .25s; text-align:center; }
.tool-item:hover { border-color:var(--cyan); color:var(--white); transform:translateY(-3px); box-shadow:0 4px 20px rgba(0,212,255,.13); }
.ti { font-size:1.6rem; }

/* info */
.info-block { display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:start; }
.info-terminal { background:var(--bg); border:1px solid var(--border2); border-radius:8px; overflow:hidden; }
.terminal-bar  { display:flex; align-items:center; gap:.5rem; background:var(--panel); border-bottom:1px solid var(--border); padding:.5rem .9rem; }
.tb            { width:12px; height:12px; border-radius:50%; }
.tb-red        { background:#ff5f57; }
.tb-yellow     { background:#febc2e; }
.tb-green      { background:#28c840; }
.terminal-title{ font-family:var(--font-mono); font-size:.7rem; color:var(--text2); margin-left:.4rem; }
.info-body  { padding:1rem; }
.info-row   { display:flex; justify-content:space-between; padding:.55rem 0; border-bottom:1px solid var(--border); font-size:.87rem; gap:1rem; }
.info-row:last-child { border-bottom:none; }
.info-key   { font-family:var(--font-mono); color:var(--text2); flex-shrink:0; }
.info-val   { color:var(--white); font-family:var(--font-mono); font-size:.82rem; text-align:right; }
.info-val a { color:var(--cyan); transition:color .2s; }
.info-val a:hover { color:var(--green); }
.info-desc p { font-size:.95rem; color:var(--white); margin-bottom:1.5rem; line-height:1.7; }
.info-desc strong { color:var(--white); }
.info-tags  { display:flex; flex-wrap:wrap; gap:.6rem; }
.info-tags span { background:rgba(139,92,246,.1); border:1px solid rgba(139,92,246,.3); color:var(--purple); font-family:var(--font-mono); font-size:.72rem; padding:.25rem .7rem; border-radius:99px; }

/* docs */
.docs-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1.2rem; }
.doc-card { background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:1.6rem; transition:border-color .25s,transform .25s; }
.doc-card:hover { border-color:var(--cyan); transform:translateY(-3px); }
.doc-icon { font-size:1.8rem; margin-bottom:.8rem; }
.doc-card h3 { font-family:var(--font-head); font-size:.9rem; color:var(--white); margin-bottom:.6rem; }
.doc-card p  { font-size:.85rem; color:var(--text2); margin-bottom:1rem; }
.doc-link    { font-family:var(--font-mono); font-size:.78rem; color:var(--cyan); transition:color .2s; }
.doc-link:hover { color:var(--green); }

/* ══════════════════════════════════════════════════════
   FEEDBACK / CONTACTO
══════════════════════════════════════════════════════ */
.section-desc {
  font-size: .95rem;
  color: var(--text2);
  margin-top: -.8rem;
  margin-bottom: 2.2rem;
  max-width: 600px;
  line-height: 1.7;
}

.feedback-wrap {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 2.2rem;
  align-items: start;
}

/* ── FORM ── */
.feedback-form-col { display: flex; flex-direction: column; gap: 0; }

.form-group { display: flex; flex-direction: column; gap: .45rem; margin-bottom: 1.2rem; }

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

.form-label {
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--text2);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.form-required { color: var(--green); }

.form-input,
.form-textarea,
.form-select {
  background: var(--bg);
  border: 1px solid var(--border2);
  border-radius: var(--radius);
  color: var(--white);
  font-family: var(--font-body);
  font-size: .9rem;
  padding: .65rem .9rem;
  width: 100%;
  transition: border-color .25s, box-shadow .25s;
  outline: none;
  appearance: none;
}
.form-input:focus,
.form-textarea:focus,
.form-select:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(0,255,136,.12);
}
.form-input::placeholder,
.form-textarea::placeholder { color: var(--text2); opacity: .7; }
.form-textarea { resize: vertical; min-height: 130px; font-family: var(--font-body); }
.form-select { cursor: pointer; }
.form-select option { background: var(--panel); color: var(--white); }

.form-select-wrap { position: relative; }
.select-arrow {
  position: absolute;
  right: .75rem; top: 50%;
  transform: translateY(-50%);
  width: 16px; height: 16px;
  stroke: var(--text2);
  pointer-events: none;
}

/* char count */
.form-char-count {
  font-family: var(--font-mono);
  font-size: .68rem;
  color: var(--text2);
  text-align: right;
  margin-top: .2rem;
}

/* ── RADIO OS ── */
.form-radio-group { display: flex; flex-wrap: wrap; gap: .6rem; }
.form-radio {
  cursor: pointer;
  user-select: none;
}
.form-radio input { display: none; }
.form-radio span {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  background: var(--bg);
  border: 1px solid var(--border2);
  border-radius: 6px;
  padding: .45rem .85rem;
  font-size: .85rem;
  color: var(--text2);
  transition: border-color .2s, color .2s, box-shadow .2s;
}
.form-radio input:checked + span {
  border-color: var(--green);
  color: var(--white);
  box-shadow: 0 0 0 2px rgba(0,255,136,.15);
}
.form-radio span:hover { border-color: var(--border); color: var(--text); }
.radio-ico {
  width: 14px; height: 14px;
  fill: currentColor;
  stroke: none;
  flex-shrink: 0;
}

/* ── FILE UPLOAD ── */
.form-file-input { display: none; }
.form-file-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .45rem;
  background: var(--bg);
  border: 1px dashed var(--border2);
  border-radius: var(--radius);
  padding: 1.4rem 1rem;
  cursor: pointer;
  text-align: center;
  transition: border-color .25s, background .25s;
}
.form-file-label:hover {
  border-color: var(--green);
  background: rgba(0,255,136,.03);
}
.form-file-label.drag-over {
  border-color: var(--cyan);
  background: rgba(0,212,255,.05);
}
.form-file-ico { width: 28px; height: 28px; stroke: var(--text2); }
.form-file-label:hover .form-file-ico { stroke: var(--green); }
#fileLabelText { font-size: .88rem; color: var(--text2); }
.form-file-hint { font-family: var(--font-mono); font-size: .65rem; color: var(--text2); opacity: .6; }
.file-preview {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-top: .5rem;
  padding: .5rem .8rem;
  background: rgba(0,255,136,.06);
  border: 1px solid rgba(0,255,136,.2);
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--green);
}
.file-preview-remove {
  margin-left: auto;
  background: none;
  border: none;
  color: var(--text2);
  cursor: pointer;
  font-size: .9rem;
  padding: 0;
  line-height: 1;
  transition: color .2s;
}
.file-preview-remove:hover { color: #ff5f57; }

/* ── SUBMIT BUTTON ── */
.form-submit {
  width: 100%;
  justify-content: center;
  gap: .6rem;
  padding: .8rem 1.5rem;
  font-size: .95rem;
  margin-top: .4rem;
}
.form-submit:disabled { opacity: .6; cursor: not-allowed; transform: none !important; }
.btn-ico { width: 16px; height: 16px; flex-shrink: 0; }
.form-submit .spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(0,0,0,.3);
  border-top-color: #000;
  border-radius: 50%;
  animation: spin .7s linear infinite;
  display: none;
}
.form-submit.loading .spinner { display: block; }
.form-submit.loading .btn-ico { display: none; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── RESULT MESSAGE ── */
.form-result {
  margin-top: 1.2rem;
  border-radius: var(--radius);
  overflow: hidden;
}
.form-result[hidden] { display: none; }
.result-success,
.result-error {
  display: flex;
  gap: .9rem;
  padding: 1.1rem 1.3rem;
  border-radius: var(--radius);
  font-size: .9rem;
  line-height: 1.6;
  align-items: flex-start;
}
.result-success {
  background: rgba(0,255,136,.08);
  border: 1px solid rgba(0,255,136,.3);
  color: var(--green);
}
.result-error {
  background: rgba(255,95,87,.07);
  border: 1px solid rgba(255,95,87,.3);
  color: #ff7875;
}
.result-ico { font-size: 1.2rem; flex-shrink: 0; margin-top: .1rem; }
.result-title { font-weight: 700; margin-bottom: .2rem; }
.result-body a { color: var(--cyan); text-decoration: underline; }

/* ── SIDEBAR ── */
.feedback-sidebar { display: flex; flex-direction: column; gap: 1.2rem; }
.fb-tip-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1.3rem 1.4rem;
}
.fb-tip-icon {
  width: 36px; height: 36px;
  background: rgba(0,255,136,.08);
  border: 1px solid rgba(0,255,136,.2);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: .8rem;
}
.fb-tip-icon svg { width: 18px; height: 18px; stroke: var(--green); }
.fb-tip-card h4 { font-family: var(--font-head); font-size: .82rem; color: var(--white); margin-bottom: .7rem; }
.fb-tip-card p  { font-size: .84rem; color: var(--text2); margin-bottom: .8rem; }
.fb-tip-card ul { display: flex; flex-direction: column; gap: .4rem; }
.fb-tip-card li {
  font-size: .83rem; color: var(--text2);
  padding-left: 1rem; position: relative;
}
.fb-tip-card li::before { content:'›'; position:absolute; left:0; color:var(--green); }
.fb-github-link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--cyan);
  border: 1px solid rgba(0,212,255,.25);
  border-radius: 6px;
  padding: .4rem .75rem;
  transition: border-color .2s, color .2s, background .2s;
}
.fb-github-link:hover { border-color: var(--cyan); background: rgba(0,212,255,.06); color: var(--white); }

/* Responsive feedback */
@media (max-width: 860px) {
  .feedback-wrap { grid-template-columns: 1fr; }
  .feedback-sidebar { flex-direction: row; flex-wrap: wrap; }
  .fb-tip-card { flex: 1; min-width: 240px; }
}
@media (max-width: 540px) {
  .form-row { grid-template-columns: 1fr; }
  .feedback-sidebar { flex-direction: column; }
}

/* footer */
.footer { background:var(--panel); border-top:1px solid var(--border); padding:3rem 2.5rem 2rem; }
.footer-top { display:flex; align-items:center; gap:1rem; margin-bottom:1rem; }
.footer-brand { display:flex; align-items:center; gap:.7rem; }
.footer-name { font-family:var(--font-head); font-size:1.1rem; color:var(--white); }
.footer-top p { font-size:.83rem; color:var(--text2); margin-left:auto; }
.footer-links { display:flex; gap:1.5rem; margin-bottom:1.5rem; }
.footer-links a { font-size:.85rem; color:var(--text2); transition:color .2s; }
.footer-links a:hover { color:var(--green); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--border); padding-top:1rem; font-family:var(--font-mono); font-size:.72rem; color:var(--text2); }
.footer-tag { color:var(--green); }

/* ── SCROLL REVEAL base ── */
.card,.version-card,.tool-item,.doc-card,.info-terminal,.info-desc {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .55s ease, transform .55s ease;
}

/* ── HERO HEADLINE (desktop — visível em todos os ecrãs > 720px) ── */
.hero-headline {
  position: relative;
  z-index: 4;
  text-align: center;
  padding: 0 1rem .6rem;
  animation: fadeUp .7s .1s ease both;
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(0,255,136,.07);
  border: 1px solid rgba(0,255,136,.22);
  border-radius: 99px;
  padding: .3rem .9rem;
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--green);
  margin-bottom: .8rem;
}
.hero-badge .dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: var(--glow-green);
  animation: blink 1.4s ease infinite;
}
.hero-title {
  font-family: var(--font-head);
  font-size: clamp(3rem, 7vw, 5.5rem);
  font-weight: 900;
  color: var(--white);
  letter-spacing: .04em;
  line-height: 1;
  margin-bottom: .4rem;
  /* glitch subtil */
  position: relative;
}
.hero-title::before {
  content: 'CMEasy';
  position: absolute; inset: 0;
  color: var(--cyan);
  clip-path: polygon(0 30%, 100% 30%, 100% 50%, 0 50%);
  animation: glitch1 5s infinite;
  pointer-events: none;
}
@keyframes glitch1 {
  0%,88%,100% { transform: translateX(0); opacity: 0; }
  90% { transform: translateX(-3px); opacity: .7; }
  92% { transform: translateX(3px); opacity: .7; }
}
.hero-sub-text {
  font-family: var(--font-mono);
  font-size: .88rem;
  color: var(--cyan);
  letter-spacing: .1em;
}

/* Oculta mobile header em desktop */
.mobile-hero-header { display: none; }

/* ── FILE INPUT — força ocultação total ── */
input[type="file"]#imagem {
  position: absolute;
  width: 1px; height: 1px;
  opacity: 0;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  pointer-events: none;
}

/* ── SCROLL REVEAL base ── */
.card,.version-card,.tool-item,.doc-card,.info-terminal,.info-desc {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .55s ease, transform .55s ease;
}

/* ── RESPONSIVE ── */
@media (max-width:900px) {
  .big-c { display:none; }
  .info-block { grid-template-columns:1fr; }
  .footer-top { flex-direction:column; align-items:flex-start; }
  .footer-top p { margin-left:0; }
}

@media (max-width:720px) {
  /* Oculta headline desktop, mostra mobile header */
  .hero-headline { display: none; }

  /* Hero layout mobile: coluna, centrado */
  .hero {
    justify-content: flex-start;
    align-items: center;
    padding-top: 72px;
    padding-bottom: 0;
  }

  /* Header mobile — título + badge */
  .mobile-hero-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.4rem 1.5rem .6rem;
    z-index: 3;
    position: relative;
    animation: fadeUp .7s .1s ease both;
  }
  .mobile-badge {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    background: rgba(0,255,136,.07);
    border: 1px solid rgba(0,255,136,.22);
    border-radius: 99px;
    padding: .28rem .85rem;
    font-family: var(--font-mono);
    font-size: .68rem;
    color: var(--green);
    margin-bottom: .75rem;
  }
  .mobile-badge .dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: var(--glow-green);
    animation: blink 1.4s ease infinite;
  }
  .mobile-title {
    font-family: var(--font-head);
    font-size: clamp(2.4rem, 12vw, 3.2rem);
    font-weight: 900;
    color: var(--white);
    letter-spacing: .04em;
    line-height: 1;
    margin-bottom: .4rem;
  }
  .mobile-sub {
    font-family: var(--font-mono);
    font-size: .78rem;
    color: var(--cyan);
    letter-spacing: .09em;
  }

  /* Scene: centralizado, sem livros nem caneca */
  .scene {
    width: 100%;
    max-width: 100vw;
    height: auto;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    margin-top: .8rem;
    padding: 0 1rem;
    gap: 0;
  }

  /* Esconde elementos laterais */
  .books      { display: none; }
  .mug        { display: none; }
  .big-c      { display: none; }

  /* Laptop centrado, tamanho amigável */
  .laptop-scene { width: 100%; max-width: 360px; }
  .laptop-screen-outer {
    width: 100% !important;
    max-width: 340px;
    min-height: 180px;
  }
  .laptop-screen-inner { min-height: 155px; }
  .laptop-hinge       { width: 100% !important; max-width: 356px; }
  .laptop-base-scene  { width: 100% !important; max-width: 372px; }

  /* Floaters: menos e mais contidos */
  .f3, .f6, .f8 { display: none; } /* remove os que ficam colados ao laptop */
  .floater { font-size: 1.3rem; }
  .f1 { top: 16%; left: 3%; }
  .f2 { top: 16%; right: 3%; }
  .f4 { top: 55%; right: 3%; }
  .f5 { top: 38%; right: 2%; }
  .f7 { top: 8%;  right: 12%; }

  /* Platform bar em coluna */
  .platform-bar {
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    padding: .8rem 1rem;
    font-size: .78rem;
  }
  .plat-divider { display: none; }
  .dot-sep { display: none; }
  .platform-bar .plat + .plat::before {
    content: '•';
    color: var(--border2);
    margin-right: .5rem;
  }

  /* Nav mobile */
  .nav-links {
    display: none;
    flex-direction: column;
    gap: 1rem;
    position: fixed;
    top: 60px; left: 0; right: 0;
    background: rgba(7,8,15,.97);
    padding: 1.5rem 2rem;
    border-bottom: 1px solid var(--border);
    z-index: 99;
  }
  .nav-links.open { display: flex; }
  .nav-toggle     { display: flex; }

  /* Sections */
  .section { padding: 3.5rem 1.2rem; }
  .footer-bottom { flex-direction: column; gap: .5rem; text-align: center; }
}

@keyframes fadeUp {
  from { opacity:0; transform:translateY(14px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.15} }

/* ── FORM ERROR & RESULT MSG ── */
.form-error { font-family: var(--font-mono); font-size: .7rem; color: #ff7875; margin-top: .2rem; min-height: 1em; }
input.error, textarea.error { border-color: #ff7875 !important; }
.form-result-msg {
  margin-top: 1rem;
  padding: .9rem 1.1rem;
  border-radius: var(--radius);
  font-size: .88rem;
  line-height: 1.6;
  display: none;
}
.form-result-msg.success {
  display: block;
  background: rgba(0,255,136,.08);
  border: 1px solid rgba(0,255,136,.3);
  color: var(--green);
}
.form-result-msg.error {
  display: block;
  background: rgba(255,95,87,.07);
  border: 1px solid rgba(255,95,87,.3);
  color: #ff7875;
}
/* Botcheck always hidden */
input[name="botcheck"] { display: none !important; }

/* ══ CONTACT REDIRECT ══════════════════════════════════ */
.contact-redirect-wrap {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 2rem;
  align-items: start;
}
.contact-redirect-card {
  background: var(--panel);
  border: 1px solid var(--border2);
  border-radius: 10px;
  padding: 2.2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.cr-icon {
  width: 48px; height: 48px;
  background: rgba(0,255,136,.08);
  border: 1px solid rgba(0,255,136,.22);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
}
.cr-icon svg { width: 22px; height: 22px; stroke: var(--green); }
.contact-redirect-card h3 {
  font-family: var(--font-head);
  font-size: 1.15rem;
  color: var(--white);
}
.contact-redirect-card p {
  font-size: .92rem;
  color: var(--text2);
  line-height: 1.7;
}
.contact-redirect-card strong { color: var(--white); }
.cr-btn {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin-top: .4rem;
  align-self: flex-start;
  padding: .75rem 1.6rem;
  font-size: .9rem;
}
.cr-side { display: flex; flex-direction: column; gap: 1.2rem; }
.cr-tip {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1.3rem 1.4rem;
}
.cr-tip h4 { font-family: var(--font-head); font-size: .82rem; color: var(--white); margin-bottom: .7rem; margin-top: .6rem; }
.cr-tip p  { font-size: .84rem; color: var(--text2); margin-bottom: .8rem; }
.cr-tip ul { display: flex; flex-direction: column; gap: .4rem; }
.cr-tip li { font-size: .83rem; color: var(--text2); padding-left: 1rem; position: relative; }
.cr-tip li::before { content:'›'; position:absolute; left:0; color:var(--green); }

@media (max-width: 860px) {
  .contact-redirect-wrap { grid-template-columns: 1fr; }
  .cr-side { flex-direction: row; flex-wrap: wrap; }
  .cr-tip { flex: 1; min-width: 220px; }
}

/* ══ TUTORIAIS ════════════════════════════════════════════════ */
.tut-intro {
  font-size: .95rem;
  color: var(--text2);
  margin-top: -.8rem;
  margin-bottom: 2.5rem;
  max-width: 640px;
  line-height: 1.7;
}

.tut-carousel-wrap {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
  margin-bottom: 2.5rem;
}

.tut-track {
  display: flex;
  gap: 1.5rem;
  animation: tut-scroll 14s linear infinite;
  will-change: transform;
}
.tut-carousel-wrap:hover .tut-track { animation-play-state: paused; }

@keyframes tut-scroll {
  to { transform: translateX(-688px); } /* 2 × (320px card + 24px gap) */
}

.tut-card {
  flex: 0 0 320px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  padding: 0;
  display: flex;
  flex-direction: column;
  -webkit-appearance: none;
  appearance: none;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  line-height: inherit;
  transition: border-color .3s, transform .3s, box-shadow .3s;
}
.tut-card:hover {
  border-color: var(--cyan);
  transform: translateY(-4px);
  box-shadow: 0 8px 30px rgba(0,212,255,.15);
}

.tut-thumb-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--bg);
}
.tut-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.tut-card:hover .tut-thumb { transform: scale(1.05); }

.tut-play-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(7,8,15,.55);
  opacity: 0;
  transition: opacity .3s;
}
.tut-card:hover .tut-play-overlay { opacity: 1; }

.tut-play-btn {
  width: 56px;
  height: 56px;
  background: var(--cyan);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 24px rgba(0,212,255,.5);
  transition: transform .25s;
}
.tut-card:hover .tut-play-btn { transform: scale(1.12); }
.tut-play-btn svg { width: 22px; height: 22px; fill: var(--bg); margin-left: 3px; }

.tut-card-info {
  padding: 1rem 1.2rem;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  flex: 1;
}
.tut-tag {
  display: inline-block;
  background: rgba(0,212,255,.08);
  border: 1px solid rgba(0,212,255,.2);
  border-radius: 4px;
  padding: .15rem .55rem;
  font-family: var(--font-mono);
  font-size: .68rem;
  color: var(--cyan);
  align-self: flex-start;
}
.tut-card-title {
  font-family: var(--font-head);
  font-size: .9rem;
  color: var(--white);
  line-height: 1.4;
}

.tut-yt-wrap { display: flex; justify-content: center; margin-top: 1rem; }
.tut-yt-link {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  background: rgba(255,0,0,.07);
  border: 1px solid rgba(255,60,60,.3);
  color: #ff5c5c;
  border-radius: 6px;
  padding: .7rem 1.8rem;
  font-family: var(--font-mono);
  font-size: .82rem;
  transition: background .25s, border-color .25s, color .25s;
}
.tut-yt-link:hover { background: rgba(255,0,0,.14); border-color: #ff5c5c; color: #ff7a7a; }
.tut-yt-link svg { width: 18px; height: 18px; fill: currentColor; flex-shrink: 0; }

/* Modal de vídeo */
.tut-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}
.tut-modal[hidden] { display: none; }

.tut-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.88);
  cursor: pointer;
}
.tut-modal-box {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 900px;
  background: var(--bg);
  border: 1px solid var(--border2);
  border-radius: 10px;
  overflow: hidden;
}
.tut-modal-close {
  position: absolute;
  top: .75rem;
  right: .75rem;
  z-index: 2;
  width: 36px;
  height: 36px;
  background: rgba(7,8,15,.9);
  border: 1px solid var(--border2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--text2);
  transition: border-color .2s, color .2s;
}
.tut-modal-close:hover { border-color: var(--cyan); color: var(--white); }
.tut-modal-close svg { width: 16px; height: 16px; stroke: currentColor; }

.tut-modal-player { position: relative; width: 100%; aspect-ratio: 16/9; }
.tut-modal-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: none; }

@media (max-width: 720px) {
  .tut-card { flex: 0 0 260px; }
  @keyframes tut-scroll { to { transform: translateX(-568px); } } /* 2 × (260px + 24px) */
}
@media (max-width: 480px) {
  .tut-card { flex: 0 0 220px; }
  @keyframes tut-scroll { to { transform: translateX(-488px); } } /* 2 × (220px + 24px) */
}

/* ── COR INICIAL / BASE ── */
:root { --text: #ffffff; --white: #ffffff; }
body  { color: #ffffff; }

/* ── TEXTO GLOBAL — branco ── */
p    { color: #ffffff; }
li   { color: #ffffff; }
a    { color: #ffffff; }
span { color: #ffffff; }

/* ── SECÇÃO CONTACTO / FEEDBACK — forçar branco ── */
.contact-redirect-card p,
.contact-redirect-card h3,
.cr-tip p,
.cr-tip li,
.cr-tip h4,
.cr-side p,
.cr-side li,
.cr-side h4,
.fb-tip-card p,
.fb-tip-card li,
.fb-tip-card h4,
.footer-top p,
.footer-links a,
.footer-bottom span { color: #ffffff; }

/* ── DESTAQUES — verde ── */
strong { color: var(--green); }
b      { color: var(--green); }

/* ── ÍCONES — branco ── */
.tico  { stroke: var(--white); }
.fico  { stroke: var(--white); }
.pico  { stroke: var(--white); }
.cico  { stroke: var(--white); }
.dico  { stroke: var(--white); }
.scene-ico { stroke: var(--white); }

/* ── TOOL ITEMS — texto e ícone brancos, hover ciano ── */
.tool-item        { color: var(--white); }
.tool-item .tico  { stroke: var(--white); }
.tool-item:hover  { color: var(--cyan); }
.tool-item:hover .tico { stroke: var(--cyan); }