/* R178/016 Tela cover. Fonts extracted from approved index.html @font-face. 2D only. */
@font-face{font-family:Nunito;src:url(nunito.woff2) format("woff2");font-weight:200 1000;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url(nunito-sans.woff2) format("woff2");font-weight:200 1000;font-display:swap}
@font-face{font-family:Atkinson;src:url(atkinson.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Bricolage;src:url(bricolage.woff2) format("woff2");font-weight:200 800;font-display:swap}

body[data-view="cover"]{
  margin:0;
  color:#214d40;
  background:#e9e7dc;
  background-image:none;
  font-family:"Nunito Sans",sans-serif;
  font-weight:500;
  font-synthesis:none;
}
body[data-view="cover"] a{color:inherit;text-underline-offset:4px}
body[data-view="cover"] a:focus-visible,body[data-view="cover"] .tapa-btn:focus-visible{
  outline:3px solid currentColor;outline-offset:4px
}

.r178-skip{
  position:fixed;top:-90px;left:20px;z-index:10;background:#fcf9ef;padding:12px;color:#163d2f;font:700 16px Atkinson,sans-serif;text-decoration:none
}
.r178-skip:not(:focus){width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.r178-skip:focus{top:10px}

.r178-desk{
  min-height:100svh;padding:46px 32px;
  background:radial-gradient(ellipse at 50% 35%,#f9f7ef,transparent 70%);
}
.r178-plane{position:relative;max-width:1060px;min-height:810px;margin:auto;isolation:isolate}

.r178-notebook{
  position:absolute;inset:0;z-index:0;border-radius:12px 24px 24px 12px;
  background:#fcf9ef;
  background-image:linear-gradient(#afc9c31a 1px,transparent 1px),linear-gradient(90deg,#afc9c31a 1px,transparent 1px);
  background-size:26px 26px;border:1px solid #d9d8c8;
  box-shadow:3px 4px 0 #dddcca,6px 7px 0 #fcf9ef,9px 11px 0 #295c46,19px 25px 36px #23483025
}
.r178-notebook:after{content:"";position:absolute;left:42px;top:0;bottom:0;border-left:1px solid #dcbbb055}
.r178-rings{
  position:absolute;left:-12px;top:40px;bottom:40px;width:26px;
  background:repeating-linear-gradient(transparent 0 45px,#53685c 46px,#cbd1c8 48px,#4b6056 51px,transparent 54px);
  border-radius:9px
}
.r178-tabs{position:absolute;left:100%;top:96px;display:grid;gap:14px}
.r178-tabs i{width:20px;height:70px;background:#efd57c;border-radius:0 8px 8px 0;display:block}
.r178-tabs i:nth-child(2){background:#dfb5c1}
.r178-tabs i:nth-child(3){background:#a9c9cd}

.r178-spiral{
  position:absolute;top:24px;bottom:24px;left:-3px;width:22px;z-index:6;pointer-events:none;
  background-repeat:repeat-y;background-size:22px 24px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='24' viewBox='0 0 22 24'%3E%3Cdefs%3E%3ClinearGradient id='w' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23d9ded6'/%3E%3Cstop offset='.45' stop-color='%237d8f84'/%3E%3Cstop offset='1' stop-color='%2334463d'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cellipse cx='15.5' cy='15' rx='2.6' ry='2.2' fill='%232f3d35' opacity='.8'/%3E%3Cpath d='M15.5 14.6C11 6.6 4.4 5.2 1.4 9.2' fill='none' stroke='%2323483018' stroke-width='3' transform='translate(.8 1.4)'/%3E%3Cpath d='M15.5 14.6C11 6.6 4.4 5.2 1.4 9.2' fill='none' stroke='url(%23w)' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M13.4 10.6C10.6 7.5 6.8 6.6 4 7.6' fill='none' stroke='%23f4f6f0' stroke-width='.7' stroke-linecap='round' opacity='.8'/%3E%3C/svg%3E")
}

.r178-copy{
  position:relative;z-index:2;min-height:810px;display:flex;flex-direction:column;
  padding:34px 62px 26px;
  background:#1d4030 url(tela.webp) 0 0/192px 192px;
  border-radius:12px 24px 24px 12px;
  box-shadow:inset 0 0 0 1px #0f2a1f,inset 0 2px 0 #ffffff14,inset -6px 0 10px #0000002e
}
.r178-copy #content{display:flex;flex-direction:column;padding:0;flex:1;outline:0}

.r178-tabs i{background:#b9cdb4;width:24px;box-shadow:inset -1px 0 0 #9cb49a}
.r178-tabs i:nth-child(2){background:#f1ecd9;box-shadow:inset -1px 0 0 #d8d0b5}
.r178-tabs i:nth-child(3){display:flex;align-items:center;justify-content:center;background:#cfdfc8;height:96px}
.r178-tabs b{display:block;writing-mode:vertical-rl;font:700 12px/1 Nunito,sans-serif;color:#163d2f;letter-spacing:.01em}

.tapa{position:static;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(34px,6vh,64px);min-height:740px;padding:40px 0}
.tapa-label{
  position:relative;width:min(480px,100%);padding:34px 30px 30px;text-align:center;color:#163d2f;
  background-color:#f3eedd;
  background-image:repeating-linear-gradient(0deg,#00000007 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#00000007 0 1px,transparent 1px 3px);
  border-radius:3px;box-shadow:0 1px 0 #ffffff66 inset,0 2px 3px #0000004d,0 8px 18px #0000002e
}
.tapa-label:before{content:"";position:absolute;inset:7px;border:1.5px dashed #b8ae92;border-radius:2px;pointer-events:none}
.tapa-brand{margin:0 0 10px;font:700 20px/1.2 Nunito,sans-serif;letter-spacing:-.01em;color:#163d2f}
.tapa h1{margin:0;font-family:Nunito,sans-serif;font-weight:700;font-size:clamp(40px,4.4vw,54px);line-height:1.04;letter-spacing:-.035em;color:#163d2f}
.tapa-rule{height:2px;margin:18px 6px 16px;background:#b9cbb3;border-radius:2px}
.tapa-opo{margin:0 0 8px;font:700 16px/1.35 Nunito,sans-serif;color:#1c4436}
.tapa-piloto{margin:0;font:600 15px/1.35 Nunito,sans-serif;color:#2c4f42}
.tapa-cta{display:flex;flex-direction:column;align-items:center;gap:14px;width:min(420px,100%)}
.tapa-btn{
  display:flex;align-items:center;justify-content:center;box-sizing:border-box;
  width:100%;min-height:60px;padding:16px 24px;border:1px solid #b9cbb3;border-radius:14px;
  background:#e7eedb;color:#163d2f;font:800 19px/1.2 Nunito,sans-serif;letter-spacing:-.005em;
  text-decoration:none;box-shadow:0 2px 0 #0f2a1f,0 6px 14px #00000033
}
.tapa-btn:hover{background:#f2f6ea}
.tapa-btn:active{transform:translateY(1px);box-shadow:0 1px 0 #0f2a1f,0 3px 8px #00000033}
.tapa-btn:focus-visible{outline:3px solid #fcf9ef;outline-offset:4px;box-shadow:0 0 0 2px #163d2f,0 6px 14px #00000033}
.tapa-note{margin:0;font:600 16px/1.3 Nunito,sans-serif;color:#f3eedd}
.tapa-band{
  position:absolute;top:-6px;bottom:-6px;right:11%;width:15px;border-radius:3px;
  background:repeating-linear-gradient(90deg,#123325 0 3px,#1a4232 3px 5px);
  box-shadow:-2px 0 4px #0000004d,2px 0 3px #00000033;pointer-events:none
}

@media(min-width:651px){
  .r178-spiral{left:-9px;top:40px;bottom:40px;width:28px;background-size:28px 30px}
}
@media(max-width:650px){
  .r178-desk{padding:0;background:#fcf9ef}
  .r178-plane{min-height:100svh;margin:0 7px 0 0}
  .r178-notebook{border-radius:0 11px 11px 0;box-shadow:3px 0 0 #d7d8c7,7px 0 0 #295c46}
  .r178-notebook:after{left:19px}
  .r178-rings{left:-7px;width:19px;top:24px;bottom:24px;background-size:100% 55px}
  .r178-tabs{display:none}
  .r178-copy{min-height:100svh;padding:25px 22px 22px 30px;border-radius:0 11px 11px 0}
  .tapa{min-height:calc(100svh - 47px);justify-content:space-between;gap:28px;padding:48px 0 24px}
  .tapa-label{margin-top:clamp(40px,11vh,110px);padding:28px 18px 24px}
  .tapa h1{font-size:39px}
  .tapa-opo{font-size:14px;letter-spacing:-.005em}
  .tapa-piloto{font-size:14.5px}
  .tapa-btn{font-size:18px;min-height:58px;padding:15px 16px}
  .tapa-band{right:5px;width:12px}
  .tapa-label,.tapa-cta{width:100%}
}
@media(max-width:360px){.tapa-opo{font-size:14px}.tapa h1{font-size:35px}}
@media(prefers-reduced-motion:reduce){
  .r178-desk *,.r178-desk *::before,.r178-desk *::after{animation:none!important;transition:none!important}
  .tapa-btn:active{transform:none}
}
