/* Theme: أخضر ميرمية (sage) — soft sage paper, rounded El Messiri, hand-drawn botanical sprigs, arched photos. */
@import url("https://fonts.googleapis.com/css2?family=El+Messiri:wght@500;600;700&family=IBM+Plex+Sans+Arabic:wght@300;400;500&display=swap");

html.t-sage {
  --door-img: url("/o/img/doors-emerald.jpg"); --foil-img: url("/o/img/foil-gold.jpg");
  --bg: #EEF1E6; --paper: #F8F9F2; --ink: #34432F; --muted: #6D7A64;
  --accent: #7C8F64; --accent-hi: #AABA90; --accent-lo: #57693F; --on-accent: #F8FAF1;
  --line: rgba(124, 143, 100, .36); --field: rgba(255, 255, 255, .62); --ok: #3F7A4C; --no: #A4523F;
  --display: "El Messiri", "IBM Plex Sans Arabic", serif; --body: "IBM Plex Sans Arabic", "Tajawal", sans-serif; --body-w: 400;
  --fs: 18px; --lh: 1.95; --names-fs: clamp(44px, 13vw, 72px); --names-lh: 1.3; --names-w: 600; --h2-fs: clamp(27px, 7.6vw, 34px); --h2-w: 600;
  --radius: 22px; --btn-radius: 999px;
  --cover-radius: 50% 50% 14px 14px / 38% 38% 14px 14px; --cover-frame-radius: 50% 50% 22px 22px / 38% 38% 22px 22px;
  --shadow: 0 26px 46px -30px rgba(52, 67, 47, .5);
  --map-filter: saturate(.55) sepia(.12) hue-rotate(20deg);
  --texture:
    radial-gradient(ellipse 80% 50% at 85% 0%, rgba(255, 255, 255, .75), transparent 70%),
    radial-gradient(ellipse 90% 60% at 0% 100%, rgba(170, 186, 144, .28), transparent 70%),
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .2  0 0 0 0 .27  0 0 0 0 .16  0 0 0 .06 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --hero-orn-w: 230px; --hero-orn-h: 70px; --corner-size: 150px;
  --orn-hero: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 72' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M116 58Q70 66 24 26M124 58Q170 66 216 26' stroke-width='1.6'/%3E%3Cg fill='black' fill-opacity='.42' stroke-width='1'%3E%3Cpath d='M102.9 59.3Q92 62.5 90 75.4Q101.2 69.8 102.9 59.3Z'/%3E%3Cpath d='M102.9 59.3Q100.1 49.3 88.2 47.6Q93.2 57.9 102.9 59.3Z'/%3E%3Cpath d='M89.7 58.7Q79.2 60.1 75.7 71.7Q86.7 68.1 89.7 58.7Z'/%3E%3Cpath d='M89.7 58.7Q88.5 49.1 77.8 45.9Q81.1 56 89.7 58.7Z'/%3E%3Cpath d='M76.6 56Q66.8 55.9 62 66.2Q72.6 64.3 76.6 56Z'/%3E%3Cpath d='M76.6 56Q76.7 47.1 67.4 42.8Q69 52.5 76.6 56Z'/%3E%3Cpath d='M63.4 51.5Q54.5 50.2 48.9 58.9Q58.8 58.5 63.4 51.5Z'/%3E%3Cpath d='M63.4 51.5Q64.7 43.3 56.7 38.2Q56.9 47.3 63.4 51.5Z'/%3E%3Cpath d='M50.3 44.9Q42.3 42.8 36.3 50.1Q45.3 50.8 50.3 44.9Z'/%3E%3Cpath d='M50.3 44.9Q52.3 37.7 45.6 32.2Q44.9 40.4 50.3 44.9Z'/%3E%3Cpath d='M37.1 36.4Q30.2 33.8 24 39.8Q32.1 41.3 37.1 36.4Z'/%3E%3Cpath d='M37.1 36.4Q39.7 30.1 34.1 24.5Q32.7 31.9 37.1 36.4Z'/%3E%3Cpath d='M137.1 59.3Q137.8 70.6 150 75.4Q147 63.3 137.1 59.3Z'/%3E%3Cpath d='M137.1 59.3Q147.5 58.8 151.8 47.6Q140.7 50.3 137.1 59.3Z'/%3E%3Cpath d='M150.3 58.7Q152.4 69 164.3 71.7Q159.9 61 150.3 58.7Z'/%3E%3Cpath d='M150.3 58.7Q159.8 56.8 162.2 45.9Q152.3 49.8 150.3 58.7Z'/%3E%3Cpath d='M163.4 56Q166.8 65.2 178 66.2Q172.6 56.9 163.4 56Z'/%3E%3Cpath d='M163.4 56Q171.9 53.1 172.6 42.8Q164.1 47.7 163.4 56Z'/%3E%3Cpath d='M176.6 51.5Q180.7 59.4 191.1 58.9Q185 51.1 176.6 51.5Z'/%3E%3Cpath d='M176.6 51.5Q183.9 47.7 183.3 38.2Q176.2 43.8 176.6 51.5Z'/%3E%3Cpath d='M189.7 44.9Q194.4 51.7 203.7 50.1Q197.3 43.7 189.7 44.9Z'/%3E%3Cpath d='M189.7 44.9Q196 40.7 194.4 32.2Q188.5 38 189.7 44.9Z'/%3E%3Cpath d='M202.9 36.4Q207.7 42.1 216 39.8Q209.6 34.6 202.9 36.4Z'/%3E%3Cpath d='M202.9 36.4Q208.1 32.1 205.9 24.5Q201.1 30.3 202.9 36.4Z'/%3E%3C/g%3E%3Cpath d='M102.9 59.3L92.6 72.2M102.9 59.3L91.2 50M89.7 58.7L78.5 69.1M89.7 58.7L80.2 48.4M76.6 56L64.9 64.1M76.6 56L69.2 45.4M63.4 51.5L51.8 57.4M63.4 51.5L58 40.9M50.3 44.9L39.1 49.1M50.3 44.9L46.5 34.8M37.1 36.4L26.7 39.1M37.1 36.4L34.7 26.9M137.1 59.3L147.4 72.2M137.1 59.3L148.8 50M150.3 58.7L161.5 69.1M150.3 58.7L159.8 48.4M163.4 56L175.1 64.1M163.4 56L170.8 45.4M176.6 51.5L188.2 57.4M176.6 51.5L182 40.9M189.7 44.9L200.9 49.1M189.7 44.9L193.5 34.8M202.9 36.4L213.3 39.1M202.9 36.4L205.3 26.9' stroke-width='.7'/%3E%3Cpath d='M120 60c-7-8-7-20 0-28 7 8 7 20 0 28z' fill='black'/%3E%3Ccircle cx='120' cy='64' r='2.5' fill='black'/%3E%3C/svg%3E");
  --orn-div: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 40' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M40 20H200' stroke-width='1.6'/%3E%3Cg fill='black' fill-opacity='.42' stroke-width='1'%3E%3Cpath d='M100 20Q95.7 9.4 82.7 10Q89.4 20.3 100 20Z'/%3E%3Cpath d='M100 20Q88.7 18.4 82.7 30Q95 29.3 100 20Z'/%3E%3Cpath d='M80 20Q74.4 11.6 63.1 13.8Q70.7 21.7 80 20Z'/%3E%3Cpath d='M80 20Q70.3 17.1 63.1 26.2Q74 27.3 80 20Z'/%3E%3Cpath d='M60 20Q54.3 13.3 44.5 15.9Q52 22 60 20Z'/%3E%3Cpath d='M60 20Q51.8 17 44.5 24.1Q54.1 25.7 60 20Z'/%3E%3Cpath d='M140 20Q151.3 21.6 157.3 10Q145 10.7 140 20Z'/%3E%3Cpath d='M140 20Q144.3 30.6 157.3 30Q150.6 19.7 140 20Z'/%3E%3Cpath d='M160 20Q169.7 22.9 176.9 13.8Q166 12.7 160 20Z'/%3E%3Cpath d='M160 20Q165.6 28.4 176.9 26.2Q169.3 18.3 160 20Z'/%3E%3Cpath d='M180 20Q188.2 23 195.5 15.9Q185.9 14.3 180 20Z'/%3E%3Cpath d='M180 20Q185.7 26.7 195.5 24.1Q188 18 180 20Z'/%3E%3C/g%3E%3Cpath d='M100 20L86.1 12M100 20L86.1 28M80 20L66.5 15.1M80 20L66.5 24.9M60 20L47.6 16.7M60 20L47.6 23.3M140 20L153.9 12M140 20L153.9 28M160 20L173.5 15.1M160 20L173.5 24.9M180 20L192.4 16.7M180 20L192.4 23.3' stroke-width='.7'/%3E%3Ccircle cx='120' cy='20' r='4.5' fill='black'/%3E%3C/svg%3E");
  --orn-corner: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 140' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 134C50 120 92 96 126 62S180 18 214 8' stroke-width='1.6'/%3E%3Cg fill='black' fill-opacity='.42' stroke-width='1'%3E%3Cpath d='M30 125Q24.4 111.4 7.5 112Q16.3 125.4 30 125Z'/%3E%3Cpath d='M30 125Q42.3 119.6 42 104.2Q29.9 112.4 30 125Z'/%3E%3Cpath d='M62 112Q62.4 95.2 44.8 87.4Q47.7 105.5 62 112Z'/%3E%3Cpath d='M62 112Q76.9 116.1 88.3 102.4Q71.4 100.9 62 112Z'/%3E%3Cpath d='M96 92Q100.8 75.9 85.7 63.8Q83.9 82.1 96 92Z'/%3E%3Cpath d='M96 92Q110.3 100.8 125.9 89.4Q108.8 82.9 96 92Z'/%3E%3Cpath d='M126 62Q132.7 48 121.1 34.4Q116.7 50.8 126 62Z'/%3E%3Cpath d='M126 62Q137.8 72.1 153.9 64.4Q139.2 55.9 126 62Z'/%3E%3Cpath d='M158 36Q165 24.5 155.9 12.1Q150.7 25.8 158 36Z'/%3E%3Cpath d='M158 36Q167.2 45.8 181.6 40.2Q169.7 31.6 158 36Z'/%3E%3Cpath d='M188 20Q196.5 12.4 191.5 0.3Q184 10.2 188 20Z'/%3E%3Cpath d='M188 20Q194.1 29.7 206.8 26.8Q198.4 17.8 188 20Z'/%3E%3Cpath d='M214 8Q223.1 10.4 228.5 1.2Q218.5 0.6 214 8Z'/%3E%3C/g%3E%3Cpath d='M30 125L12 114.6M30 125L39.6 108.4M62 112L48.2 92.3M62 112L83 104.3M96 92L87.8 69.4M96 92L119.9 89.9M126 62L122.1 39.9M126 62L148.3 64M158 36L156.3 16.9M158 36L176.9 39.3M188 20L190.8 4.2M188 20L203 25.5M214 8L225.6 2.6' stroke-width='.7'/%3E%3C/svg%3E");
  --orn-bullet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M3 17Q13.3 15.2 16.4 3.6Q5.7 7.6 3 17Z' fill='black'/%3E%3C/svg%3E");
  --lattice: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M4 15Q11.6 13.7 13.9 5.1Q5.9 8 4 15Z' fill='black'/%3E%3Cpath d='M26 15Q24.7 7.4 16.1 5.1Q19 13.1 26 15Z' fill='black'/%3E%3Ccircle cx='15' cy='26' r='1.5' fill='black'/%3E%3C/svg%3E");
  /* openings */
  --op-bg: #E6EBDB;
  --env: #F5F3E8; --env-2: #E4E4D1; --env-edge: #CACDB2;
  --seal: #5C7150; --seal-hi: #92A77D; --seal-lo: #34432C; --seal-ink: #F2F0DC;
  --door: #8C9C76; --door-hi: #A3B28C; --door-lo: #6C7C58; --door-trim: #F3EFDC;
  --foil-1: #847A4A; --foil-2: #ECE5BD; --foil-3: #B6AB75; --foil-ink: rgba(52, 67, 47, .6);
}
/* sprigs grow in from the hero corners, softer and larger than a frame */
.t-sage .corner { opacity: .75; }
.t-sage .c1 { top: -6px; left: -14px; } .t-sage .c2 { top: -6px; right: -14px; }
.t-sage .c3 { bottom: 0; left: -14px; opacity: .45; } .t-sage .c4 { bottom: 0; right: -14px; opacity: .45; }
.t-sage .hero::before { content: ""; position: absolute; left: 50%; top: 50%; width: min(86%, 380px); height: min(78%, 560px); transform: translate(-50%, -50%); border: 1px solid var(--line); border-radius: 999px 999px 26px 26px / 190px 190px 26px 26px; pointer-events: none; }
.t-sage .hero::after { content: ""; position: absolute; left: 50%; top: 50%; width: min(80%, 350px); height: min(72%, 520px); transform: translate(-50%, -50%); border-radius: 999px 999px 22px 22px / 175px 175px 22px 22px; background: radial-gradient(ellipse at 50% 30%, rgba(255, 255, 255, .7), rgba(255, 255, 255, .15) 70%); pointer-events: none; z-index: 0; }
.t-sage .hero-orn.bottom { transform: scaleY(-1) scale(.7); opacity: .5; }
.t-sage .names .amp { font-family: "El Messiri", serif; font-weight: 500; }
.t-sage .hd-side { border-block: 0; background: rgba(124, 143, 100, .1); border-radius: 999px; padding: 8px 10px; }
.t-sage .sec + .sec::before { width: 200px; height: 34px; opacity: .8; }
.t-sage .cover-frame { background: var(--paper); border-color: var(--line); }
.t-sage .shot img { border-radius: var(--cover-radius); }
.t-sage .msg { font-weight: 300; font-size: 20px; }
.t-sage .sheet::after { content: ""; position: absolute; bottom: 0; inset-inline-end: -20px; width: 200px; height: 128px; background: var(--accent); opacity: .22; transform: scaleY(-1); -webkit-mask: var(--orn-corner) center / contain no-repeat; mask: var(--orn-corner) center / contain no-repeat; pointer-events: none; z-index: -1; }
.t-sage .hero { padding-inline: max(22px, 11%); }