/* =========================================================
   Grupo Ilha Vip — página de links
   Mesma paleta do site (oceano, dourado, areia), clima mais
   escuro e editorial: brilho atrás da foto, dourado metálico.
   ========================================================= */
:root{
  --ink:#07131f;
  --ocean:#0b2236;
  --tide:#1d4d6b;
  --gold:#c9a96a;
  --gold-hi:#e8d3a3;
  --gold-lo:#8a6a35;
  --sand:#f3ede3;
  --muted:rgba(243,237,227,.62);
  --line:rgba(243,237,227,.1);
  --card:rgba(243,237,227,.045);
  --metal:linear-gradient(100deg,var(--gold-lo) 0%,var(--gold) 45%,var(--gold-hi) 100%);
  --ease:cubic-bezier(.22,1,.36,1);
  --display:'Bricolage Grotesque',system-ui,sans-serif;
  --body:'Inter',system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{min-height:100svh;background:var(--ink);color:var(--sand);font-family:var(--body);font-size:15px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none;cursor:pointer}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{list-style:none}
::selection{background:var(--gold);color:var(--ink)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:8px}
.ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- fundo ---------- */
.bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.glow{position:absolute;border-radius:50%;filter:blur(60px)}
.glow--a{width:780px;height:780px;right:-260px;top:-180px;background:radial-gradient(circle,rgba(201,169,106,.32),transparent 65%);animation:breathe 9s ease-in-out infinite}
.glow--b{width:900px;height:900px;left:-420px;bottom:-380px;background:radial-gradient(circle,rgba(29,77,107,.55),transparent 65%);animation:breathe 12s ease-in-out infinite reverse}
@keyframes breathe{50%{transform:scale(1.12) translate(-30px,30px);opacity:.8}}
.grain{position:absolute;inset:-50%;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.page{width:min(1080px,100%);margin:0 auto}

/* ---------- pieces ---------- */
.brand{font-family:var(--display);font-weight:700;font-size:1.25rem;letter-spacing:-.05em;line-height:1}
.brand i{font-style:normal;color:var(--gold)}
.kicker{display:inline-block;font-size:.66rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:var(--muted)}
.grad{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
h1,h2,h3{font-family:var(--display);font-weight:300;letter-spacing:-.03em;line-height:1.05}
h2{font-size:clamp(1.9rem,6vw,2.6rem)}

.pill{position:relative;display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:100px;background:var(--metal);color:var(--ink);font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;overflow:hidden;isolation:isolate;box-shadow:0 0 0 4px rgba(201,169,106,.12),0 10px 26px -12px rgba(201,169,106,.6);transition:transform .5s var(--ease),box-shadow .5s}
.pill::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);transition:transform .9s var(--ease);z-index:-1}
.pill:hover{transform:translateY(-2px);box-shadow:0 0 0 6px rgba(201,169,106,.16),0 16px 32px -12px rgba(201,169,106,.7)}
.pill:hover::after{transform:translateX(120%)}
.pill .ic{width:15px;height:15px;transition:transform .5s var(--ease)}
.pill:hover .ic{transform:rotate(45deg)}
.pill--lg{padding:15px 26px}

/* ---------- compartilhar ---------- */
.share{position:fixed;top:max(14px,env(safe-area-inset-top));right:14px;z-index:20;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(7,19,31,.55);border:1px solid var(--line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:background .3s,color .3s}
.share:hover{background:var(--gold);color:var(--ink)}

/* ---------- topo ---------- */
.js:not(.ready) .top{visibility:hidden}
.top{position:relative}
.top__photo{position:relative;height:min(68svh,620px);overflow:hidden;-webkit-mask:linear-gradient(180deg,#000 50%,transparent 97%);mask:linear-gradient(180deg,#000 50%,transparent 97%)}
.top__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.top__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,19,31,.2) 0%,rgba(7,19,31,0) 30%,rgba(7,19,31,.55) 80%)}
.seal{position:absolute;right:18px;bottom:30%;z-index:2;width:84px;height:84px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(201,169,106,.45);background:rgba(7,19,31,.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.seal svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 22s linear infinite}
.seal text{font-size:8.2px;letter-spacing:1.55px;fill:var(--gold);font-family:var(--body);font-weight:500}
.seal b{font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-.06em}
.seal i{font-style:normal;color:var(--gold)}
@keyframes spin{to{transform:rotate(360deg)}}

.top__copy{position:relative;z-index:2;margin-top:-120px;padding:0 22px;display:flex;flex-direction:column;align-items:center;text-align:center}
.top__copy .brand{font-size:1.5rem;margin-bottom:14px}
.top h1{font-size:clamp(2.3rem,9.5vw,3.6rem);margin:14px 0 16px}
.who{color:var(--muted);font-size:.9rem;line-height:1.5}
.who b{color:var(--sand);font-weight:600}
.quick{display:flex;gap:10px;margin-top:22px}
.quick a{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--card);transition:transform .45s var(--ease),background .3s,color .3s,border-color .3s}
.quick a:hover{transform:translateY(-4px);background:var(--gold);color:var(--ink);border-color:var(--gold)}

@media(min-width:900px){
  .top{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:min(100svh,820px);padding:0 40px}
  .top__photo{order:2;height:min(92svh,800px);-webkit-mask:radial-gradient(ellipse 50% 56% at 50% 42%,#000 50%,transparent 100%);mask:radial-gradient(ellipse 50% 56% at 50% 42%,#000 50%,transparent 100%)}
  .top__photo::after{background:none}
  .top::before{content:"";position:absolute;right:8%;top:12%;width:46%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(201,169,106,.28),transparent 65%);filter:blur(30px);z-index:-1}
  .seal{right:24%;bottom:30%;width:96px;height:96px}
  .top__copy{order:1;margin:0;padding:0 24px 0 20px;align-items:flex-start;text-align:left}
  .top h1{font-size:clamp(2.8rem,4.6vw,4rem)}
}

/* ---------- blocos ---------- */
.block{width:min(620px,100% - 32px);margin:56px auto 0}
.head{text-align:center;margin-bottom:28px}
.head h2{margin-top:10px}

/* links */
.links{display:flex;flex-direction:column;gap:10px}
.lk{position:relative;width:100%;display:flex;align-items:center;gap:14px;padding:12px 12px 12px 12px;border-radius:20px;background:var(--card);border:1px solid var(--line);text-align:left;overflow:hidden;isolation:isolate;transition:transform .5s var(--ease),border-color .4s,background .4s}
.lk::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 35%,rgba(201,169,106,.16) 50%,transparent 65%);transform:translateX(-110%);transition:transform 1s var(--ease)}
.lk:hover{transform:translateY(-2px);border-color:rgba(201,169,106,.45);background:rgba(243,237,227,.07)}
.lk:hover::before{transform:translateX(110%)}
.lk__ico{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(243,237,227,.07);color:var(--gold);flex:none}
.lk__txt{flex:1;min-width:0}
.lk__txt b{display:block;font-weight:600;font-size:.98rem;letter-spacing:-.01em}
.lk__txt small{display:block;color:var(--muted);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lk__go{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);flex:none;transition:transform .5s var(--ease),background .4s,color .4s,border-color .4s}
.lk__go .ic{width:15px;height:15px}
.lk:hover .lk__go:not(.lk__copy){transform:rotate(45deg);background:var(--gold);color:var(--ink);border-color:var(--gold)}
.lk--main{background:var(--metal);color:var(--ink);border:0;padding:14px 14px 14px 14px;box-shadow:0 0 0 5px rgba(201,169,106,.12),0 22px 44px -22px rgba(201,169,106,.75)}
.lk--main:hover{background:var(--metal)}
.lk--main::before{background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%)}
.lk--main .lk__ico{background:var(--ink);color:var(--gold)}
.lk--main small{color:rgba(7,19,31,.68)}
.lk--main .lk__go{border-color:rgba(7,19,31,.3)}
.lk--main:hover .lk__go:not(.lk__copy){background:var(--ink);color:var(--gold);border-color:var(--ink)}
.lk--main .lk__ico{animation:nudge 3.2s var(--ease) infinite 2s}
@keyframes nudge{0%,80%,100%{transform:none}86%{transform:rotate(-12deg) scale(1.06)}92%{transform:rotate(10deg) scale(1.06)}}
.lk--ghost{background:transparent;border-style:dashed}
.lk--split{padding:0}
.lk__hit{flex:1;min-width:0;display:flex;align-items:center;gap:14px;padding:12px}
.lk__copy{margin-right:12px}
.lk__copy:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}

/* cards de serviço */
.cards{display:flex;flex-direction:column;gap:14px}
.card{display:grid;grid-template-columns:1.15fr .85fr;gap:6px;padding:6px;border-radius:24px;background:linear-gradient(140deg,rgba(29,77,107,.32),rgba(243,237,227,.04));border:1px solid var(--line);overflow:hidden;transition:border-color .5s,transform .6s var(--ease)}
.card:hover{border-color:rgba(201,169,106,.4);transform:translateY(-3px)}
.card__txt{padding:20px 14px 20px 18px;display:flex;flex-direction:column;align-items:flex-start}
.card h3{font-size:1.45rem;font-weight:400;margin:10px 0 8px}
.card p{font-size:.84rem;color:var(--muted);margin-bottom:18px}
.card .pill{margin-top:auto;padding:10px 16px;font-size:.66rem}
.card__img{position:relative;border-radius:19px;overflow:hidden;min-height:210px}
.card__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.card:hover .card__img img{transform:scale(1.07)}
@media(max-width:420px){.card{grid-template-columns:1fr}.card__img{order:-1;min-height:170px;max-height:190px}}

/* sobre */
.about{display:grid;grid-template-columns:1fr;gap:22px;margin-top:72px}
.about__img{position:relative;aspect-ratio:4/4.4;border-radius:200px 200px 24px 24px;overflow:hidden;border:1px solid rgba(201,169,106,.3)}
.about__img img{width:100%;height:115%;object-fit:cover;object-position:50% 8%}
.about__txt h2{margin:10px 0 16px;font-size:clamp(2.2rem,8vw,3rem)}
.about__txt p{color:var(--muted);margin-bottom:12px;font-size:.92rem}
.about__txt p b{color:var(--sand);font-weight:500}
.rating{display:flex;align-items:center;gap:12px;margin:20px 0 24px;font-size:.82rem;color:var(--muted)}
.stars{display:flex;gap:2px;color:var(--gold)}
.stars .ic{width:15px;height:15px;fill:currentColor;stroke:none}
@media(min-width:620px){.about{grid-template-columns:.9fr 1.1fr;align-items:center;gap:32px}}

/* rodapé */
.foot{width:min(620px,100% - 32px);margin:72px auto 0;padding:28px 0 calc(32px + env(safe-area-inset-bottom));border-top:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;font-size:.74rem;color:var(--muted)}

/* tipos de empresa */
.head__sub{color:var(--muted);font-size:.9rem;margin-top:12px;max-width:44ch;margin-inline:auto}
.tipos{display:flex;flex-direction:column;gap:8px}
.tipo{display:flex;align-items:center;gap:14px;padding:14px 14px 14px 18px;border-radius:18px;background:var(--card);border:1px solid var(--line);transition:border-color .4s}
.tipo:hover{border-color:rgba(201,169,106,.4)}
.tipo__txt{flex:1;min-width:0}
.tipo__txt b{font-family:var(--display);font-weight:500;font-size:1.15rem;letter-spacing:-.02em}
.tipo__txt small{margin-left:8px;color:var(--muted);font-size:.78rem}
.tipo__txt p{color:var(--muted);font-size:.82rem;margin-top:2px}
.tipo__mais{flex:none;padding:8px 14px;border-radius:100px;border:1px solid rgba(201,169,106,.45);color:var(--gold);font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;transition:background .3s,color .3s}
.tipo__mais:hover{background:var(--gold);color:var(--ink)}
.outras{margin-top:12px;border-radius:18px;border:1px solid var(--line);background:rgba(243,237,227,.025)}
.outras summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px;cursor:pointer;font-weight:600;font-size:.9rem}
.outras summary::-webkit-details-marker{display:none}
.outras summary .ic{transition:transform .4s var(--ease);color:var(--gold)}
.outras[open] summary .ic{transform:rotate(180deg)}
.outras ul{padding:0 18px 8px}
.outras li{padding:12px 0;border-top:1px solid var(--line)}
.outras li b{display:block;font-weight:600;font-size:.92rem}
.outras li p{color:var(--muted);font-size:.82rem;margin-top:2px}
.link{color:var(--gold);border-bottom:1px solid rgba(201,169,106,.4)}

/* pop-up */
.modal{margin:auto;width:min(520px,100% - 24px);max-height:min(86svh,640px);padding:0;border:0;border-radius:24px;background:#0d1d2c;color:var(--sand);box-shadow:0 40px 80px -30px rgba(0,0,0,.8)}
.modal::backdrop{background:rgba(7,19,31,.7);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.modal[open]{animation:sobe .45s var(--ease)}
@keyframes sobe{from{opacity:0;transform:translateY(24px)}}
.modal__box{position:relative;padding:28px 24px 26px;border:1px solid rgba(201,169,106,.25);border-radius:24px}
.modal__x{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--line)}
.modal h3{font-size:1.7rem;font-weight:400;margin:10px 40px 14px 0}
.modal p{color:var(--muted);font-size:.92rem;margin-bottom:12px}
.modal .tipo__ex{padding:12px 14px;border-radius:14px;background:rgba(201,169,106,.08);border:1px solid rgba(201,169,106,.2);color:var(--sand)}
.modal .tipo__ex b{color:var(--gold);font-weight:600}
.modal .pill{margin-top:8px}
@media(max-width:520px){.modal{margin:auto auto 0;width:100%;max-width:100%;border-radius:24px 24px 0 0}.modal__box{border-radius:24px 24px 0 0;padding-bottom:calc(26px + env(safe-area-inset-bottom))}.tipo{flex-wrap:wrap}.tipo__txt small{display:block;margin:0}}

/* toast */
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:30;padding:12px 20px;border-radius:100px;background:var(--sand);color:var(--ink);font-size:.86rem;font-weight:600;box-shadow:0 18px 40px -14px rgba(0,0,0,.6);transform:translate(-50%,calc(100% + 60px));visibility:hidden;transition:transform .6s var(--ease),visibility .6s}
.toast.is-on{transform:translate(-50%,0);visibility:visible}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}