/* Identidad tecnológica: 3D, trazos a mano y profundidad. */
:root { --mint: #b2efcb; --pencil: #edc979; }
h1,h2 { font-family: var(--body); font-weight: 700; letter-spacing: -.055em; }
h1 { line-height: 1.04; }
h2 { line-height: 1.1; }
.hero-home { background: #092e34; position: relative; }
.hero-home::before { content:""; position:absolute; inset:0; background: radial-gradient(ellipse at 80% 35%, #1c666080, transparent 60%); pointer-events:none; }
.hero-home .hero { position:relative; grid-template-columns:1.02fr 1fr; gap:35px; min-height:730px; padding-block:68px 58px; }
.hero-home h1 { font-size:clamp(3.75rem,5.8vw,5.25rem); max-width:12ch; }
.hero-home .hero-copy { position:relative; z-index:2; }
.hero-home .kicker { display:inline-flex; align-items:center; gap:10px; font-weight:500; }
.hero-home .kicker::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--mint); box-shadow:0 0 16px #b2efcb60; }
.sketch-word { color:var(--mint); position:relative; display:inline; }
.sketch-word svg { position:absolute; width:99%; height:25px; left:0; bottom:-13px; stroke:var(--pencil); stroke-width:3; fill:none; pointer-events:none; }
.hero-home .lead { margin-top:35px; }
.hero-home .button { background:var(--mint); color:#092e34; border-color:var(--mint); box-shadow:4px 4px 0 #051e23; }
.hero-home .button.secondary { background:transparent; border-color:#577b74; color:#f6f3ec; box-shadow:none; }
.creative-scene { position:relative; min-width:0; }
.scene-stage { width:100%; height:570px; position:relative; isolation:isolate; }
.scene-grid { position:absolute; inset:6% 2%; border-radius:50%; background-image:linear-gradient(#b2efcb10 1px, transparent 1px),linear-gradient(90deg,#b2efcb10 1px, transparent 1px); background-size:38px 38px; mask-image:radial-gradient(ellipse,black,transparent 72%); transform:perspective(600px) rotateX(13deg) rotateZ(-12deg); }
.lynx-canvas { display:block; width:100%; height:100%; position:relative; z-index:1; pointer-events:none; }
.scene-fallback { position:absolute; width:68%; top:16%; left:16%; border-radius:20px; transform:rotate(-7deg); box-shadow:15px 20px 0 #041f2660; visibility:hidden; }
.scene-stage[data-ready="false"] .scene-fallback { visibility:visible; }
.scene-doodles { position:absolute; inset:0; pointer-events:none; z-index:2; }
.orbit-sketch { position:absolute; inset:0; width:100%; height:100%; fill:none; stroke:var(--pencil); stroke-width:1.7; opacity:.75; }
.floating-tag { position:absolute; padding:12px 18px; border:1px solid #b2efcb60; border-radius:9px; background:#092e34d9; font:500 .8125rem/1.4 var(--body); color:#b2efcb; box-shadow:5px 5px 0 #06252b; }
.tag-code { top:7%; left:0; transform:rotate(-8deg); }
.tag-design { bottom:12%; right:0; transform:rotate(8deg); background:var(--accent); border-color:#e49b76; color:#0a181b; }
.scene-caption { position:absolute; left:3%; bottom:5%; font:1rem/1.5 "Comic Sans MS",cursive; color:var(--pencil); transform:rotate(-5deg); }
.sketch-bracket { position:absolute; top:40%; font:400 5rem/1 var(--display); color:var(--mint); opacity:.55; }
.bracket-left { left:0; transform:rotate(-15deg); }.bracket-right { right:0; transform:rotate(15deg); }
.scene-controls { display:flex; align-items:center; justify-content:space-between; gap:15px; color:#afc8c0; font-size:.75rem; padding:0 6px; }
.motion-toggle { min-height:44px; padding:9px 14px; border:1px solid #577b74; border-radius:24px; background:transparent; color:#dce8e2; font-size:.75rem; }
.scene-perspective { position:relative; }.scene-perspective summary { min-height:44px; display:flex; align-items:center; text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
.scene-perspective>div { position:absolute; bottom:52px; left:0; padding:16px; background:#103f46; border:1px solid #71908e; border-radius:12px; width:240px; z-index:4; box-shadow:5px 5px 0 #06252b; }
.scene-perspective label { display:block; margin-bottom:12px; }.scene-perspective label:last-child{margin-bottom:0;}.scene-perspective input{display:block;width:100%;height:28px;margin:4px 0 0;accent-color:var(--mint);}
.intro-strip { background:var(--mint); border-bottom:2px solid var(--ink); }
.intro-inner p { font-family:var(--body); font-size:1rem; font-weight:600; letter-spacing:-.03em; }
.intro-inner div span::before { content:"✳"; display:inline-block; margin-right:10px; color:#103f46; }
.brand-playground { display:grid; grid-template-columns:1.1fr 1fr; gap:110px; align-items:center; padding-bottom:45px; }
.brand-playground h2 { font-size:clamp(2.5rem,4vw,3.5rem); }
.brand-playground p { max-width:47ch; }
.outline-title { -webkit-text-stroke:1px var(--ink); color:transparent; }
.hand-note { font:1.125rem/1.5 "Comic Sans MS",cursive; color:#9c492d; transform:rotate(-5deg); margin-top:32px; display:flex; align-items:center; gap:5px; }
.hand-note svg { width:100px; height:65px; fill:none; stroke:currentColor; stroke-width:2.5; }
.brand-sample { width:min(100%,390px); position:relative; transform:rotate(5deg); margin-inline:auto; }
.brand-sample img { border:2px solid var(--ink); border-radius:17px; box-shadow:12px 12px 0 var(--mint); }
.sample-pin { position:absolute; top:-13px; left:calc(50% - 10px); width:21px; height:21px; border-radius:50%; background:var(--accent); border:2px solid #103f46; box-shadow:3px 3px 0 #103f46; z-index:1; }
.sample-code { position:absolute; bottom:-25px; left:-20px; background:var(--ink); color:var(--mint); border-radius:8px; padding:14px 20px; transform:rotate(-10deg); font:.8125rem/1.4 monospace; }
.sample-star { position:absolute; right:-25px; top:-35px; font-size:6rem; line-height:1; color:var(--accent); -webkit-text-stroke:2px #103f46; }
.page-opening { position:relative; padding-right:210px; }
.page-opening h1 { position:relative; z-index:1; max-width:19ch; }
.opening-doodles { position:absolute; width:205px; right:0; top:60px; color:var(--accent); }
.opening-doodles svg { fill:none; stroke:currentColor; stroke-width:2; }
.doodle-orbit { width:100%; height:auto; transform:rotate(-8deg); }
.doodle-fill { fill:var(--mint); }
.doodle-note { display:block; font:.875rem/1.4 "Comic Sans MS",cursive; transform:rotate(-7deg); text-align:center; color:#9c492d; }
.doodle-arrow { width:125px; height:65px; margin-left:15px; }
.service-row { border:1px solid var(--line); border-radius:14px; padding-inline:24px; margin-top:14px; background:var(--surface); }
.service-list { border-top:0; }
.service-icon { background:var(--mint); color:#103f46; border:1.5px solid #103f46; box-shadow:4px 4px 0 #103f46; transform:rotate(-6deg); }
.service-row:nth-child(2n) .service-icon { background:#efd5c2; transform:rotate(6deg); }
.service-row:nth-child(3) .service-icon { background:#dce3f4; }
.service-detail { background:var(--surface); border:1px solid var(--line); border-radius:16px; margin-block:16px; padding-inline:24px; }
.service-detail[open] { border-color:var(--ink); box-shadow:5px 5px 0 #b2efcb80; }
.service-details { border-top:0; }
.detail-title { font-family:var(--body); font-weight:700; letter-spacing:-.04em; font-size:clamp(1.5rem,2.6vw,2.2rem); }
.profile-card { box-shadow:10px 10px 0 #bed5c8; transform:rotate(-3deg); overflow:hidden; }
.profile-card::after { content:"✳"; position:absolute; right:-18px; top:44px; font:150px/1 var(--body); color:#b2efcb35; transform:rotate(13deg); }
.profile-card { position:relative; }.profile-name { position:relative; z-index:1; }
.formation-teaser { position:relative; overflow:hidden; border:2px solid #17243b; box-shadow:8px 8px 0 #c4cde4; }
.formation-teaser::before { content:"{ }"; position:absolute; right:40px; bottom:-25px; color:#6575a6; opacity:.25; font:12rem/1 var(--body); pointer-events:none; }
.mini-book { box-shadow:7px 7px 0 #344a77,14px 14px 0 #0e192c; transform:perspective(650px) rotateY(-14deg) rotateZ(-8deg); }
.resource-label { transform:rotate(8deg); border:2px solid #17243b; box-shadow:4px 4px 0 #6575a6; }
.course-opening { background:#e3e9f6; position:relative; overflow:clip; }
.course-hero .hero-copy::before { content:"✳"; position:absolute; top:-25px; right:12px; font:75px/1 var(--body); color:#6575a6; transform:rotate(-15deg); }
.course-hero .hero-copy { position:relative; }
.aula-board { border:2px solid #17243b; box-shadow:9px 9px 0 #aebcdc; transform:rotate(2deg); }
.aula-board-top { background:#17243b; }
.aula-tabs button[aria-selected="true"] { box-shadow:3px 3px 0 #6575a6; border:1px solid #6575a6; }
.contact-card { box-shadow:8px 8px 0 #b2efcb; border:2px solid var(--ink); transform:rotate(-2deg); }
.contact-band { background:#dcebdd; position:relative; overflow:hidden; }
.contact-band::after { content:"↗"; position:absolute; right:-20px; bottom:-25px; font:12rem/1 var(--body); color:#b4d0bb; pointer-events:none; }
.contact-band .contact { position:relative; z-index:1; }
.empty-art { border:2px solid var(--ink); box-shadow:8px 8px 0 #bfdacb; transform:rotate(-4deg); }
@media (hover:hover) and (pointer:fine) {
  .service-row:hover { background:#e8f2e7; border-color:var(--ink); transform:translate(-2px,-2px); box-shadow:5px 5px 0 var(--mint); }
  .service-row:hover .service-icon { transform:perspective(400px) rotateY(-18deg) rotateZ(2deg); }
  .brand-sample:hover { transform:rotate(0); }
}
@media (prefers-reduced-motion:no-preference) {
  .service-row,.service-icon,.brand-sample { transition:transform 220ms var(--ease-out),background-color 220ms var(--ease-out),box-shadow 220ms var(--ease-out); }
  .scene-running .tag-code { animation:tag-drift 7s ease-in-out infinite; }
  .scene-running .tag-design { animation:tag-drift 8s ease-in-out -3s infinite reverse; }
  .reveal-ready { opacity:0; transform:translateY(22px); transition:opacity 550ms var(--ease-out),transform 550ms var(--ease-out); }
  .reveal-ready.is-visible { opacity:1; transform:translateY(0); }
  @keyframes tag-drift { 0%,100%{translate:0 0}50%{translate:0 -10px} }
}
.motion-paused .scene-running .floating-tag { animation-play-state:paused; }
@media (forced-colors:active) { .outline-title{color:CanvasText;-webkit-text-stroke:0;} }
@media (prefers-reduced-motion:reduce) { .reveal-ready { opacity:1;transform:none; } }
@media(max-width:68rem) {
  .hero-home .hero { gap:10px; min-height:650px; }.hero-home h1 { font-size:clamp(3.25rem,6.3vw,4.6rem); }
  .scene-stage { height:480px; }.floating-tag{font-size:.6875rem;padding:10px 12px;}.scene-caption{font-size:.875rem;}.scene-controls{flex-wrap:wrap;}
  .brand-playground { gap:65px; }.brand-sample{width:85%;}.page-opening{padding-right:165px;}.opening-doodles{width:155px;}
}
@media(max-width:48rem) {
  .hero-home .hero { grid-template-columns:1fr; min-height:0; gap:25px; padding-block:44px 40px; }
  .hero-home h1 { font-size:clamp(3rem,10.6vw,4.5rem); max-width:13ch; }.hero-home .lead{margin-top:30px;}
  .creative-scene{width:min(100%,480px);margin:auto;}.scene-stage{height:390px;}.tag-code{top:2%;}.tag-design{bottom:13%;}.scene-caption{bottom:1%;}.scene-controls{margin-top:14px;font-size:.6875rem;}
  .brand-playground{grid-template-columns:1fr;gap:60px;padding-bottom:30px;}.brand-playground h2{font-size:2.5rem;}.brand-sample{width:min(84%,320px);margin-bottom:40px;}.sample-star{right:-22px;font-size:5rem;}
  .hand-note{margin-top:20px;}.hand-note svg{height:48px;}.sample-code{font-size:.6875rem;left:-10px;padding:12px 16px;}
  .page-opening{padding-right:0;padding-top:70px;}.page-opening h1{font-size:clamp(2.7rem,9.8vw,3.5rem);}.opening-doodles{width:68px;right:4px;top:6px;}.doodle-note,.doodle-arrow{display:none;}
  .service-row{padding-inline:14px;}.service-icon{box-shadow:3px 3px 0 #103f46;}.service-detail{padding-inline:16px;}.detail-body{padding-left:0;}.detail-title{font-size:1.4rem;}
  .profile-card{transform:rotate(-2deg);width:calc(100% - 10px);}.formation-teaser{width:calc(100% - 8px);}.aula-board{transform:rotate(0);width:calc(100% - 9px);}.course-hero .hero-copy::before{font-size:47px;top:-25px;right:0;}
  .empty-art{width:calc(100% - 12px);max-width:330px;}.contact-card{width:calc(100% - 8px);transform:rotate(0);}
}
@media(max-width:23rem) { .scene-stage{height:325px;}.scene-caption{font-size:.75rem;}.floating-tag{font-size:.625rem;}.hero-home h1{font-size:2.85rem;}.brand-playground h2{font-size:2.25rem;}.hand-note{font-size:1rem;}.service-detail{padding-inline:12px;} }