/*
  SYNALE — NÍVEL 1 / TECH METALIZADO
  Variação visual reversível (26/10/2026).
  Mantém o HTML, a estrutura, fotos, textos e interações originais.
  Em caso de reversão, basta remover a referência a styles-tech.css no index.html.
  Backup integral do projeto: branch backup/original-antes-metalizado-2026-10-26.
*/

/* 01 — Paleta metalizada: violeta profundo, magenta, ouro-champagne e prata */
:root{
  --navy:#25254c;
  --navy-deep:#18183e;
  --muted:#555775;
  --pink:#cb4f98;
  --pink-dark:#ad347b;
  --lilac:#7256dc;
  --lilac-light:#f0eaff;
  --gold:#cf9e42;
  --line:#e4ddf1;
  --background:#faf7fe;
  --shadow:0 24px 65px rgba(69,48,118,.11);
}
body{
  background:#fcfaff;
}
::selection{background:#ebc4ea;color:#29234e}

/* 02 — Navegação: vidro acetinado com um fio metálico */
.site-header{
  background:linear-gradient(112deg,rgba(255,255,255,.97),rgba(250,245,255,.92) 48%,rgba(255,249,253,.94));
  border-bottom:1px solid rgba(173,152,210,.36);
  box-shadow:0 9px 35px rgba(44,33,90,.055),inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}
.site-header::after{
  content:"";position:absolute;bottom:0;left:0;right:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent 6%,rgba(208,164,93,.7) 28%,rgba(159,120,218,.58) 60%,transparent 93%);
}
.nav-link.active,.nav-link:hover{color:#6841be}
.nav-link.active::after,.nav-link:hover::after{
  height:2px;
  background:linear-gradient(90deg,#a948a4,#dfac57,#856be6);
  box-shadow:0 0 10px rgba(184,95,193,.17);
}
.menu-toggle{
  border-color:#e1d4f3;
  background:linear-gradient(140deg,#fff,#f4eefa);
  box-shadow:0 7px 18px rgba(91,64,144,.07),inset 0 1px 0 #fff;
}

/* 03 — Botões cromáticos: reflexo discreto, boa leitura */
.button-pink{
  position:relative;
  border:1px solid rgba(255,255,255,.36);
  color:#fff;
  background:linear-gradient(115deg,#a947ae 0%,#bb4fa4 25%,#d365a8 53%,#bc4d9f 78%,#9962d6 100%);
  box-shadow:0 12px 30px rgba(157,67,151,.23),inset 0 1px 0 rgba(255,255,255,.39),inset 0 -2px 3px rgba(95,28,127,.18);
}
.button-pink::before{
  content:"";position:absolute;inset:1px 8px auto;height:44%;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0));
}
.button-pink:hover{
  background:linear-gradient(115deg,#9945b3,#cb54a4 55%,#9760d0);
  box-shadow:0 15px 35px rgba(151,63,155,.29),inset 0 1px 0 rgba(255,255,255,.42);
}
.button-outline{
  border-color:rgba(178,150,210,.47);
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(251,243,255,.86));
  box-shadow:0 8px 25px rgba(92,67,142,.09),inset 0 1px 0 rgba(255,255,255,.98);
}
.button-outline:hover{background:#fff;border-color:#b59ad7}
.text-link{color:#b33c87;border-bottom-color:rgba(193,92,153,.48)}
.text-link:hover{color:#8d357c}

/* 04 — Hero: claridade no texto, brilho aurora na área visual */
.hero{
  background:
    radial-gradient(ellipse at 78% 41%,rgba(162,119,216,.25),transparent 41%),
    radial-gradient(ellipse at 96% 8%,rgba(230,151,204,.26),transparent 45%),
    radial-gradient(ellipse at 36% 84%,rgba(245,203,155,.24),transparent 51%),
    linear-gradient(108deg,#fffdfd 5%,#fbf6ff 48%,#f7eef9 100%);
}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(127,84,191,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(127,84,191,.09) 1px,transparent 1px);
  background-size:56px 56px;
  opacity:.23;
  -webkit-mask-image:linear-gradient(90deg,transparent 7%,transparent 42%,black 92%);
  mask-image:linear-gradient(90deg,transparent 7%,transparent 42%,black 92%);
}
.hero::after{
  content:"";position:absolute;width:760px;height:470px;right:-230px;top:38px;
  border:1px solid rgba(198,146,220,.25);border-radius:50%;transform:rotate(-23deg);
  pointer-events:none;z-index:0;
  box-shadow:0 0 0 32px rgba(216,180,236,.036),0 0 0 75px rgba(217,177,242,.026);
}
.hero-grid,.value-bar-wrap{position:relative;z-index:1}
.eyebrow{color:#7d55bc;letter-spacing:2.7px}
.eyebrow-dot{background:#d751a2;box-shadow:0 0 0 5px rgba(211,94,176,.12),0 0 13px rgba(215,84,171,.32)}
.heading-purple{
  color:#5b43b6;
  background:linear-gradient(105deg,#483ba0,#8455d3 58%,#7151b6);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.heading-pink{
  color:#bb3e93;
  background:linear-gradient(100deg,#c13c91 10%,#d96ea2 57%,#a44aaf);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.tiny-dot{color:#cf9e42;-webkit-text-fill-color:#cf9e42}
.lead{color:#464766}
.hero-glow-one{opacity:.77;background:radial-gradient(ellipse,rgba(177,114,213,.36),transparent 72%)}
.hero-glow-two{opacity:.7;background:radial-gradient(ellipse,rgba(235,160,187,.27),transparent 72%)}
.hero-swoosh{
  background:conic-gradient(from 228deg,#d0a24c 0deg,#ffe1a0 35deg,#a67fe0 89deg,#614bd0 147deg,#cc68bf 205deg,#eaaa8c 262deg,transparent 307deg,transparent 330deg,#d0a24c 360deg);
  filter:drop-shadow(0 13px 19px rgba(112,72,170,.18));
  opacity:.97;
}
.hero-seal{
  border-color:rgba(255,255,255,.99);
  background:linear-gradient(130deg,rgba(255,255,255,.97),rgba(247,235,255,.89));
  box-shadow:0 12px 32px rgba(80,48,129,.13),inset 0 1px 0 #fff;
  color:#59417b;
}

/* 05 — Diferenciais: vidro translúcido e ícones com brilho de joia */
.value-bar{
  background:linear-gradient(120deg,rgba(255,255,255,.96),rgba(247,239,255,.91) 52%,rgba(255,247,250,.95));
  border:1px solid rgba(255,255,255,.98);
  box-shadow:0 20px 54px rgba(105,73,168,.12),inset 0 1px 0 #fff,0 0 0 1px rgba(196,170,228,.22);
}
.value-item+.value-item:before{border-left-color:rgba(187,168,216,.35)}
.value-icon,.mini-value-icon,.course-heading-mark{
  border:1px solid rgba(255,255,255,.9);
  color:#7652cb;
  background:linear-gradient(138deg,#ffffff 2%,#e9dcfb 29%,#f7e9f5 60%,#fff1d6 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 7px 18px rgba(116,82,158,.1);
}

/* 06 — Seções: luminosidade refinada, sem mexer nas fotografias */
.about-section{
  background:
    radial-gradient(ellipse at 92% 29%,rgba(196,167,235,.26),transparent 54%),
    linear-gradient(125deg,#fff 11%,#fbf8ff 52%,#fff6fb 100%);
}
.about-blob{
  background:radial-gradient(ellipse at 58% 42%,rgba(193,155,237,.34),rgba(236,201,229,.22) 53%,transparent 74%);
}
.laptop-mockup{filter:drop-shadow(0 28px 29px rgba(79,55,125,.21))}
.laptop-display{
  border-color:#6b6280;border-top-color:#46405d;border-left-color:#78708d;
  box-shadow:0 0 0 1px rgba(255,255,255,.8),inset 0 2px 3px rgba(0,0,0,.1);
}
.laptop-neck{background:linear-gradient(#e2dfe9,#9c95b0 48%,#d2cbd9)}
.laptop-base{background:linear-gradient(90deg,#8d869d,#e5e0ef 35%,#f8f7fb 50%,#aaa4bd 75%,#756f85)}
.floating-caption{
  background:linear-gradient(130deg,rgba(255,255,255,.96),rgba(246,238,252,.92));
  border-color:rgba(255,255,255,.98);
  box-shadow:0 18px 39px rgba(82,52,137,.13),inset 0 1px 0 #fff;
}
.section-eyebrow{color:#b64490}
.section-copy h2 span,.course-heading h2 span{
  color:#bb4894;
  background:linear-gradient(115deg,#9d409a,#d56d9d 58%,#a24fb5);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.section-copy .section-intro{color:#373a65}
.section-detail{color:#655080}
.sinais-section{
  background:linear-gradient(114deg,#fdf8fc 0%,#fff 44%,#f8f4ff 100%);
}
.sinais-ribbon{
  background:conic-gradient(from 165deg,#c89b48 0deg,#f8dfa3 63deg,#d173b1 126deg,#bd9bea 186deg,#6559d9 251deg,transparent 325deg,transparent 360deg);
  opacity:.94;
}
.sinais-small-tag{
  background:linear-gradient(130deg,rgba(255,255,255,.99),rgba(248,237,255,.97));
  border:1px solid rgba(255,255,255,.98);
  box-shadow:0 10px 25px rgba(61,39,99,.18),inset 0 1px 0 #fff;
  color:#63467e;
  z-index:6;
}
.founder-section{
  background:radial-gradient(ellipse at 78% 25%,rgba(219,176,233,.18),transparent 51%),linear-gradient(110deg,#fff 5%,#fcf6fd 55%,#fff8fb);
}
.founder-halo{
  background:conic-gradient(from 28deg,transparent 0deg,transparent 33deg,#f2d591 74deg,#c958ad 149deg,#7056d8 246deg,#aa7adb 303deg,transparent 347deg,transparent 360deg);
  opacity:.97;
}
.founder-quote{
  background:linear-gradient(110deg,rgba(239,226,252,.89),rgba(255,243,248,.61));
  border-left-color:#a163d5;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

/* 07 — Cursos: cartões acetinados com borda iridescente suave */
.courses-section{
  background:
    radial-gradient(ellipse at 82% 4%,rgba(205,169,234,.27),transparent 47%),
    radial-gradient(ellipse at 13% 100%,rgba(238,198,214,.25),transparent 48%),
    linear-gradient(180deg,#faf7ff 0%,#fff9fc 100%);
}
.course-card{
  border:1px solid transparent;
  background:linear-gradient(150deg,rgba(255,255,255,.99),rgba(253,248,255,.98)) padding-box,
             linear-gradient(140deg,rgba(237,204,152,.83),rgba(182,146,235,.62) 52%,rgba(225,144,193,.7)) border-box;
  box-shadow:0 19px 48px rgba(94,63,147,.105),inset 0 1px 0 #fff;
}
.course-card:hover{box-shadow:0 25px 60px rgba(96,59,153,.16)}
.course-image:after{background:linear-gradient(0deg,rgba(255,251,255,.93),transparent 88%)}
.course-number{
  background:linear-gradient(125deg,rgba(255,255,255,.95),rgba(249,235,255,.86));
  border-color:rgba(255,255,255,.95);
  color:#644ca1;
  box-shadow:0 7px 17px rgba(75,54,116,.09);
}
.course-category{color:#b5438c}
.course-card-bottom .icon{
  background:linear-gradient(135deg,#f8f0ff,#f1e2fc 63%,#ffe8ee);
  color:#7256bd;
  box-shadow:inset 0 1px 0 #fff;
}

/* 08 — CTA escuro com luz difusa e cartões de contato em vidro */
.ending-section{
  background:
    radial-gradient(ellipse at 10% 18%,rgba(151,93,219,.6),transparent 52%),
    radial-gradient(ellipse at 92% 87%,rgba(215,86,164,.57),transparent 50%),
    linear-gradient(113deg,#3b2d76 0%,#624393 51%,#a94a90 100%);
}
.ending-section:before{
  background:repeating-linear-gradient(40deg,rgba(255,255,255,.035) 0,rgba(255,255,255,.035) 1px,transparent 1px,transparent 38px);
}
.ending-orb{
  border-color:rgba(245,222,255,.23);
  box-shadow:0 0 0 36px rgba(242,211,255,.03),0 0 0 74px rgba(254,215,230,.025);
}
.button-light{
  color:#894084;
  border:1px solid rgba(255,255,255,.95);
  background:linear-gradient(116deg,#fff 0%,#f7e9ff 48%,#fff5e2 100%);
  box-shadow:0 15px 29px rgba(34,23,77,.21),inset 0 1px 0 #fff;
}
.button-light:hover{background:#fff}
.contact-heading{border-top-color:rgba(255,255,255,.31)}
.contact-channel{
  border:1px solid rgba(255,255,255,.42);
  background:linear-gradient(135deg,rgba(255,255,255,.21),rgba(255,255,255,.085));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.31),0 12px 28px rgba(36,19,75,.1);
}
.contact-channel-icon{
  background:linear-gradient(135deg,rgba(255,255,255,.31),rgba(255,255,255,.11));
  border:1px solid rgba(255,255,255,.24);
}
.contact-heading h3 span{color:#ffe1a9}
.site-footer{
  background:linear-gradient(180deg,#fff 0%,#fdf9ff 100%);
}
.footer-top{border-bottom-color:rgba(197,177,221,.34)}
.back-top{
  background:linear-gradient(135deg,#7755d7,#b350ad);
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 12px 27px rgba(92,54,164,.23),inset 0 1px 0 rgba(255,255,255,.28);
}

/* 09 — Responsividade, contraste e movimento reduzido */
@media(max-width:990px){
  .mobile-nav{
    background:linear-gradient(135deg,rgba(255,255,255,.99),rgba(247,240,254,.98));
    border-bottom:1px solid rgba(168,141,210,.34);
    box-shadow:0 20px 37px rgba(62,38,111,.12);
  }
}
@media(max-width:700px){
  .hero{
    background:radial-gradient(ellipse at 88% 57%,rgba(193,155,231,.24),transparent 55%),
      radial-gradient(ellipse at 2% 89%,rgba(239,202,180,.19),transparent 48%),#fcf9ff;
  }
  .hero::before{opacity:.15;background-size:42px 42px}
  .hero::after{width:480px;height:320px;right:-260px;top:250px}
  .value-bar{border-radius:20px}
  .contact-channel{min-height:72px}
}
@media(prefers-reduced-motion:reduce){
  .course-card:hover,.button-pink:hover{transform:none}
}


/* 10 — Tech Boost: contraste maior, ouro escovado e superfícies futuristas.
   Criado após avaliação da referência visual em 26/10/2026.
   Tudo é CSS, sem imagens adicionais ou animações contínuas. */
:root{
  --metal-gold-light:#fff3c4;
  --metal-gold:#dda951;
  --metal-gold-deep:#855224;
  --tech-indigo:#232047;
  --tech-violet:#43245c;
}
.hero{
  background:
    radial-gradient(ellipse at 79% 35%,rgba(136,78,186,.28),transparent 43%),
    radial-gradient(ellipse at 99% 7%,rgba(215,116,173,.28),transparent 46%),
    radial-gradient(ellipse at 12% 93%,rgba(225,177,96,.18),transparent 43%),
    linear-gradient(110deg,#fffefd 3%,#faf4ff 52%,#f1e6fa 100%);
}
.hero::before{
  background-image:
    linear-gradient(rgba(125,74,178,.17) 1px,transparent 1px),
    linear-gradient(90deg,rgba(125,74,178,.17) 1px,transparent 1px),
    radial-gradient(circle,rgba(200,132,191,.5) 1px,transparent 1.5px);
  background-size:48px 48px,48px 48px,96px 96px;
  opacity:.39;
  -webkit-mask-image:linear-gradient(90deg,transparent 8%,transparent 42%,#000 93%);
  mask-image:linear-gradient(90deg,transparent 8%,transparent 42%,#000 93%);
}
.hero::after{
  border-color:rgba(213,167,89,.62);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.66),
    0 0 0 28px rgba(213,171,99,.042),
    0 0 0 72px rgba(161,105,217,.043),
    0 0 35px rgba(215,160,97,.16);
}
.eyebrow{
  border:1px solid rgba(176,139,212,.37);
  border-radius:999px;
  padding:9px 14px;
  background:linear-gradient(115deg,rgba(255,255,255,.94),rgba(247,235,255,.82));
  box-shadow:inset 0 1px 0 #fff,0 8px 24px rgba(113,69,169,.08);
}
.hero-swoosh{
  background:conic-gradient(from 224deg,
    #986222 0deg,#f6ce74 22deg,#fff2c4 44deg,#bd7c31 64deg,
    #8754cf 118deg,#5f46c3 166deg,#ce56ad 213deg,
    #f5bc76 254deg,transparent 308deg,transparent 328deg,#986222 360deg);
  filter:drop-shadow(0 10px 21px rgba(157,99,176,.24));
}
.hero-seal{
  border:1px solid rgba(255,223,157,.85);
  background:linear-gradient(112deg,rgba(41,31,78,.96),rgba(86,44,114,.96));
  box-shadow:0 15px 35px rgba(52,33,93,.22),inset 0 1px 0 rgba(255,255,255,.2);
  color:#fff8ef;
}
.hero-seal .icon{color:#f3c878}
.button-pink{
  border-color:rgba(254,223,167,.75);
  box-shadow:0 15px 34px rgba(146,60,155,.25),inset 0 1px 0 rgba(255,246,221,.42);
}
.button-outline{
  border-color:rgba(209,161,90,.69);
  box-shadow:0 8px 22px rgba(87,51,145,.11),inset 0 1px 0 #fff;
}

/* O painel dos quatro diferenciais agora é o ponto tecnológico de destaque. */
.value-bar{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:25px;
  border:1px solid rgba(239,197,118,.72);
  background:
    radial-gradient(ellipse at 9% -12%,rgba(196,123,228,.32),transparent 47%),
    radial-gradient(ellipse at 97% 98%,rgba(206,90,160,.2),transparent 44%),
    linear-gradient(111deg,#25224f 0%,#352554 53%,#4e2b65 100%);
  box-shadow:
    0 24px 60px rgba(52,31,104,.24),
    inset 0 1px 0 rgba(255,246,219,.36),
    inset 0 -1px 0 rgba(19,12,47,.42);
}
.value-bar::before{
  content:"";
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(214,177,244,.16) 1px,transparent 1px),
    linear-gradient(90deg,rgba(214,177,244,.16) 1px,transparent 1px),
    radial-gradient(circle,rgba(255,213,143,.62) 1px,transparent 1.6px);
  background-size:46px 46px,46px 46px,92px 92px;
  opacity:.29;
}
.value-bar::after{
  content:"";
  position:absolute;left:11%;right:11%;top:0;height:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,#fff0b1 23%,#c58b3c 49%,#f0d3a5 76%,transparent);
  box-shadow:0 0 19px rgba(248,203,124,.5);
}
.value-item{position:relative;z-index:1}
.value-item+.value-item:before{border-left-color:rgba(233,207,255,.28)}
.value-item h3{color:#fffafc;font-size:13.4px;letter-spacing:-.1px}
.value-item p{color:#eae1f5;font-size:11.3px}
.value-icon{
  position:relative;
  isolation:isolate;
  width:69px;
  height:69px;
  margin-bottom:16px;
  flex-shrink:0;
  border:2px solid rgba(255,239,186,.95);
  border-radius:50%;
  color:#33215d;
  background:
    radial-gradient(ellipse at 25% 14%,rgba(255,255,255,.97),transparent 38%),
    linear-gradient(134deg,
      #fff8dc 0%,#f4d38b 12%,#c18b3d 26%,
      #fff0b7 36%,#a36a2b 51%,#fbe1a0 65%,
      #c18537 81%,#ffecae 94%,#9c672b 100%);
  box-shadow:
    inset 0 3px 7px rgba(255,255,255,.78),
    inset -5px -6px 10px rgba(96,51,16,.25),
    0 0 0 4px rgba(255,217,145,.1),
    0 9px 23px rgba(9,6,37,.32),
    0 0 24px rgba(250,204,117,.2);
}
.value-icon::before{
  content:"";position:absolute;inset:-6px;border-radius:50%;pointer-events:none;
  border:1px solid rgba(255,231,163,.48);
  box-shadow:0 0 10px rgba(251,205,125,.14);
}
.value-icon::after{
  content:"";position:absolute;left:13%;right:19%;top:8%;height:33%;
  border-radius:50%;transform:rotate(-20deg);pointer-events:none;z-index:1;
  background:linear-gradient(180deg,rgba(255,255,255,.79),rgba(255,255,255,0));
}
.value-icon .icon{
  position:relative;z-index:2;width:30px;height:30px;stroke-width:1.95;
  filter:drop-shadow(0 1px 1px rgba(255,243,186,.75));
}

/* A mesma assinatura dourada conecta os ícones das outras seções. */
.mini-value-icon,.course-heading-mark{
  color:#5c397d;
  border:1px solid rgba(255,235,170,.98);
  background:
    radial-gradient(ellipse at 21% 9%,rgba(255,255,255,.96),transparent 49%),
    linear-gradient(135deg,#fff3ca,#d6a359 40%,#ffe5a9 67%,#a86b2f);
  box-shadow:inset 0 1px 0 #fff5d9,inset -3px -4px 7px rgba(117,71,32,.14),
             0 7px 18px rgba(127,85,48,.19);
}
.section-eyebrow{
  padding:6px 11px;
  border:1px solid rgba(207,160,93,.38);
  border-radius:50px;
  background:linear-gradient(115deg,rgba(255,255,255,.89),rgba(249,231,250,.88));
  box-shadow:inset 0 1px 0 #fff;
  letter-spacing:2px;
}

/* Painéis conectados, acentos de circuito e realce tecnológico dos cards. */
.about-section::before,.courses-section::before{
  content:"";
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(141,99,207,.1) 1px,transparent 1px),
    linear-gradient(90deg,rgba(141,99,207,.1) 1px,transparent 1px);
  background-size:58px 58px;
  opacity:.32;
  -webkit-mask-image:linear-gradient(90deg,transparent 5%,transparent 46%,black 100%);
  mask-image:linear-gradient(90deg,transparent 5%,transparent 46%,black 100%);
}
.about-grid,.courses-section .container{position:relative;z-index:1}
.laptop-display{box-shadow:0 0 0 2px rgba(240,195,119,.61),0 20px 33px rgba(72,40,109,.15)}
.course-card{
  position:relative;
  box-shadow:0 22px 53px rgba(86,50,143,.16),0 0 0 1px rgba(195,145,222,.11);
}
.course-card::after{
  content:"";position:absolute;z-index:5;top:0;left:0;right:0;height:3px;pointer-events:none;
  background:linear-gradient(90deg,#a165dc 0%,#f4d089 32%,#a25bcd 69%,#e2a45e 100%);
}
.course-card:hover{box-shadow:0 28px 61px rgba(86,50,143,.23)}
.course-card-bottom .icon{
  color:#502d80;
  border:1px solid rgba(255,233,164,.94);
  background:linear-gradient(125deg,#fff2c7,#d8a65c 55%,#fff0be);
  box-shadow:inset 0 1px 0 #fff,0 5px 12px rgba(158,103,51,.15);
}
.founder-quote{border-left-color:#d4a255;box-shadow:0 9px 24px rgba(126,76,137,.08)}
.contact-channel{border-color:rgba(248,210,151,.43)}
.contact-channel-icon{
  color:#fff3c7;
  border-color:rgba(254,224,161,.54);
  background:linear-gradient(125deg,rgba(249,202,134,.31),rgba(155,97,188,.3));
}

/* Elementos de brilho estático não reduzem desempenho com animação contínua. */
@media(max-width:700px){
  .hero::before{opacity:.22;background-size:42px 42px,42px 42px,84px 84px}
  .hero::after{opacity:.65}
  .value-bar{padding:27px 10px;row-gap:28px}
  .value-icon{width:55px;height:55px;margin-bottom:14px}
  .value-icon .icon{width:25px;height:25px}
  .value-item h3{font-size:11.6px}
  .value-item p{font-size:10.2px}
  .section-eyebrow{font-size:9px;padding:6px 9px}
}
@media(prefers-reduced-motion:reduce){
  .button-pink,.course-card,.value-icon{animation:none;transition:none}
}


/* 11 — Requinte claro, conforme imagens aprovadas por Ale (26/10/2026)
   Somente faixa dos diferenciais e acabamentos dos ícones.
   O restante da identidade Tech é mantido. */
:root{
  --synale-metal-outline:linear-gradient(
    133deg,
    #fff8e0 0%,#d5a14d 13%,#fff1c4 28%,
    #a76a2b 43%,#f3d394 57%,#be8338 73%,
    #fff4ce 88%,#c89343 100%
  );
  --synale-icon-light:linear-gradient(
    143deg,#fffefe 0%,#fffefa 52%,#f8f1ea 100%
  );
}

/* O painel volta a ser CLARO. Os efeitos tech das outras áreas permanecem. */
.value-bar{
  border:1px solid rgba(216,192,220,.66);
  background:linear-gradient(125deg,#fffdfd 0%,#fbf7ff 50%,#fff8fb 100%);
  box-shadow:0 16px 39px rgba(86,60,142,.09),inset 0 1px 0 #fff;
}
.value-bar::before,.value-bar::after{
  content:none;
  display:none;
}
.value-item+.value-item:before{border-left-color:rgba(188,166,214,.38)}
.value-item h3{color:#292a57}
.value-item p{color:#535679}

/* Aro ouro-metalizado e interior claro; nenhum ícone fica preenchido de ouro. */
.value-icon,
.mini-value-icon,
.course-heading-mark,
.photo-hint-icon,
.contact-channel-icon{
  border:2px solid transparent;
  background:var(--synale-icon-light) padding-box,
             var(--synale-metal-outline) border-box;
  color:#6b45b7;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -2px 5px rgba(172,129,72,.05),
    0 8px 21px rgba(83,57,139,.10);
}
.value-icon{border-radius:50%}
.mini-value-icon,.course-heading-mark{border-radius:50%}
.photo-hint-icon{border-radius:17px}
.contact-channel-icon{border-radius:12px}

/* Retira os halos e a pintura de reflexos do círculo ouro maciço anterior. */
.value-icon::before,.value-icon::after{
  content:none;
  display:none;
}
.value-icon .icon{
  color:#6944b7;
  stroke-width:1.85;
  filter:none;
}
.mini-value-icon .icon,
.course-heading-mark .icon,
.photo-hint-icon .icon,
.contact-channel-icon .icon{
  color:#6944b7;
  stroke-width:1.85;
}

/* Ícone quadradinho do espaço ilustrado de cursos, quando usado. */
.card-photo-fallback .icon{
  box-sizing:border-box;
  border:2px solid transparent;
  border-radius:14px;
  padding:9px;
  color:#6944b7;
  opacity:1;
  background:var(--synale-icon-light) padding-box,
             var(--synale-metal-outline) border-box;
  box-shadow:0 7px 17px rgba(83,57,139,.10);
}

/* Seta circular dos cursos: acabamento claro e contorno dourado, sem SVG pseudo. */
.course-card-bottom .icon{
  border:1.5px solid transparent;
  border-radius:50%;
  color:#6944b7;
  background:var(--synale-icon-light) padding-box,
             var(--synale-metal-outline) border-box;
  box-shadow:inset 0 1px 0 #fff,0 5px 12px rgba(83,57,139,.08);
}
@media(max-width:700px){
  .photo-hint-icon{border-radius:14px}
  .contact-channel-icon{border-radius:10px}
}


/* 12 — Contraste do lettering sobre o novo hero (26/10/2026).
   Branco com sombra escura para manter a leitura nas áreas iluminadas da imagem. */
.hero-handwritten,
.hero-handwritten span:not(.note-underline){
  color:#ffffff;
  text-shadow:
    0 2px 2px rgba(17,10,37,.98),
    0 3px 8px rgba(20,8,46,.92),
    1px 0 3px rgba(20,8,46,.76),
    -1px 0 3px rgba(20,8,46,.76);
}


/* 13 — Molduras de metal realçado — 26/10/2026.
   Ouro-champagne + reflexos branco-prata e violeta-cromado.
   A máscara vazada de styles.css continua em vigor, preservando os formatos. */
.hero-swoosh,.sinais-ribbon,.founder-halo{
  opacity:1;
  padding:15px;
  filter:drop-shadow(0 7px 7px rgba(65,39,92,.24))
         drop-shadow(0 0 9px rgba(243,197,105,.31));
}
/* A alternância entre ouro claro / ouro escuro / reflexos quase brancos
   cria um acabamento cromado perceptível, sem preencher o interior das molduras. */
.hero-swoosh{
  background:conic-gradient(from 225deg,
    #935321 0deg,#f6c468 9deg,#fffdf1 14deg,#d59740 20deg,
    #a76b2a 27deg,#ffedb0 39deg,#fff9de 44deg,#bc7e35 52deg,
    #eac78a 66deg,#b973bc 87deg,#fff5ff 94deg,#6849c8 105deg,
    #b5a1ff 117deg,#fdf4ff 126deg,#7458db 134deg,
    #9168d9 154deg,#f5dcff 162deg,#5b40b9 173deg,
    #d379bf 195deg,#fff4fc 203deg,#a64da2 214deg,
    #e5a6bd 234deg,#f7d794 243deg,#fff9df 249deg,
    #b97733 258deg,transparent 306deg,transparent 329deg,#935321 360deg);
}
.sinais-ribbon{
  background:conic-gradient(from 166deg,
    #87511f 0deg,#efbd68 7deg,#fffaf0 13deg,#bb7b32 19deg,
    #ffe6a2 28deg,#a56a2b 34deg,#f1c777 45deg,
    #fffce7 52deg,#b47735 59deg,#f2d6a1 70deg,
    #e1a3cc 91deg,#fff0fc 99deg,#925ad0 110deg,
    #d2b6ff 125deg,#6e45c5 140deg,#fef2ff 152deg,
    #966adc 168deg,#6041c4 186deg,#c7b0fb 196deg,
    #fff8ff 202deg,#805bd5 213deg,#6546b7 231deg,
    #ead0fc 240deg,#fff8dd 249deg,
    transparent 320deg,transparent 359deg);
}
.founder-halo{
  background:conic-gradient(from 28deg,
    transparent 0deg,transparent 31deg,
    #9b6427 39deg,#fff7d6 46deg,#cc8f3d 55deg,
    #f8d68c 66deg,#fffef1 73deg,#b77830 81deg,
    #f7d993 99deg,#fff8d8 106deg,#be8340 115deg,
    #e7a4bd 137deg,#fff3ff 146deg,#9c6eda 157deg,
    #6042be 179deg,#f1ddff 191deg,#9577eb 199deg,
    #fffafd 205deg,#6c51cb 219deg,#a382eb 235deg,
    #fff0fb 247deg,#7253c8 261deg,#d6a4da 279deg,
    #fff1fb 288deg,#a56ad1 299deg,transparent 347deg,transparent 360deg);
}
@media(max-width:700px){
  .hero-swoosh,.sinais-ribbon,.founder-halo{padding:11px}
}


/* 14 — Grades digitais apenas nas seções combinadas — 26/10/2026.
   Hero, A Synale e Áreas de ensino mantêm seus grids atuais.
   Centro Sinais: bordas externas apenas, sem interferir na foto.
   Maryelle: trama discreta na área de fundo do retrato.
   A seção Contato permanece intocada. */
.sinais-section::before,
.founder-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(138,91,208,.13) 1px,transparent 1px),
    linear-gradient(90deg,rgba(138,91,208,.13) 1px,transparent 1px);
  background-size:56px 56px;
}
.sinais-section::before{
  opacity:.32;
  -webkit-mask-image:linear-gradient(90deg,
    #000 0%,rgba(0,0,0,.6) 9%,transparent 30%,
    transparent 70%,rgba(0,0,0,.6) 91%,#000 100%);
  mask-image:linear-gradient(90deg,
    #000 0%,rgba(0,0,0,.6) 9%,transparent 30%,
    transparent 70%,rgba(0,0,0,.6) 91%,#000 100%);
}
.founder-section::before{
  opacity:.37;
  -webkit-mask-image:linear-gradient(90deg,transparent 29%,rgba(0,0,0,.24) 51%,#000 95%);
  mask-image:linear-gradient(90deg,transparent 29%,rgba(0,0,0,.24) 51%,#000 95%);
}
.sinais-section>.container,
.founder-section>.container{
  position:relative;
  z-index:1;
}
@media(max-width:700px){
  .sinais-section::before,.founder-section::before{background-size:42px 42px}
  .sinais-section::before{opacity:.25}
  .founder-section::before{opacity:.28}
}

/* 15 — Privacidade e cartão do Instituto (oculto até a estreia oficial).
   Mantém o cartão e sua configuração no HTML para ativação futura. */
.contact-channel[data-contact-channel="website"]{display:none}
.contact-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:990px){
  .contact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .contact-grid{grid-template-columns:1fr}
}
.footer-privacy-link{
  color:#6554a4;
  text-decoration:underline;
  text-decoration-color:rgba(101,84,164,.35);
  text-underline-offset:3px;
  font-weight:700;
}
.footer-privacy-link:hover{color:#c9588a;text-decoration-color:currentColor}
