/*
Theme Name: Somos Guatemala - Próximamente
Theme URI: https://somosguatemala.com/
Author: Somos Guatemala
Author URI: https://somosguatemala.com/
Description: Tema minimalista de página Próximamente para SomosGuatemala.com.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: somos-guatemala-coming-soon
*/

:root{
  --bg:#06130d;
  --bg2:#020806;
  --green:#117249;
  --green2:#1a8b58;
  --red:#b21f2d;
  --white:#f7faf8;
  --muted:rgba(247,250,248,.68);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{min-height:100vh;background:var(--bg2);color:var(--white);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
.sg-page{
  min-height:100vh;position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:32px clamp(22px,4vw,72px) 28px;
  background:
    radial-gradient(circle at 72% 26%,rgba(17,114,73,.24),transparent 34%),
    radial-gradient(circle at 22% 82%,rgba(178,31,45,.08),transparent 28%),
    linear-gradient(145deg,#081a12 0%,#05110b 50%,#020806 100%);
}
.sg-page::before{
  content:"";position:absolute;inset:0;z-index:-3;opacity:.09;
  background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:72px 72px;
}
.sg-page::after{
  content:"";position:absolute;width:52vw;height:52vw;right:-22vw;top:-20vw;z-index:-2;
  border:1px solid rgba(255,255,255,.10);border-radius:50%;
  box-shadow:0 0 0 70px rgba(255,255,255,.012),0 0 0 140px rgba(255,255,255,.008);
}
.sg-topbar,.sg-footer{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5}
.sg-brand{display:inline-flex;align-items:center;gap:13px;color:inherit;text-decoration:none}
.sg-mark{
  width:44px;height:44px;border:1px solid rgba(255,255,255,.72);border-radius:50%;
  display:grid;place-items:center;font-weight:700;font-size:13px;background:rgba(255,255,255,.035)
}
.sg-brand-copy{display:flex;flex-direction:column;line-height:.9;letter-spacing:.08em;font-size:14px}
.sg-brand-copy strong{font-size:17px;letter-spacing:.02em}
.sg-domain{font-size:12px;font-weight:500;letter-spacing:.12em;color:rgba(255,255,255,.56)}
.sg-content{width:min(900px,100%);position:relative;z-index:4;padding:9vh 0 7vh}
.sg-eyebrow{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:24px;font-size:12px;
  font-weight:700;letter-spacing:.23em;color:rgba(255,255,255,.70)
}
.sg-eyebrow::before{content:"";width:34px;height:2px;background:linear-gradient(90deg,var(--green2),var(--red))}
.sg-title{margin:0;max-width:900px;font-weight:700;font-size:clamp(58px,9vw,132px);line-height:.88;letter-spacing:-.075em}
.sg-intro{max-width:600px;margin:30px 0 0;color:var(--muted);font-size:clamp(16px,1.5vw,20px);line-height:1.65}
.sg-coming{display:flex;align-items:center;gap:18px;width:min(520px,100%);margin-top:48px;font-size:10px;font-weight:700;letter-spacing:.30em;color:rgba(255,255,255,.62)}
.sg-line{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(255,255,255,.34))}
.sg-line:last-child{background:linear-gradient(90deg,rgba(255,255,255,.34),transparent)}
.sg-footer{justify-content:flex-start;gap:11px;color:rgba(255,255,255,.43);font-size:10px;text-transform:uppercase;letter-spacing:.17em}
.sg-dot{width:3px;height:3px;border-radius:50%;background:var(--red)}
.sg-glow{position:absolute;border-radius:50%;filter:blur(95px);z-index:-1;pointer-events:none}
.sg-glow-a{width:380px;height:380px;left:-170px;top:22%;background:rgba(18,128,78,.16)}
.sg-glow-b{width:260px;height:260px;right:8%;bottom:-120px;background:rgba(181,29,43,.09)}
.sg-feather{position:absolute;border:1px solid rgba(55,167,107,.16);border-left:0;border-bottom:0;border-radius:100% 0 100% 0;transform-origin:center;pointer-events:none}
.sg-feather-a{width:58vw;height:21vw;min-width:580px;min-height:210px;right:-18vw;bottom:4vh;transform:rotate(-19deg)}
.sg-feather-b{width:44vw;height:16vw;min-width:480px;min-height:170px;right:-9vw;bottom:12vh;transform:rotate(-25deg);opacity:.55}
@media(max-width:700px){
  .sg-page{padding:24px 20px 22px}
  .sg-domain{display:none}
  .sg-content{padding:14vh 0 10vh}
  .sg-title{font-size:clamp(58px,18vw,88px)}
  .sg-intro{font-size:16px;max-width:92%}
  .sg-coming{margin-top:38px;gap:12px;letter-spacing:.20em}
  .sg-feather-a{right:-62vw;bottom:12vh}
  .sg-feather-b{right:-53vw;bottom:18vh}
}