/* ==========================================================================
   Royal Word — "duo" layout
   Representative of His Majesty (left, first by protocol) + Prince (right).

   • Loaded AFTER css/style.css and only touches the #royal-word section.
   • Nothing in style.css is modified.
   • To undo: remove the <link ... royal-duo.css> line from index.html.
   ========================================================================== */

/* ---- Desktop & tablet landscape: two cards side by side ---- */
.royal-word__duo{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(36px,5vw,76px);
  align-items:start;
}
.royal-word__card{ display:flex; flex-direction:column; min-width:0; }
.royal-word__card--prince{ transition-delay:.14s; }

/* Same arched portrait for both people, identical frame size */
.royal-word__duo .royal-word__portrait{
  min-height:0; width:100%; max-width:none; margin:0;
  aspect-ratio:5/7;
}
.royal-word__duo .royal-word__portrait img{
  position:absolute; inset:0; width:100%; height:100%;
}
/* Full-length portrait: keep the cap at the top and the shoes at the bottom */
.royal-word__card--prince .royal-word__portrait img{ object-position:center 52%; }

/* Message under the portrait */
.royal-word__duo .royal-word__message{ padding:34px 0 0; align-self:stretch; }
.royal-word__duo .royal-word__message h2.headline{ font-size:clamp(26px,2.7vw,37px); }
.royal-word__duo .royal-word__opening{ font-size:clamp(18px,1.7vw,21px); }
.royal-word__duo .royal-signature{ align-items:flex-start; }
.royal-word__duo .royal-signature i{ flex:none; margin-top:.8em; }
.royal-word__duo .royal-signature strong{ line-height:1.35; overflow-wrap:anywhere; text-wrap:balance; }
.royal-word__duo .royal-signature span{ line-height:1.5; }

/* ---- Tablet portrait & phones: stacked, representative first ---- */
@media (max-width:860px){
  .royal-word__duo{ grid-template-columns:1fr; gap:0; }
  .royal-word__card{ width:100%; max-width:560px; margin:0 auto; }
  .royal-word__card + .royal-word__card{
    margin-top:64px; padding-top:64px;
    border-top:1px solid rgba(232,200,119,.22);
  }
  .royal-word__card--prince{ transition-delay:0s; }
}