Add static site landing page

This commit is contained in:
2026-03-26 17:11:10 +01:00
parent 884c98ff4e
commit 74d4838480
6 changed files with 1249 additions and 0 deletions

View File

@@ -0,0 +1,23 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" role="img" aria-labelledby="title desc">
<title id="title">Axis and Circle</title>
<desc id="desc">A circular seal with vertical and horizontal axes and a central point.</desc>
<defs>
<linearGradient id="axis" x1="0%" x2="100%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#b0bec5"/>
<stop offset="50%" stop-color="#fff8e1"/>
<stop offset="100%" stop-color="#2e7d32"/>
</linearGradient>
</defs>
<rect width="640" height="640" rx="96" fill="#09192b"/>
<circle cx="320" cy="320" r="238" fill="none" stroke="url(#axis)" stroke-width="8"/>
<circle cx="320" cy="320" r="184" fill="none" opacity="0.15" stroke="#fff8e1" stroke-width="2"/>
<line x1="320" x2="320" y1="106" y2="534" stroke="#fff8e1" stroke-width="10" stroke-linecap="round"/>
<line x1="106" x2="534" y1="320" y2="320" opacity="0.82" stroke="#b0bec5" stroke-width="10" stroke-linecap="round"/>
<circle cx="320" cy="320" r="42" fill="#b87333"/>
<circle cx="320" cy="320" r="18" fill="#fff8e1"/>
<circle cx="320" cy="148" r="14" fill="#fff8e1"/>
<circle cx="320" cy="492" r="14" fill="#fff8e1"/>
<circle cx="148" cy="320" r="14" fill="#fff8e1"/>
<circle cx="492" cy="320" r="14" fill="#fff8e1"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 9.2 KiB

View File

@@ -0,0 +1,72 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 800" role="img" aria-labelledby="title desc">
<title id="title">Seal of Continuity</title>
<desc id="desc">A double spiral inside a circle surrounded by twelve stars.</desc>
<defs>
<linearGradient id="halo" x1="0%" x2="100%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#fff8e1"/>
<stop offset="50%" stop-color="#b0bec5"/>
<stop offset="100%" stop-color="#b87333"/>
</linearGradient>
<linearGradient id="spiral" x1="18%" x2="82%" y1="16%" y2="84%">
<stop offset="0%" stop-color="#fff8e1"/>
<stop offset="55%" stop-color="#b0bec5"/>
<stop offset="100%" stop-color="#2e7d32"/>
</linearGradient>
<filter id="glow">
<feGaussianBlur stdDeviation="7" result="blur"/>
<feMerge>
<feMergeNode in="blur"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
<g id="star">
<path
d="M0-18 5.2-5.2 18 0 5.2 5.2 0 18 -5.2 5.2 -18 0 -5.2-5.2Z"
fill="#fff8e1"
/>
</g>
</defs>
<rect width="800" height="800" fill="#09192b"/>
<circle cx="400" cy="400" r="328" fill="none" opacity="0.12" stroke="#fff8e1" stroke-width="2"/>
<circle cx="400" cy="400" r="282" fill="none" stroke="url(#halo)" stroke-width="8"/>
<circle cx="400" cy="400" r="250" fill="none" opacity="0.18" stroke="#fff8e1" stroke-width="1.5"/>
<line x1="400" x2="400" y1="110" y2="690" opacity="0.18" stroke="#b0bec5" stroke-width="2"/>
<line x1="110" x2="690" y1="400" y2="400" opacity="0.12" stroke="#b0bec5" stroke-width="2"/>
<g filter="url(#glow)">
<path
d="M405.6 402.7 L405.9 403.1 L406.3 403.6 L406.6 404.1 L406.8 404.7 L407.1 405.2 L407.3 405.8 L407.4 406.4 L407.6 407.0 L407.7 407.6 L407.7 408.3 L407.7 409.0 L407.7 409.7 L407.7 410.3 L407.6 411.0 L407.4 411.7 L407.2 412.5 L407.0 413.2 L406.7 413.9 L406.4 414.6 L406.1 415.3 L405.7 416.0 L405.2 416.7 L404.7 417.4 L404.2 418.0 L403.6 418.7 L403.0 419.3 L402.4 419.9 L401.7 420.5 L400.9 421.1 L400.1 421.6 L399.3 422.1 L398.5 422.6 L397.6 423.0 L396.6 423.4 L395.7 423.8 L394.7 424.1 L393.7 424.4 L392.6 424.6 L391.6 424.8 L390.5 425.0 L389.3 425.1 L388.2 425.1 L387.0 425.1 L385.9 425.1 L384.7 424.9 L383.5 424.8 L382.3 424.6 L381.1 424.3 L379.8 424.0 L378.6 423.6 L377.4 423.1 L376.2 422.6 L375.0 422.1 L373.8 421.5 L372.6 420.8 L371.4 420.0 L370.3 419.2 L369.1 418.4 L368.0 417.5 L366.9 416.5 L365.9 415.5 L364.8 414.4 L363.8 413.3 L362.9 412.1 L362.0 410.8 L361.1 409.5 L360.3 408.2 L359.5 406.8 L358.8 405.3 L358.1 403.8 L357.5 402.3 L356.9 400.7 L356.4 399.1 L355.9 397.5 L355.5 395.8 L355.2 394.1 L355.0 392.3 L354.8 390.6 L354.7 388.8 L354.6 386.9 L354.7 385.1 L354.8 383.3 L354.9 381.4 L355.2 379.5 L355.5 377.6 L355.9 375.8 L356.4 373.9 L357.0 372.0 L357.6 370.1 L358.4 368.3 L359.2 366.4 L360.1 364.6 L361.1 362.8 L362.1 361.0 L363.2 359.2 L364.5 357.5 L365.7 355.8 L367.1 354.1 L368.6 352.5 L370.1 350.9 L371.7 349.4 L373.3 347.9 L375.1 346.5 L376.9 345.2 L378.7 343.9 L380.7 342.6 L382.7 341.4 L384.7 340.3 L386.9 339.3 L389.0 338.4 L391.3 337.5 L393.5 336.7 L395.8 336.0 L398.2 335.4 L400.6 334.8 L403.1 334.4 L405.5 334.0 L408.1 333.8 L410.6 333.6 L413.1 333.6 L415.7 333.6 L418.3 333.7 L420.9 334.0 L423.5 334.3 L426.1 334.8 L428.8 335.3 L431.4 336.0 L434.0 336.7 L436.5 337.6 L439.1 338.5 L441.7 339.6 L444.2 340.8 L446.7 342.1 L449.1 343.5 L451.5 344.9 L453.9 346.5 L456.2 348.2 L458.5 350.0 L460.7 351.9 L462.9 353.9 L465.0 356.0 L467.0 358.1 L469.0 360.4 L470.8 362.8 L472.6 365.2 L474.3 367.7 L476.0 370.3 L477.5 373.0 L478.9 375.7 L480.3 378.5 L481.5 381.4 L482.7 384.4 L483.7 387.4 L484.6 390.4 L485.4 393.5 L486.1 396.7 L486.7 399.9 L487.1 403.1 L487.5 406.4 L487.7 409.7 L487.8 413.0 L487.7 416.4 L487.6 419.7 L487.3 423.1 L486.8 426.5 L486.3 429.9 L485.6 433.2 L484.8 436.6 L483.8 439.9 L482.7 443.3 L481.5 446.6 L480.2 449.8 L478.7 453.1 L477.1 456.2 L475.3 459.4 L473.5 462.5 L471.5 465.5 L469.4 468.5 L467.1 471.4 L464.8 474.2 L462.3 477.0 L459.7 479.6 L457.0 482.2 L454.2 484.7 L451.2 487.1 L448.2 489.4 L445.1 491.6 L441.9 493.7 L438.5 495.6 L435.1 497.5 L431.7 499.2 L428.1 500.8 L424.4 502.3 L420.7 503.6 L416.9 504.8 L413.1 505.9 L409.2 506.8 L405.3 507.6 L401.3 508.2 L397.2 508.7 L393.2 509.0 L389.1 509.2 L384.9 509.2 L380.8 509.1 L376.7 508.8 L372.5 508.4 L368.4 507.8 L364.2 507.0 L360.1 506.1 L356.0 505.0 L351.9 503.8 L347.8 502.4 L343.8 500.8 L339.9 499.1 L335.9 497.2 L332.1 495.2 L328.3 493.0 L324.5 490.7 L320.9 488.2 L317.3 485.6 L313.8 482.8 L310.4 479.9 L307.1 476.8 L303.9 473.6 L300.8 470.3 L297.9 466.8 L295.0 463.3 L292.3 459.6 L289.7 455.8 L287.2 451.8 L284.9 447.8 L282.7 443.7 L280.7 439.5 L278.8 435.1 L277.1 430.7 L275.6 426.3 L274.2 421.7 L272.9 417.1 L271.9 412.4 L271.0 407.7 L270.3 402.9 L269.7 398.1 L269.4 393.2 L269.2 388.3 L269.2 383.4 L269.4 378.5 L269.8 373.5 L270.4 368.6 L271.2 363.7 L272.1 358.7 L273.3 353.9 L274.6 349.0 L276.1 344.2 L277.8 339.4 L279.7 334.6 L281.8 329.9 L284.0 325.3 L286.4 320.8 L289.1 316.3 L291.8 311.9 L294.8 307.6 L297.9 303.4 L301.2 299.3 L304.7 295.3 L308.3 291.5 L312.1 287.8 L316.0 284.2 L320.1 280.7 L324.3 277.4 L328.7 274.2 L333.2 271.2 L337.8 268.3 L342.5 265.6 L347.3 263.1 L352.3 260.8 L357.4 258.6 L362.5 256.6 L367.7 254.8 L373.1 253.2 L378.5 251.8 L383.9 250.6 L389.4 249.6 L395.0 248.8 L400.6 248.2 L406.3 247.8 L412.0 247.6 L417.7 247.7 L423.4 247.9 L429.1 248.4 L434.9 249.1 L440.6 250.0 L446.3 251.1 L451.9 252.5 L457.6 254.0 L463.2 255.8 L468.7 257.8 L474.2 260.0 L479.6 262.4 L484.9 265.0 L490.2 267.8 L495.3 270.8 L500.4 274.1 L505.3 277.5 L510.1 281.1 L514.8 284.9 L519.4 288.9 L523.8 293.1 L528.1 297.5 L532.2 302.0 L536.2 306.7 L540.0 311.5 L543.7 316.5 L547.1 321.7 L550.4 327.0 L553.5 332.4 L556.3 337.9 L559.0 343.6 L561.5 349.4 L563.8 355.3 L565.8 361.3 L567.6 367.4 L569.2 373.6 L570.6 379.8 L571.7 386.1 L572.7 392.5 L573.3 398.9 L573.8 405.3 L574.0 411.8 L573.9 418.3 L573.6 424.9 L573.1 431.4 L572.3 437.9 L571.3 444.4 L570.0 450.9 L568.5 457.3 L566.7 463.7 L564.7 470.1 L562.4 476.3 L559.9 482.6 L557.2 488.7 L554.2 494.7 L551.0 500.7 L547.6 506.5 L544.0 512.3 L540.1 517.9 L536.0 523.3 L531.7 528.6 L527.2 533.8 L522.5 538.8 L517.5 543.7 L512.4 548.4 L507.1 552.8 L501.7 557.2 L496.0 561.3 L490.2 565.2 L484.2 568.9 L478.1 572.3 L471.9 575.6 L465.5 578.6 L458.9 581.4"
fill="none"
stroke="url(#spiral)"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="16"
/>
<path
d="M394.4 397.3 L394.1 396.9 L393.7 396.4 L393.4 395.9 L393.2 395.3 L392.9 394.8 L392.7 394.2 L392.6 393.6 L392.4 393.0 L392.3 392.4 L392.3 391.7 L392.3 391.0 L392.3 390.3 L392.3 389.7 L392.4 389.0 L392.6 388.3 L392.8 387.5 L393.0 386.8 L393.3 386.1 L393.6 385.4 L393.9 384.7 L394.3 384.0 L394.8 383.3 L395.3 382.6 L395.8 382.0 L396.4 381.3 L397.0 380.7 L397.6 380.1 L398.3 379.5 L399.1 378.9 L399.9 378.4 L400.7 377.9 L401.5 377.4 L402.4 377.0 L403.4 376.6 L404.3 376.2 L405.3 375.9 L406.3 375.6 L407.4 375.4 L408.4 375.2 L409.5 375.0 L410.7 374.9 L411.8 374.9 L413.0 374.9 L414.1 374.9 L415.3 375.1 L416.5 375.2 L417.7 375.4 L418.9 375.7 L420.2 376.0 L421.4 376.4 L422.6 376.9 L423.8 377.4 L425.0 377.9 L426.2 378.5 L427.4 379.2 L428.6 380.0 L429.7 380.8 L430.9 381.6 L432.0 382.5 L433.1 383.5 L434.1 384.5 L435.2 385.6 L436.2 386.7 L437.1 387.9 L438.0 389.2 L438.9 390.5 L439.7 391.8 L440.5 393.2 L441.2 394.7 L441.9 396.2 L442.5 397.7 L443.1 399.3 L443.6 400.9 L444.1 402.5 L444.5 404.2 L444.8 405.9 L445.0 407.7 L445.2 409.4 L445.3 411.2 L445.4 413.1 L445.3 414.9 L445.2 416.7 L445.1 418.6 L444.8 420.5 L444.5 422.4 L444.1 424.2 L443.6 426.1 L443.0 428.0 L442.4 429.9 L441.6 431.7 L440.8 433.6 L439.9 435.4 L438.9 437.2 L437.9 439.0 L436.8 440.8 L435.5 442.5 L434.3 444.2 L432.9 445.9 L431.4 447.5 L429.9 449.1 L428.3 450.6 L426.7 452.1 L424.9 453.5 L423.1 454.8 L421.3 456.1 L419.3 457.4 L417.3 458.6 L415.3 459.7 L413.1 460.7 L411.0 461.6 L408.7 462.5 L406.5 463.3 L404.2 464.0 L401.8 464.6 L399.4 465.2 L396.9 465.6 L394.5 466.0 L391.9 466.2 L389.4 466.4 L386.9 466.4 L384.3 466.4 L381.7 466.3 L379.1 466.0 L376.5 465.7 L373.9 465.2 L371.2 464.7 L368.6 464.0 L366.0 463.3 L363.5 462.4 L360.9 461.5 L358.3 460.4 L355.8 459.2 L353.3 457.9 L350.9 456.5 L348.5 455.1 L346.1 453.5 L343.8 451.8 L341.5 450.0 L339.3 448.1 L337.1 446.1 L335.0 444.0 L333.0 441.9 L331.0 439.6 L329.2 437.2 L327.4 434.8 L325.7 432.3 L324.0 429.7 L322.5 427.0 L321.1 424.3 L319.7 421.5 L318.5 418.6 L317.3 415.6 L316.3 412.6 L315.4 409.6 L314.6 406.5 L313.9 403.3 L313.3 400.1 L312.9 396.9 L312.5 393.6 L312.3 390.3 L312.2 387.0 L312.3 383.6 L312.4 380.3 L312.7 376.9 L313.2 373.5 L313.7 370.1 L314.4 366.8 L315.2 363.4 L316.2 360.1 L317.3 356.7 L318.5 353.4 L319.8 350.2 L321.3 346.9 L322.9 343.8 L324.7 340.6 L326.5 337.5 L328.5 334.5 L330.6 331.5 L332.9 328.6 L335.2 325.8 L337.7 323.0 L340.3 320.4 L343.0 317.8 L345.8 315.3 L348.8 312.9 L351.8 310.6 L354.9 308.4 L358.1 306.3 L361.5 304.4 L364.9 302.5 L368.3 300.8 L371.9 299.2 L375.6 297.7 L379.3 296.4 L383.1 295.2 L386.9 294.1 L390.8 293.2 L394.7 292.4 L398.7 291.8 L402.8 291.3 L406.8 291.0 L410.9 290.8 L415.1 290.8 L419.2 290.9 L423.3 291.2 L427.5 291.6 L431.6 292.2 L435.8 293.0 L439.9 293.9 L444.0 295.0 L448.1 296.2 L452.2 297.6 L456.2 299.2 L460.1 300.9 L464.1 302.8 L467.9 304.8 L471.7 307.0 L475.5 309.3 L479.1 311.8 L482.7 314.4 L486.2 317.2 L489.6 320.1 L492.9 323.2 L496.1 326.4 L499.2 329.7 L502.1 333.2 L505.0 336.7 L507.7 340.4 L510.3 344.2 L512.8 348.2 L515.1 352.2 L517.3 356.3 L519.3 360.5 L521.2 364.9 L522.9 369.3 L524.4 373.7 L525.8 378.3 L527.1 382.9 L528.1 387.6 L529.0 392.3 L529.7 397.1 L530.3 401.9 L530.6 406.8 L530.8 411.7 L530.8 416.6 L530.6 421.5 L530.2 426.5 L529.6 431.4 L528.8 436.3 L527.9 441.3 L526.7 446.1 L525.4 451.0 L523.9 455.8 L522.2 460.6 L520.3 465.4 L518.2 470.1 L516.0 474.7 L513.6 479.2 L510.9 483.7 L508.2 488.1 L505.2 492.4 L502.1 496.6 L498.8 500.7 L495.3 504.7 L491.7 508.5 L487.9 512.2 L484.0 515.8 L479.9 519.3 L475.7 522.6 L471.3 525.8 L466.8 528.8 L462.2 531.7 L457.5 534.4 L452.7 536.9 L447.7 539.2 L442.6 541.4 L437.5 543.4 L432.3 545.2 L426.9 546.8 L421.5 548.2 L416.1 549.4 L410.6 550.4 L405.0 551.2 L399.4 551.8 L393.7 552.2 L388.0 552.4 L382.3 552.3 L376.6 552.1 L370.9 551.6 L365.1 550.9 L359.4 550.0 L353.7 548.9 L348.1 547.5 L342.4 546.0 L336.8 544.2 L331.3 542.2 L325.8 540.0 L320.4 537.6 L315.1 535.0 L309.8 532.2 L304.7 529.2 L299.6 525.9 L294.7 522.5 L289.9 518.9 L285.2 515.1 L280.6 511.1 L276.2 506.9 L271.9 502.5 L267.8 498.0 L263.8 493.3 L260.0 488.5 L256.3 483.5 L252.9 478.3 L249.6 473.0 L246.5 467.6 L243.7 462.1 L241.0 456.4 L238.5 450.6 L236.2 444.7 L234.2 438.7 L232.4 432.6 L230.8 426.4 L229.4 420.2 L228.3 413.9 L227.3 407.5 L226.7 401.1 L226.2 394.7 L226.0 388.2 L226.1 381.7 L226.4 375.1 L226.9 368.6 L227.7 362.1 L228.7 355.6 L230.0 349.1 L231.5 342.7 L233.3 336.3 L235.3 329.9 L237.6 323.7 L240.1 317.4 L242.8 311.3 L245.8 305.3 L249.0 299.3 L252.4 293.5 L256.0 287.7 L259.9 282.1 L264.0 276.7 L268.3 271.4 L272.8 266.2 L277.5 261.2 L282.5 256.3 L287.6 251.6 L292.9 247.2 L298.3 242.8 L304.0 238.7 L309.8 234.8 L315.8 231.1 L321.9 227.7 L328.1 224.4 L334.5 221.4 L341.1 218.6"
fill="none"
stroke="url(#spiral)"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="16"
/>
</g>
<circle cx="400" cy="400" r="8" fill="#fff8e1" opacity="0.92"/>
<g transform="translate(400 400)">
<use href="#star" transform="translate(0,-332)"/>
<use href="#star" transform="rotate(30) translate(0,-332)"/>
<use href="#star" transform="rotate(60) translate(0,-332)"/>
<use href="#star" transform="rotate(90) translate(0,-332)"/>
<use href="#star" transform="rotate(120) translate(0,-332)"/>
<use href="#star" transform="rotate(150) translate(0,-332)"/>
<use href="#star" transform="rotate(180) translate(0,-332)"/>
<use href="#star" transform="rotate(210) translate(0,-332)"/>
<use href="#star" transform="rotate(240) translate(0,-332)"/>
<use href="#star" transform="rotate(270) translate(0,-332)"/>
<use href="#star" transform="rotate(300) translate(0,-332)"/>
<use href="#star" transform="rotate(330) translate(0,-332)"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 12 KiB

View File

@@ -0,0 +1,54 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" role="img" aria-labelledby="title desc">
<title id="title">Twin Flames</title>
<desc id="desc">Two mirrored flames inside a circle.</desc>
<defs>
<linearGradient id="flame-left" x1="30%" x2="70%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#fff8e1"/>
<stop offset="60%" stop-color="#b87333"/>
<stop offset="100%" stop-color="#1a237e"/>
</linearGradient>
<linearGradient id="flame-right" x1="70%" x2="30%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#fff8e1"/>
<stop offset="55%" stop-color="#b0bec5"/>
<stop offset="100%" stop-color="#2e7d32"/>
</linearGradient>
</defs>
<rect width="640" height="640" rx="96" fill="#09192b"/>
<circle cx="320" cy="320" r="236" fill="none" opacity="0.2" stroke="#fff8e1" stroke-width="3"/>
<circle cx="320" cy="320" r="194" fill="none" opacity="0.1" stroke="#fff8e1" stroke-width="2"/>
<path
d="M300 448
C228 388 220 290 276 228
C288 214 299 194 302 172
C350 216 365 266 348 314
C338 345 336 382 344 414
C349 433 343 447 330 457
C319 466 308 464 300 448Z"
fill="url(#flame-left)"
/>
<path
d="M340 448
C412 388 420 290 364 228
C352 214 341 194 338 172
C290 216 275 266 292 314
C302 345 304 382 296 414
C291 433 297 447 310 457
C321 466 332 464 340 448Z"
fill="url(#flame-right)"
/>
<path
d="M319 416
C284 384 282 338 310 304
C316 296 320 286 321 274
C343 296 352 326 344 352
C338 372 337 392 340 410
C341 421 334 430 324 431
C322 431 320 431 319 416Z"
fill="#fff8e1"
opacity="0.92"
/>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

245
index.html Normal file
View File

@@ -0,0 +1,245 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Church of Kosmo</title>
<meta
name="description"
content="Church of Kosmo is a non-dogmatic fellowship devoted to knowledge, balance, compassion, and continuity."
>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&amp;family=Space+Grotesk:wght@400;500;700&amp;display=swap"
rel="stylesheet"
>
<script defer data-domain="kosmo.church" src="https://plausible.postblue.cz/js/script.js"></script>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="sky" aria-hidden="true"></div>
<div class="orb orb-left" aria-hidden="true"></div>
<div class="orb orb-right" aria-hidden="true"></div>
<header class="site-header">
<a class="brand" href="#top">
<span class="brand-mark"></span>
<span>Church of Kosmo</span>
</a>
<nav class="site-nav" aria-label="Primary">
<a href="#about">O Kosmu / About</a>
<a href="#symbols">Symboly / Symbols</a>
<a href="#connect">Spojení / Connect</a>
</nav>
</header>
<main id="top">
<section class="hero section">
<div class="hero-center">
<div class="seal-frame">
<img
src="assets/site/seal-of-continuity.svg"
alt="Seal of Continuity with a double spiral inside a circle of twelve stars"
>
</div>
<p class="eyebrow">Zakládající okamžik / Founding moment</p>
<h1 class="founding-date">20 . 3 . 2026</h1>
<p class="founding-time">15:46</p>
<p class="founding-equinox">Jarní rovnodennost / Vernal equinox</p>
<p class="founding-subtitle">Kosmos Universalis / Church of Kosmo</p>
<blockquote class="invocation">
Through knowledge we remember. Through balance we endure. Through
compassion we renew. Through continuity we return.
</blockquote>
</div>
<div class="bilingual-grid">
<article class="language-card" lang="cs">
<p class="language-label">Čeština</p>
<h2>Kosmos Universalis</h2>
<p class="lede">
Kosmos Universalis je nedogmatické duchovní a vzdělávací
společenství věnované etickému hledání, uchovávání a obnově
poznání v souladu se životem a kosmem.
</p>
<p>
Veřejné texty čerpají z Kodexu Velkého roku a spojují vědu,
spiritualitu, umění a ekologii do jedné otevřené cesty
poznávání.
</p>
<div class="hero-actions">
<a class="button button-primary" href="https://git.cqre.net/kosmo/Church-of-Kosmo">Veřejný repozitář</a>
<a class="button button-secondary" href="https://i.delta.chat/#399BE083296BF72F085E3E674554085B2D4C9D7C&amp;x=Ux2e6VBvB4wVosuswLLfD_w8&amp;i=GQxIY2CM7zVbbg85IutG-9Yr&amp;s=uVebq205lng8CSNOLRwGDI3g&amp;a=lrf2kno1s%40chat.postblue.cz&amp;n=Tom&amp;g=kosmo.church">Delta Chat</a>
</div>
<dl class="fact-stack">
<div class="fact-card">
<dt>Povaha</dt>
<dd>Nedogmatické společenství</dd>
</div>
<div class="fact-card">
<dt>Současný věk</dt>
<dd>Věk Vodnáře<br><span>jasnost a probuzení</span></dd>
</div>
</dl>
</article>
<article class="language-card" lang="en">
<p class="language-label">English</p>
<h2>Church of Kosmo</h2>
<p class="lede">
The Church of Kosmo is a non-dogmatic spiritual and educational
fellowship devoted to the ethical pursuit, preservation, and
renewal of knowledge in harmony with life and the cosmos.
</p>
<p>
Its public texts draw from the Codex of the Great Year and bring
science, spirituality, art, and ecology into one open path of
inquiry.
</p>
<div class="hero-actions">
<a class="button button-primary" href="https://git.cqre.net/kosmo/Church-of-Kosmo">Public Repository</a>
<a class="button button-secondary" href="https://i.delta.chat/#399BE083296BF72F085E3E674554085B2D4C9D7C&amp;x=Ux2e6VBvB4wVosuswLLfD_w8&amp;i=GQxIY2CM7zVbbg85IutG-9Yr&amp;s=uVebq205lng8CSNOLRwGDI3g&amp;a=lrf2kno1s%40chat.postblue.cz&amp;n=Tom&amp;g=kosmo.church">Delta Chat</a>
</div>
<dl class="fact-stack">
<div class="fact-card">
<dt>Nature</dt>
<dd>Non-dogmatic fellowship</dd>
</div>
<div class="fact-card">
<dt>Present Age</dt>
<dd>Aquarius<br><span>clarity and awakening</span></dd>
</div>
</dl>
</article>
</div>
</section>
<section class="section panel" id="about">
<div class="section-heading">
<p class="eyebrow">O Kosmu / About Kosmo</p>
<h2>Open texts, living practice</h2>
</div>
<div class="two-column bilingual-copy">
<div lang="cs">
<p>
Kosmo chápe vědu, spiritualitu, umění i ekologii jako vzájemně se
doplňující způsoby poznání. Charta i Kodex popisují společenství
orientované na pravdu, soucit, odpovědnost a dlouhou paměť.
</p>
<p>
Projekt je veřejný záměrně. Texty jsou otevřeně sdílené, aby mohly
růst skrze překlady, kritiku, praxi a péči napříč generacemi.
</p>
</div>
<div lang="en">
<p>
Kosmo treats science, spirituality, art, and ecology as
complementary ways of knowing. The charter and codex describe a
fellowship oriented toward truth, compassion, stewardship, and
long memory.
</p>
<p>
The project is public by design. Its texts are openly shared so
they can evolve through translation, critique, practice, and care
across generations.
</p>
</div>
</div>
<div class="pillar-grid">
<article class="pillar-card">
<h3>Poznání / Knowledge</h3>
<p>Hledat pravdu skrze vědu, umění, intuici a disciplinované zkoumání.</p>
</article>
<article class="pillar-card">
<h3>Rovnováha / Balance</h3>
<p>Držet rozum a úctu, technologii a přírodu, v aktivní rovnováze.</p>
</article>
<article class="pillar-card">
<h3>Soucit / Compassion</h3>
<p>Vést porozumění empatií, odpovědností a ohledem na druhé.</p>
</article>
<article class="pillar-card">
<h3>Kontinuita / Continuity</h3>
<p>Uchovávat, překládat a předávat to podstatné, aby paměť přežila změnu.</p>
</article>
</div>
</section>
<section class="section" id="symbols">
<div class="section-heading">
<p class="eyebrow">Symboly / Symbols</p>
<h2>Geometry of balance</h2>
</div>
<div class="symbol-grid">
<article class="symbol-card">
<img src="assets/site/seal-of-continuity.svg" alt="Double spiral within a circle of twelve stars">
<h3>Pečeť kontinuity / Seal of Continuity</h3>
<p>
Dvojitá spirála v kruhu dvanácti hvězd značí expanzi, návrat a
kontinuitu kosmické paměti.
</p>
</article>
<article class="symbol-card">
<img src="assets/site/twin-flames.svg" alt="Twin flames symbol">
<h3>Dvojí plamen / Twin Flames</h3>
<p>
Dvojí plamen drží rozum a soucit pohromadě. Porozumění není
oddělené od péče.
</p>
</article>
<article class="symbol-card">
<img src="assets/site/axis-circle.svg" alt="Axis and circle symbol">
<h3>Osa a kruh / Axis and Circle</h3>
<p>
Osa a kruh vyjadřují setkání ducha a hmoty, zakotvení i
transcendenci, svislou i vodorovnou rovnováhu.
</p>
</article>
</div>
</section>
<section class="section panel connect-panel" id="connect">
<div class="section-heading">
<p class="eyebrow">Spojení / Connect</p>
<h2>Read the texts or enter the circle</h2>
</div>
<div class="connect-grid">
<article class="resource-card">
<p class="resource-kicker">Repozitář / Repository</p>
<h3>Veřejné zdrojové texty</h3>
<p>
Charta, Kodex, české i anglické texty, provozní poznámky i
licenční materiály jsou vedeny ve veřejném repozitáři.
</p>
<a class="text-link" href="https://git.cqre.net/kosmo/Church-of-Kosmo">git.cqre.net/kosmo/Church-of-Kosmo</a>
</article>
<article class="resource-card resource-card-qr">
<div class="qr-shell">
<img src="assets/site/delta-chat-qr.svg" alt="QR code linking to the Church of Kosmo Delta Chat group">
</div>
<div>
<p class="resource-kicker">Delta Chat</p>
<h3>Veřejná skupina / Public group</h3>
<p>
Naskenujte QR kód v Delta Chatu nebo otevřete pozvánku přímo a
vstupte do veřejné skupiny Kosmo. Scan the QR code in Delta
Chat or open the invite directly.
</p>
<a class="text-link" href="https://i.delta.chat/#399BE083296BF72F085E3E674554085B2D4C9D7C&amp;x=Ux2e6VBvB4wVosuswLLfD_w8&amp;i=GQxIY2CM7zVbbg85IutG-9Yr&amp;s=uVebq205lng8CSNOLRwGDI3g&amp;a=lrf2kno1s%40chat.postblue.cz&amp;n=Tom&amp;g=kosmo.church">Open Delta Chat invite</a>
</div>
</article>
</div>
</section>
</main>
<footer class="site-footer">
<p class="footer-motto">Per Scientiam, Per Aequilibrium, Per Continuum.</p>
<p class="footer-note">
Kosmos Universalis / Church of Kosmo. Open texts under the Kosmic
License (KΛ 1.0).
</p>
</footer>
</body>
</html>

853
styles.css Normal file
View File

@@ -0,0 +1,853 @@
:root {
--bg: #07111e;
--panel: rgba(10, 26, 49, 0.74);
--panel-strong: rgba(8, 22, 40, 0.9);
--line: rgba(255, 248, 225, 0.16);
--line-green: rgba(46, 125, 50, 0.38);
--line-copper: rgba(184, 115, 51, 0.42);
--text: #fff8e1;
--muted: rgba(255, 248, 225, 0.76);
--indigo: #1a237e;
--gold: #fff8e1;
--green: #2e7d32;
--silver: #b0bec5;
--copper: #b87333;
--green-wash: rgba(46, 125, 50, 0.12);
--copper-wash: rgba(184, 115, 51, 0.13);
--shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
}
* {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
margin: 0;
min-height: 100vh;
color: var(--text);
background:
radial-gradient(circle at top, rgba(26, 35, 126, 0.42), transparent 34rem),
radial-gradient(circle at 18% 18%, rgba(184, 115, 51, 0.18), transparent 18rem),
radial-gradient(circle at 82% 12%, rgba(46, 125, 50, 0.14), transparent 18rem),
linear-gradient(180deg, #08111d 0%, #09192b 48%, #07111e 100%);
font-family: "Space Grotesk", sans-serif;
line-height: 1.6;
overflow-x: hidden;
}
img {
display: block;
max-width: 100%;
}
a {
color: inherit;
}
.sky,
.orb {
pointer-events: none;
position: fixed;
inset: 0;
z-index: -2;
}
.sky {
background-image:
radial-gradient(circle at 18% 24%, rgba(255, 248, 225, 0.8) 0 0.08rem, transparent 0.1rem),
radial-gradient(circle at 82% 14%, rgba(176, 190, 197, 0.75) 0 0.06rem, transparent 0.08rem),
radial-gradient(circle at 68% 32%, rgba(255, 248, 225, 0.72) 0 0.07rem, transparent 0.09rem),
radial-gradient(circle at 26% 68%, rgba(176, 190, 197, 0.65) 0 0.07rem, transparent 0.09rem),
radial-gradient(circle at 74% 78%, rgba(255, 248, 225, 0.7) 0 0.08rem, transparent 0.1rem),
radial-gradient(circle at 54% 56%, rgba(176, 190, 197, 0.6) 0 0.05rem, transparent 0.07rem);
opacity: 0.75;
}
.orb {
z-index: -1;
filter: blur(70px);
opacity: 0.7;
}
.orb-left {
background: radial-gradient(circle at 20% 30%, rgba(26, 35, 126, 0.6), transparent 34%);
}
.orb-right {
background: radial-gradient(circle at 80% 18%, rgba(184, 115, 51, 0.28), transparent 26%);
}
.site-header,
.section,
.site-footer {
width: min(1160px, calc(100% - 2rem));
margin: 0 auto;
}
.site-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1.25rem 0 0;
}
.brand,
.site-nav {
position: relative;
z-index: 2;
}
.brand {
display: inline-flex;
align-items: center;
gap: 0.75rem;
text-decoration: none;
font-size: 0.95rem;
letter-spacing: 0.12em;
text-transform: uppercase;
}
.brand-mark {
display: inline-grid;
place-items: center;
width: 2rem;
height: 2rem;
border: 1px solid var(--line);
border-radius: 999px;
color: var(--gold);
background: rgba(255, 248, 225, 0.04);
}
.site-nav {
display: inline-flex;
gap: 1.4rem;
align-items: center;
}
.site-nav a {
position: relative;
color: var(--muted);
text-decoration: none;
}
.site-nav a::after {
content: "";
position: absolute;
right: 0;
bottom: -0.35rem;
left: 0;
height: 1px;
background: linear-gradient(90deg, var(--copper), var(--green));
transform: scaleX(0);
transform-origin: center;
transition: transform 180ms ease;
}
.site-nav a:hover,
.site-nav a:focus-visible,
.brand:hover,
.brand:focus-visible,
.text-link:hover,
.text-link:focus-visible {
color: var(--gold);
}
.site-nav a:hover::after,
.site-nav a:focus-visible::after {
transform: scaleX(1);
}
.section {
padding: 4rem 0;
}
.hero {
display: grid;
gap: 2.2rem;
min-height: calc(100vh - 4.5rem);
padding-top: 3rem;
}
.hero-center {
display: grid;
justify-items: center;
text-align: center;
gap: 0.2rem;
}
.eyebrow {
margin: 0 0 1rem;
color: #d8cb95;
font-size: 0.82rem;
letter-spacing: 0.24em;
text-transform: uppercase;
}
h1,
h2,
h3 {
margin: 0;
font-family: "Cormorant Garamond", serif;
line-height: 1;
}
h1 {
font-size: clamp(3.6rem, 8vw, 6.8rem);
max-width: 10ch;
}
h2 {
font-size: clamp(2.2rem, 5vw, 3.6rem);
max-width: 12ch;
}
h3 {
font-size: 1.85rem;
margin-bottom: 0.75rem;
}
.lede,
.language-card p,
.two-column p,
.pillar-card p,
.symbol-card p,
.resource-card p,
.footer-note {
color: var(--muted);
}
.lede {
max-width: 62ch;
font-size: 1.08rem;
margin: 1.5rem 0 0;
}
.language-card .lede {
margin-top: 0.8rem;
}
.hero-actions {
display: flex;
flex-wrap: wrap;
gap: 1rem;
margin: 2rem 0;
}
.button {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 3.2rem;
padding: 0.8rem 1.3rem;
border-radius: 999px;
border: 1px solid transparent;
text-decoration: none;
font-weight: 500;
transition:
transform 180ms ease,
border-color 180ms ease,
background-color 180ms ease;
}
.button:hover,
.button:focus-visible {
transform: translateY(-2px);
}
.button-primary {
color: #08111d;
background: linear-gradient(135deg, var(--gold), #e3d7ae 52%, #c8c88a 100%);
box-shadow: 0 18px 40px rgba(255, 248, 225, 0.18);
}
.button-secondary {
color: var(--gold);
background: linear-gradient(135deg, rgba(184, 115, 51, 0.22), rgba(46, 125, 50, 0.16));
border-color: rgba(184, 115, 51, 0.42);
box-shadow: inset 0 0 0 1px rgba(46, 125, 50, 0.18);
}
.fact-grid,
.fact-stack,
.bilingual-grid,
.pillar-grid,
.symbol-grid,
.connect-grid {
display: grid;
gap: 1rem;
}
.fact-card,
.pillar-card,
.symbol-card,
.resource-card,
.seal-frame,
.panel {
border: 1px solid var(--line);
box-shadow: var(--shadow);
backdrop-filter: blur(18px);
}
.fact-card {
margin: 0;
padding: 1.15rem;
background:
linear-gradient(135deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.02)),
radial-gradient(circle at top left, var(--copper-wash), transparent 60%);
border-radius: 1.25rem;
}
.fact-card:nth-child(even) {
background:
linear-gradient(135deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.02)),
radial-gradient(circle at top left, var(--green-wash), transparent 60%);
}
.fact-stack {
margin: 0;
gap: 0.85rem;
}
.fact-card dt {
color: #d8cb95;
font-size: 0.78rem;
letter-spacing: 0.14em;
text-transform: uppercase;
}
.fact-card dd {
margin: 0.55rem 0 0;
font-size: 1.18rem;
line-height: 1.35;
}
.fact-card span {
color: var(--silver);
font-size: 0.92rem;
}
.seal-frame {
position: relative;
width: min(100%, 520px);
padding: 1.4rem;
border-radius: 2rem;
background:
radial-gradient(circle at top, rgba(255, 248, 225, 0.12), transparent 55%),
radial-gradient(circle at 20% 85%, var(--copper-wash), transparent 30%),
radial-gradient(circle at 82% 18%, var(--green-wash), transparent 26%),
linear-gradient(180deg, rgba(26, 35, 126, 0.3), rgba(8, 22, 40, 0.84));
animation: rise 900ms ease both;
}
.seal-frame::before {
content: "";
position: absolute;
inset: 1rem;
border: 1px solid rgba(255, 248, 225, 0.08);
border-radius: 1.5rem;
}
.founding-date {
max-width: none;
margin-top: 0.7rem;
font-size: clamp(3.8rem, 10vw, 7.2rem);
letter-spacing: 0.12em;
}
.founding-time {
margin: 0.35rem 0 0;
color: #d8cb95;
font-size: clamp(1.2rem, 2vw, 1.5rem);
letter-spacing: 0.42em;
text-transform: uppercase;
}
.founding-equinox {
margin: 0.8rem 0 0;
color: var(--silver);
font-size: 0.92rem;
letter-spacing: 0.18em;
text-transform: uppercase;
}
.founding-subtitle {
margin: 0.55rem 0 0;
color: var(--silver);
font-size: 0.96rem;
letter-spacing: 0.18em;
text-transform: uppercase;
}
.invocation {
max-width: 46rem;
margin: 1.3rem auto 0;
padding: 1.2rem 1.35rem;
border-left: 2px solid rgba(184, 115, 51, 0.45);
border-right: 2px solid rgba(46, 125, 50, 0.35);
color: var(--muted);
font-size: 1rem;
font-style: italic;
}
.bilingual-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: start;
}
.language-card {
padding: 1.7rem;
border: 1px solid var(--line);
border-radius: 1.7rem;
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.02)),
linear-gradient(135deg, rgba(184, 115, 51, 0.08), transparent 42%);
box-shadow: var(--shadow);
backdrop-filter: blur(18px);
}
.language-card:first-child {
border-color: var(--line-copper);
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.02)),
linear-gradient(135deg, rgba(184, 115, 51, 0.12), transparent 42%);
}
.language-card:last-child {
border-color: var(--line-green);
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.02)),
linear-gradient(135deg, rgba(46, 125, 50, 0.12), transparent 42%);
}
.language-label {
margin: 0 0 0.7rem;
color: #d8cb95;
font-size: 0.82rem;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.panel {
padding: 2rem;
border-radius: 2rem;
background:
linear-gradient(180deg, var(--panel), var(--panel-strong)),
linear-gradient(90deg, var(--copper-wash), transparent 32%, transparent 68%, var(--green-wash));
}
.section-heading {
margin-bottom: 2rem;
}
.section-heading h2 {
text-wrap: balance;
}
.two-column {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
.pillar-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-top: 2rem;
}
.pillar-card,
.symbol-card,
.resource-card {
padding: 1.3rem;
border-radius: 1.5rem;
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.025)),
linear-gradient(135deg, rgba(255, 248, 225, 0.02), transparent 58%);
}
.pillar-card:nth-child(4n + 1),
.symbol-card:nth-child(3n + 1),
.resource-card:first-child {
border-color: var(--line-copper);
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.025)),
linear-gradient(135deg, rgba(184, 115, 51, 0.13), transparent 58%);
}
.pillar-card:nth-child(4n + 2),
.symbol-card:nth-child(3n + 2) {
border-color: rgba(255, 248, 225, 0.2);
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.025)),
linear-gradient(135deg, rgba(255, 248, 225, 0.08), transparent 58%);
}
.pillar-card:nth-child(4n + 3),
.symbol-card:nth-child(3n + 3),
.resource-card-qr {
border-color: var(--line-green);
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.025)),
linear-gradient(135deg, rgba(46, 125, 50, 0.13), transparent 58%);
}
.pillar-card:nth-child(4n + 4) {
border-color: rgba(176, 190, 197, 0.28);
background:
linear-gradient(180deg, rgba(255, 248, 225, 0.04), rgba(255, 248, 225, 0.025)),
linear-gradient(135deg, rgba(176, 190, 197, 0.11), transparent 58%);
}
.symbol-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.symbol-card img {
width: min(100%, 260px);
margin: 0 auto 1.2rem;
}
.connect-panel {
padding-bottom: 2.5rem;
}
.connect-grid {
grid-template-columns: 1fr 1.2fr;
align-items: stretch;
}
.resource-kicker {
margin: 0 0 0.5rem;
color: #e2cf95;
font-size: 0.78rem;
letter-spacing: 0.14em;
text-transform: uppercase;
}
.resource-card-qr {
display: grid;
grid-template-columns: minmax(190px, 220px) minmax(0, 1fr);
gap: 1.25rem;
align-items: center;
}
.qr-shell {
padding: 0.9rem;
background: rgba(255, 248, 225, 0.96);
border-radius: 1rem;
box-shadow:
0 0 0 1px rgba(184, 115, 51, 0.26),
0 0 0 8px rgba(46, 125, 50, 0.06);
}
.text-link {
color: #f4e4b6;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.18em;
word-break: break-word;
}
.site-footer {
padding: 0 0 3rem;
text-align: center;
}
.footer-motto {
margin: 0;
font-family: "Cormorant Garamond", serif;
font-size: 1.8rem;
color: #f4e4b6;
}
.footer-note {
margin: 0.45rem 0 0;
}
@keyframes rise {
from {
opacity: 0;
transform: translateY(18px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media (max-width: 960px) {
.hero,
.two-column,
.bilingual-grid,
.pillar-grid,
.symbol-grid,
.connect-grid,
.resource-card-qr,
.fact-grid,
.fact-stack {
grid-template-columns: 1fr;
}
.site-header {
gap: 1rem;
align-items: flex-start;
flex-direction: column;
padding-top: 1rem;
}
.site-nav {
flex-wrap: wrap;
gap: 0.9rem 1rem;
}
.hero {
min-height: auto;
padding-top: 2.25rem;
gap: 1.5rem;
}
.seal-frame {
width: min(100%, 420px);
}
.invocation {
max-width: 40rem;
}
h1,
h2 {
max-width: none;
}
}
@media (max-width: 640px) {
body {
line-height: 1.5;
}
.section {
padding: 2.7rem 0;
}
.site-header,
.section,
.site-footer {
width: min(100% - 1.25rem, 1160px);
}
.site-header {
gap: 0.85rem;
padding-top: 0.85rem;
}
.brand {
gap: 0.55rem;
font-size: 0.82rem;
letter-spacing: 0.09em;
}
.brand-mark {
width: 1.8rem;
height: 1.8rem;
}
.site-nav {
gap: 0.7rem 0.9rem;
font-size: 0.9rem;
}
.site-nav a::after {
bottom: -0.2rem;
}
.panel {
padding: 1.1rem;
}
.fact-card,
.pillar-card,
.symbol-card,
.resource-card {
border-radius: 1.2rem;
}
.hero {
padding-top: 1.4rem;
gap: 1.2rem;
}
.hero-center {
gap: 0.1rem;
}
.seal-frame {
width: 100%;
padding: 0.9rem;
border-radius: 1.4rem;
}
.seal-frame::before {
inset: 0.7rem;
border-radius: 1rem;
}
.eyebrow,
.language-label,
.resource-kicker,
.fact-card dt {
letter-spacing: 0.12em;
}
h3 {
font-size: 1.55rem;
}
.founding-date {
margin-top: 0.55rem;
font-size: clamp(2.55rem, 13vw, 4.3rem);
letter-spacing: 0.08em;
line-height: 0.95;
}
.founding-time {
font-size: 1rem;
letter-spacing: 0.26em;
}
.founding-equinox,
.founding-subtitle {
font-size: 0.78rem;
letter-spacing: 0.12em;
}
.invocation {
margin-top: 1rem;
padding: 0.95rem 1rem;
font-size: 0.94rem;
}
.language-card {
padding: 1.2rem;
border-radius: 1.25rem;
}
.language-card p,
.two-column p,
.pillar-card p,
.symbol-card p,
.resource-card p,
.footer-note {
font-size: 0.96rem;
}
.lede {
margin-top: 0.7rem;
font-size: 1rem;
}
.hero-actions {
flex-direction: column;
margin: 1.25rem 0;
gap: 0.75rem;
}
.button {
width: 100%;
min-height: 3rem;
padding: 0.82rem 1rem;
}
.fact-card {
padding: 1rem;
}
.fact-card dd {
font-size: 1.05rem;
}
.section-heading {
margin-bottom: 1.3rem;
}
.two-column {
gap: 1.15rem;
}
.pillar-grid,
.symbol-grid,
.connect-grid,
.bilingual-grid,
.fact-stack {
gap: 0.85rem;
}
.symbol-card img {
width: min(100%, 210px);
margin-bottom: 0.95rem;
}
.resource-card-qr {
gap: 1rem;
}
.qr-shell {
padding: 0.7rem;
max-width: 240px;
margin: 0 auto;
}
.site-footer {
padding-bottom: 2.2rem;
}
.footer-motto {
font-size: 1.45rem;
}
}
@media (max-width: 420px) {
.site-header,
.section,
.site-footer {
width: calc(100% - 1rem);
}
.brand {
font-size: 0.76rem;
letter-spacing: 0.07em;
}
.site-nav {
font-size: 0.84rem;
gap: 0.55rem 0.75rem;
}
.founding-date {
font-size: clamp(2.2rem, 14vw, 3.5rem);
letter-spacing: 0.06em;
}
.founding-time {
letter-spacing: 0.2em;
}
.founding-equinox,
.founding-subtitle {
letter-spacing: 0.08em;
}
h2 {
font-size: clamp(2rem, 10vw, 2.6rem);
}
.language-card,
.pillar-card,
.symbol-card,
.resource-card,
.panel {
border-radius: 1rem;
}
}