/* Velura — hero & section layouts (bem double-dash) */

.stage{position:relative;overflow:hidden;padding:64px 0 48px}
.stage::after{
  content:"";position:absolute;top:-30%;right:-10%;width:60vw;height:60vw;max-width:680px;max-height:680px;
  background:radial-gradient(circle,rgba(138,92,209,.34),transparent 62%);
  filter:blur(8px);pointer-events:none;z-index:0;
}
.stage--row{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.stage--copy h1{margin-bottom:18px}
.stage--copy p{font-size:1.1rem;margin-bottom:28px}
.stage--actions{display:flex;gap:14px;flex-wrap:wrap}
.stage--media{position:relative}
.stage--media img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;aspect-ratio:3/2;object-fit:cover}
.stage--media::before{
  content:"";position:absolute;inset:-2px;border-radius:calc(var(--radius) + 2px);
  background:var(--holo);opacity:.5;z-index:-1;filter:blur(2px);
}
.stage--meta{display:flex;gap:30px;margin-top:30px;flex-wrap:wrap}
.stage--meta div{display:flex;flex-direction:column}
.stage--meta b{font-family:var(--ff-display);font-size:1.6rem;color:var(--text)}
.stage--meta span{font-size:.82rem;color:var(--text-soft);letter-spacing:.04em}

.section{padding:72px 0}
.section--head{max-width:680px;margin-bottom:40px}
.section--head p{margin-top:12px;font-size:1.05rem}
.section--alt{background:var(--bg-2)}

/* category / product tiles */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tile{
  position:relative;border-radius:var(--radius);overflow:hidden;background:var(--bg-3);
  border:1px solid var(--border);transition:transform .25s var(--ease),border-color .25s var(--ease);
}
.tile:hover{transform:translateY(-4px);border-color:var(--accent)}
.tile img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tile--body{padding:18px 20px 22px}
.tile--body h3{margin-bottom:6px}
.tile--price{font-family:var(--ff-display);color:var(--accent-2);font-size:1.15rem;margin-top:10px}

/* feature columns */
.cols{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.card{
  background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);
  padding:28px 26px;transition:border-color .25s var(--ease)}
.card:hover{border-color:var(--accent)}
.card h3{margin-bottom:10px}
.card--num{font-family:var(--ff-display);font-size:1.5rem;color:var(--accent-2);margin-bottom:14px;display:block}
.card p{font-size:.98rem}

/* steps */
.steps{counter-reset:s;display:grid;gap:18px}
.steps li{
  list-style:none;background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);
  padding:22px 24px 22px 70px;position:relative}
.steps li::before{
  counter-increment:s;content:counter(s);position:absolute;left:22px;top:22px;
  width:34px;height:34px;border-radius:50%;background:var(--bg-3);border:1px solid var(--accent);
  display:flex;align-items:center;justify-content:center;font-family:var(--ff-display);color:var(--accent-2)}
.steps h3{font-size:1.15rem;margin-bottom:5px}
.steps p{font-size:.96rem;margin:0}

/* pricing table */
.price-table{width:100%;border-collapse:collapse;background:var(--bg-2);border-radius:var(--radius);overflow:hidden;border:1px solid var(--border)}
.price-table caption{text-align:left;color:var(--text-soft);font-size:.9rem;margin-bottom:14px}
.price-table th,.price-table td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--border)}
.price-table thead th{font-family:var(--ff-body);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--accent-2)}
.price-table tbody tr:last-child td{border-bottom:0}
.price-table td:last-child{font-family:var(--ff-display);color:var(--text);white-space:nowrap}

/* team */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.member{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.member img{width:100%;aspect-ratio:2/3;object-fit:cover}
.member--body{padding:18px 20px 22px}
.member--body h3{font-size:1.2rem}
.member--role{color:var(--accent-2);font-size:.86rem;letter-spacing:.04em;margin:4px 0 10px}
.member--body p{font-size:.94rem}

/* faq */
.faq{max-width:820px}
.faq details{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-2);margin-bottom:12px;padding:4px 22px}
.faq summary{
  cursor:pointer;list-style:none;padding:18px 0;font-family:var(--ff-display);font-size:1.12rem;
  display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--accent-2);font-size:1.5rem;line-height:1;transition:transform .2s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 20px;font-size:.98rem}

/* contacts */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.contact-list{display:grid;gap:22px}
.contact-list div{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px}
.contact-list h3{font-size:1.05rem;margin-bottom:6px}
.contact-list a{color:var(--accent-2)}

/* cta band */
.cta-band{background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius);padding:48px 40px;text-align:center;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:var(--holo);opacity:.08;pointer-events:none}
.cta-band h2{margin-bottom:14px;position:relative}
.cta-band p{margin:0 auto 26px;position:relative}
.cta-band .stage--actions{justify-content:center;position:relative}

@media (max-width:980px){
  .tiles,.team-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .stage--row{grid-template-columns:1fr;gap:34px}
  .stage--media{order:-1}
  .cols,.tiles,.team-grid,.contact-grid{grid-template-columns:1fr}
  .cta-band{padding:38px 24px}
}
