/*
Theme Name: Ferah Launch
Theme URI: https://ferah.com/
Author: ProSource Media
Description: A quiet-luxury launch page for Ferah, prepared as the first stage of a future Forge and WooCommerce site.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: ferah-launch
*/

@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@100;300;500&family=Raleway:wght@100;200;400&display=swap');

:root {
  --ferah-emerald: #1d4033;
  --ferah-bone: #f5ead8;
  --ferah-sand: #ebddc5;
  --ferah-clay: #c67139;
  --ferah-white: #fffdf8;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; }

body {
  background: var(--ferah-emerald);
  color: var(--ferah-white);
  font-family: "Figtree", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
}

.ferah-launch {
  min-height: 100svh;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--ferah-emerald);
}

.ferah-launch__image,
.ferah-launch__veil {
  position: absolute;
  inset: 0;
}

.ferah-launch__image {
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.ferah-launch__veil {
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(10, 24, 19, .78) 0%, rgba(10, 24, 19, .42) 35%, rgba(10, 24, 19, .03) 67%),
    linear-gradient(0deg, rgba(10, 24, 19, .46) 0%, transparent 42%);
}

.ferah-launch__inner {
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: clamp(1.5rem, 3.2vw, 3.5rem) clamp(1.25rem, 5vw, 6rem) clamp(1.5rem, 4vw, 3.75rem);
}

.ferah-launch__brand {
  width: clamp(10.5rem, 15vw, 14.5rem);
  height: auto;
  display: block;
}

.custom-logo-link { display: inline-block; }
.custom-logo {
  width: clamp(10.5rem, 15vw, 14.5rem);
  height: auto;
  display: block;
}

.ferah-launch__content {
  align-self: center;
  max-width: 42rem;
  padding: 3rem 0;
}

.ferah-launch__eyebrow,
.ferah-signup__label,
.ferah-launch__note {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: .28em;
  font-size: .72rem;
  font-weight: 400;
}

.ferah-launch__eyebrow { margin-bottom: 1.4rem; }

.ferah-launch__title {
  max-width: 9em;
  margin: 0;
  font-family: "Raleway", Georgia, serif;
  font-size: clamp(3.2rem, 7vw, 7.2rem);
  font-weight: 200;
  line-height: .93;
  letter-spacing: .3em;
  text-wrap: balance;
}

.ferah-launch__footer {
  display: grid;
  grid-template-columns: minmax(18rem, 34rem) auto;
  align-items: end;
  gap: 2rem;
}

.ferah-signup__label {
  display: block;
  margin-bottom: .85rem;
}

.ferah-signup__row {
  display: flex;
  border-bottom: 1px solid rgba(255, 253, 248, .8);
}

.ferah-signup input[type="email"] {
  min-width: 0;
  flex: 1;
  border: 0;
  border-radius: 0;
  outline: 0;
  padding: .75rem 1rem .75rem 0;
  background: transparent;
  color: var(--ferah-white);
  font: inherit;
  font-size: 1rem;
}

.ferah-signup input::placeholder { color: rgba(255, 253, 248, .75); }

.ferah-signup button {
  border: 0;
  padding: .75rem 0 .75rem 1rem;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  cursor: pointer;
}

.ferah-signup button:hover,
.ferah-signup button:focus-visible { color: var(--ferah-sand); }

.ferah-signup input:focus-visible,
.ferah-signup button:focus-visible { outline: 2px solid var(--ferah-bone); outline-offset: 4px; }

.ferah-launch__note { text-align: right; line-height: 1.8; }

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 720px) {
  .ferah-launch__image { object-position: 66% center; }

  .ferah-launch__veil {
    background:
      linear-gradient(180deg, rgba(10, 24, 19, .58) 0%, rgba(10, 24, 19, .08) 34%, rgba(10, 24, 19, .72) 100%),
      linear-gradient(90deg, rgba(10, 24, 19, .4), transparent 75%);
  }

  .ferah-launch__inner { padding: 1.5rem 1.25rem 1.75rem; }
  .ferah-launch__content { align-self: end; padding: 3rem 0 2.75rem; }
  .ferah-launch__title { font-size: clamp(3rem, 14vw, 4.8rem); }

  .ferah-launch__footer {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .ferah-launch__note { display: none; }
}

@media (prefers-reduced-motion: no-preference) {
  .ferah-launch__brand,
  .ferah-launch__content,
  .ferah-launch__footer {
    animation: ferah-reveal .9s ease-out both;
  }
  .ferah-launch__content { animation-delay: .12s; }
  .ferah-launch__footer { animation-delay: .24s; }
  @keyframes ferah-reveal {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
}
