/*
Theme Name: DSTavares
Description: Reprodução do layout institucional DSTavares em WordPress.
Version: 1.0.0
Text Domain: dstavares
*/

    :root { color-scheme: dark; --bg:#000; --ink:#fff; --muted:#bac5c8; --blue:#3D5EFF; }
    * { box-sizing:border-box; }
    html { background:var(--bg); }
    body { margin:0; position:relative; isolation:isolate; min-height:100svh; background:var(--bg); color:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
    /* Midnight Mist: camada decorativa atrás de todo o conteúdo. */
    body::before {
      content:"";
      position:absolute;
      inset:0;
      z-index:-1;
      pointer-events:none;
      background-image:
        radial-gradient(circle at 50% 100%, rgba(70, 85, 110, 0.5) 0%, transparent 60%),
        radial-gradient(circle at 50% 100%, rgba(99, 102, 241, 0.4) 0%, transparent 70%),
        radial-gradient(circle at 50% 100%, rgba(181, 184, 208, 0.3) 0%, transparent 80%);
    }
    .page { max-width:1560px; margin:auto; min-height:100svh; display:flex; flex-direction:column; padding:48px 6vw 28px; }
    header { display:flex; justify-content:space-between; align-items:center; }
    .label { font-size:11px; line-height:1.5; letter-spacing:.17em; text-transform:uppercase; color:var(--muted); }
    .marker { width:14px; height:14px; background:var(--blue); }
    main { flex:1; display:grid; grid-template-columns:1.1fr 1fr; gap:8vw; align-items:center; padding:104px 0 116px; }
    .identity { margin:0; }
    .identity img { display:block; width:100%; height:auto; max-width:570px; }
    .intro { max-width:510px; }
    h1 { margin:0 0 28px; font-size:clamp(44px,5.2vw,78px); font-weight:700; line-height:1.02; letter-spacing:-.055em; }
    h1 span { display:block; }
    p { margin:0; color:var(--muted); font-size:17px; line-height:1.75; text-wrap:pretty; }
    .contact { display:inline-flex; gap:22px; align-items:center; margin-top:40px; padding:0 0 10px; border-bottom:1px solid #627174; color:var(--ink); text-decoration:none; font-size:clamp(16px,1.55vw,21px); line-height:1.5; transition:border-color .2s; }
    .contact svg { width:20px; height:20px; flex-shrink:0; transition:transform .2s; }
    .contact:hover { border-color:var(--blue); }
    .contact:hover svg { transform:translate(3px,-3px); }
    .contact:focus-visible { outline:2px solid #fff; outline-offset:8px; border-color:var(--blue); }
    footer { border-top:1px solid #ffffff24; padding-top:22px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
    .descriptor { margin:0; color:#fff; font-size:13px; line-height:1.6; letter-spacing:.015em; }
    .descriptor span { color:#8ba0ff; }
    .copyright { color:var(--muted); font-size:11px; letter-spacing:.03em; }
    @media(min-width:1600px) { .page { padding-left:88px; padding-right:88px; } }
    @media(max-width:800px) {
      .page { padding:28px 7vw 24px; }
      main { grid-template-columns:1fr; gap:64px; padding:76px 0 64px; }
      .identity img { max-width:440px; width:85%; }
      .intro { max-width:530px; }
      h1 { font-size:clamp(44px,9vw,68px); margin-bottom:24px; }
      p { font-size:16px; line-height:1.7; }
      .contact { margin-top:30px; font-size:18px; gap:18px; }
    }
    @media(max-width:420px) {
      main { gap:52px; padding-top:60px; }
      .identity img { width:92%; }
      .contact { font-size:16px; gap:16px; }
      footer { align-items:flex-start; flex-direction:column; gap:10px; }
      .descriptor { font-size:12px; }
    }
    @media(prefers-reduced-motion:reduce) { .contact,.contact svg { transition:none; } }