@font-face {font-family: 'Sora'; font-style: normal; font-weight: 400; src: local('sora-regular'), url('../fonts/sora-regular.woff') format('woff'); font-display: swap;}
@font-face {font-family: 'Sora'; font-style: normal; font-weight: 700; src: local('sora-bold'), url('../fonts/sora-bold.woff') format('woff');font-display: swap;}

body{margin:0;padding:0;background:radial-gradient(ellipse at top left,#e7542c 0%, transparent 65%),radial-gradient(ellipse at bottom left,  #de5a5e 0%, transparent 65%),radial-gradient(ellipse at top right,    #dd3a36 0%, transparent 65%),radial-gradient(ellipse at bottom right, #f2a51f 0%, transparent 65%);background-color: #f2a51f;min-height:100vh;font-family:'Sora';display: flex;flex-direction: column;}

  :root {
    --bg: #E8672B;
    --dark: #17213A;
    --white: #FFFFFF;
    font-size:10px;
  }

  * { box-sizing: border-box; }


  header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 28px 5rem;
  }

  .logo {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .logo img { width: auto; height: 40px; }

  .contact-btn {
    height:5.6rem;
    font-family:'Sora';
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--white);
    color: var(--dark);
    border: none;
    border-radius: 999px;
    padding: 10px 20px;
    font-size: 22px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: all .25s ease-in-out;
  }

  .contact-btn:hover{
    background:#fbe7d1de;
  }

  main {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 24px;
  }

  h1 {
    font-size: 10rem;
    color: var(--dark);
    margin: 0 0 0;
  }

  p {
    font-size: 2.2rem;
    color: var(--dark);
    margin: 0 0 4.8rem;
  }

  .socials {
    display: flex;
    gap: 2.4rem;
  }

  .socials a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
  }

  .socials svg { width: 18px; height: 18px; }
  @media (max-width: 992px) {
      h1 {font-size: 7rem;}
      .contact-btn span{display:none;}
      .contact-btn {height:4.5rem;padding:10px 12px;}
  @media (max-width: 576px) {
    h1 {font-size: 3.75rem;}
    header { padding: 20px 24px; }
      p {font-size: 1.6rem;
        line-height: 1.5;margin-bottom:3rem
  }