@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,600&family=Montserrat:wght@400;500;600&display=swap');

:root{--accent:#f2b4c7;--accent2:#b86a83;--dark:#2b2024;--ink:#0a080a}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#050405}
body{font-family:Montserrat,Arial,sans-serif;color:#fff}

.page{
  min-height:100vh;
  min-height:100svh;
  position:relative;
  display:flex;
  justify-content:center;
  background:url('dahianna.jpg') center top/cover no-repeat;
  overflow:hidden;
}

.overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(255,255,255,.02) 0%,rgba(8,5,8,.04) 33%,rgba(8,5,8,.63) 100%),
    linear-gradient(90deg,rgba(0,0,0,.03),transparent 42%,rgba(0,0,0,.08));
}

.page:after{
  content:"";
  position:absolute;
  inset:18px;
  border:1px solid rgba(242,180,199,.85);
  border-radius:18px;
  pointer-events:none;
}

.content{
  position:relative;
  z-index:2;
  width:min(100%,560px);
  min-height:100vh;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:52px 22px 34px;
}

h1{
  margin:0;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(40px,10.8vw,62px);
  line-height:.92;
  font-weight:600;
  letter-spacing:.105em;
  color:#30262b;
  text-shadow:0 2px 0 rgba(255,255,255,.55),0 4px 18px rgba(0,0,0,.22);
}

.script{
  margin-top:0;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-style:italic;
  font-size:clamp(42px,11.3vw,64px);
  line-height:.94;
  color:#6f3b4f;
  text-shadow:0 2px 0 rgba(255,255,255,.55),0 4px 18px rgba(0,0,0,.18);
}

.links{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:118px;
}

.link{
  min-height:66px;
  display:grid;
  grid-template-columns:54px 1fr 28px;
  align-items:center;
  gap:12px;
  padding:0 18px;
  border:1px solid rgba(242,180,199,.90);
  border-radius:38px;
  color:#fff;
  text-decoration:none;
  background:rgba(8,6,8,.18);
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
  box-shadow:0 0 18px rgba(255,159,190,.04);
}

.icon{
  width:44px;
  height:44px;
  border:1px solid rgba(242,180,199,.90);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--accent);
}

.icon svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.icon svg .dot{fill:currentColor;stroke:none}

.link span:nth-child(2){
  text-align:center;
  letter-spacing:.065em;
  font-size:15px;
  font-weight:600;
  text-shadow:0 1px 3px rgba(0,0,0,.55);
}

.arrow{
  color:var(--accent);
  font-size:34px;
  line-height:1;
  text-align:right;
  text-shadow:0 1px 5px rgba(0,0,0,.45);
}

.tagline{
  margin:24px 0 0;
  color:#f5c1d1;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-style:italic;
  font-size:28px;
  text-align:center;
  text-shadow:0 2px 10px rgba(0,0,0,.55);
}

@media (max-width:520px){
  .content{padding:48px 20px 28px}
  h1{font-size:clamp(39px,10.4vw,58px);letter-spacing:.095em}
  .script{font-size:clamp(41px,10.8vw,61px)}
  .links{gap:11px;margin-top:126px}
  .link{min-height:62px;padding:0 16px}
  .icon{width:42px;height:42px}
  .link span:nth-child(2){font-size:14px}
  .arrow{font-size:32px}
  .tagline{font-size:25px;margin-top:20px}
  .page:after{inset:12px;border-radius:15px}
}
